add active state on accent button for high contrast

microsoft · May 18, 2021 · 49d4268 · 49d4268
1 parent 6635a5f
commit 49d4268
Showing 1 changed file with 2 additions and 1 deletion.
diff --git a/packages/web-components/src/styles/patterns/button.ts b/packages/web-components/src/styles/patterns/button.ts
@@ -203,7 +203,8 @@ export const AccentButtonStyles = css`
             color: ${SystemColors.HighlightText};
         }
 
-        :host([appearance="accent"]) .control:hover {
+        :host([appearance="accent"]) .control:hover,
+        :host([appearance="accent"]:active) .control:active {
             background: ${SystemColors.HighlightText};
             border-color: ${SystemColors.Highlight};
             color: ${SystemColors.Highlight};