Add scrollbar-width: thin to white-label

microsoft · Nov 14, 2024 · 6219651 · 6219651
1 parent 87859e6
commit 6219651
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/packages/component/src/Styles/StyleSet/RenderMarkdown.ts b/packages/component/src/Styles/StyleSet/RenderMarkdown.ts
@@ -67,12 +67,13 @@ export default function createMarkdownStyle() {
         content: "'['"
       },
 
-      '& [data-math-type=block]': {
+      '& [data-math-type=block] math': {
         alignItems: 'center',
         display: 'flex',
         flexDirection: 'column',
         overflowX: 'auto',
-        overflowY: 'clip'
+        overflowY: 'clip',
+        scrollbarWidth: 'thin'
       },
 
       '& [data-math-type=inline] math': {

diff --git a/packages/fluent-theme/src/components/theme/Theme.module.css b/packages/fluent-theme/src/components/theme/Theme.module.css
@@ -225,7 +225,7 @@
 /* Scrollbars */
 :global(.webchat-fluent).theme :global(.webchat__basic-transcript .webchat__basic-transcript__scrollable),
 :global(.webchat-fluent).theme :global(.webchat__view-code-dialog__code-body),
-:global(.webchat-fluent).theme :global(.webchat__render-markdown [data-math-type='block']) {
+:global(.webchat-fluent).theme :global(.webchat__render-markdown [data-math-type='block'] math) {
   /* Edge uses -webkit-scrollbar if scrollbar-* is not set */
   scrollbar-color: unset;
   scrollbar-width: unset;