diff --git a/change/@fluentui-react-combobox-dropdown-high-contrast-border.json b/change/@fluentui-react-combobox-dropdown-high-contrast-border.json new file mode 100644 index 00000000000000..518089d84f8bdf --- /dev/null +++ b/change/@fluentui-react-combobox-dropdown-high-contrast-border.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "fix: render filled Dropdown boundaries in high contrast themes", + "packageName": "@fluentui/react-combobox", + "email": "bernardo.sunderhus@gmail.com", + "dependentChangeType": "patch" +} diff --git a/packages/react-components/react-combobox/library/src/components/Dropdown/useDropdownStyles.styles.ts b/packages/react-components/react-combobox/library/src/components/Dropdown/useDropdownStyles.styles.ts index 244ef16f28b09c..3b2f3b57a8e366 100644 --- a/packages/react-components/react-combobox/library/src/components/Dropdown/useDropdownStyles.styles.ts +++ b/packages/react-components/react-combobox/library/src/components/Dropdown/useDropdownStyles.styles.ts @@ -171,11 +171,11 @@ const useStyles = makeStyles({ }, 'filled-lighter': { backgroundColor: tokens.colorNeutralBackground1, - border: `${tokens.strokeWidthThin} solid transparent`, + border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`, }, 'filled-darker': { backgroundColor: tokens.colorNeutralBackground3, - border: `${tokens.strokeWidthThin} solid transparent`, + border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`, }, invalid: { ':not(:focus-within),:hover:not(:focus-within)': {