Adding color slot: borderActive4 (microsoft#17391)

* Adding border color * updating changelog
ling1726 · Mar 12, 2021 · 151ee1e · 151ee1e
1 parent 8789ee1
commit 151ee1e
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 0 deletions.
diff --git a/packages/fluentui/CHANGELOG.md b/packages/fluentui/CHANGELOG.md
@@ -60,6 +60,7 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm
 - Added `autoSize` prop to make `Popper` responsive @yuanboxue-amber ([#17159](https://github.com/microsoft/fluentui/pull/17159))
 - Add `ToolbarMenuItemContent` to wrap content in span @yuanboxue-amber ([#17264](https://github.com/microsoft/fluentui/pull/17264))
 - Added `ChatOffIcon`. @TanelVari ([#17360](https://github.com/microsoft/fluentui/pull/17360))
+- Add `borderActive4` color slot @notandrew ([#17391](https://github.com/microsoft/fluentui/pull/17391))
 
 ## Performance
 

diff --git a/packages/fluentui/react-northstar/src/themes/teams-dark/colors.ts b/packages/fluentui/react-northstar/src/themes/teams-dark/colors.ts
@@ -58,6 +58,7 @@ export const colorScheme: ColorSchemeMapping = {
     borderActive1: colors.grey[850],
     borderActive2: colors.grey[900],
     borderActive3: colors.grey[650],
+    borderActive4: colors.grey[440],
 
     foregroundFocus: colors.white,
     foregroundFocus1: colors.grey[250],

diff --git a/packages/fluentui/react-northstar/src/themes/teams-high-contrast/colors.ts b/packages/fluentui/react-northstar/src/themes/teams-high-contrast/colors.ts
@@ -99,6 +99,7 @@ export const colorScheme: ColorSchemeMapping = {
     borderActive1: accessibleCyan,
     borderActive2: accessibleCyan,
     borderActive3: accessibleCyan,
+    borderActive4: accessibleCyan,
 
     foregroundFocus: colors.black,
     foregroundFocus1: colors.black,

diff --git a/packages/fluentui/react-northstar/src/themes/teams/colors.ts b/packages/fluentui/react-northstar/src/themes/teams/colors.ts
@@ -38,6 +38,7 @@ export const naturalColors: TeamsNaturalColors = {
     300: '#B3B0AD', // dark03
     350: '#979593', // light04
     400: '#8A8886', // dark04
+    440: '#666666',
     450: '#605E5C', // light03, dark06, $app-gray-20-theme-agnostic, old $message-highlight-color-darktheme
     500: '#484644', // light02, dark08
     550: '#3B3A39', // dark09
@@ -264,6 +265,7 @@ export const colorScheme: ColorSchemeMapping<ColorScheme, TeamsColorNames> = {
     borderActive1: colors.grey[150],
     borderActive2: colors.grey[200],
     borderActive3: colors.grey[150], // divider
+    borderActive4: colors.grey[400],
 
     foregroundFocus: colors.grey[750],
     foregroundFocus1: colors.grey[500],