Skip to content

Commit

Permalink
add dark-HC overrides for button
Browse files Browse the repository at this point in the history
  • Loading branch information
@lukasoppermann
lukasoppermann committed Jan 31, 2025
1 parent ff9c5d0 commit 49eccae
Show file tree
Hide file tree
Showing 2 changed files with 77 additions and 143 deletions.
77 changes: 77 additions & 0 deletions src/tokens/component/button.json5
View file
Original file line number Diff line number Diff line change
Expand Up @@ -269,6 +269,9 @@
'dark-protanopia-deuteranopia': {
$value: '#2a7aef',
},
'dark-high-contrast': {
$value: '#08792b',
},
},
},
},
Expand Down Expand Up @@ -296,6 +299,9 @@
'dark-protanopia-deuteranopia': {
$value: '#3685f3',
},
'dark-high-contrast': {
$value: '#109135',
},
},
},
},
Expand Down Expand Up @@ -323,6 +329,9 @@
'dark-protanopia-deuteranopia': {
$value: '{base.color.blue.6}',
},
'dark-high-contrast': {
$value: '#048f2f',
},
},
},
},
Expand All @@ -344,6 +353,10 @@
$value: '{base.color.neutral.13}',
alpha: 0.1,
},
'dark-high-contrast': {
$value: '{base.color.green.2}',
alpha: 1,
},
},
},
alpha: 0.15,
Expand All @@ -363,6 +376,10 @@
dark: {
$value: '{button.primary.borderColor.rest}',
},
'dark-high-contrast': {
$value: '{base.color.green.2}',
alpha: 1,
},
},
},
},
Expand All @@ -381,6 +398,10 @@
dark: {
$value: '{button.primary.borderColor.rest}',
},
'dark-high-contrast': {
$value: '{base.color.green.2}',
alpha: 1,
},
},
},
},
Expand Down Expand Up @@ -408,6 +429,10 @@
'dark-protanopia-deuteranopia': {
$value: '#1158c7',
},
'dark-high-contrast': {
$value: '{base.color.green.2}',
alpha: 0.4,
},
},
},
},
Expand Down Expand Up @@ -507,6 +532,9 @@
'dark-dimmed': {
$value: '{base.color.neutral.10}',
},
'dark-high-contrast': {
$value: '{base.color.neutral.11}',
},
},
},
},
Expand All @@ -528,6 +556,9 @@
'dark-dimmed': {
$value: '{base.color.neutral.10}',
},
'dark-high-contrast': {
$value: '{base.color.neutral.11}',
},
},
},
},
Expand Down Expand Up @@ -584,6 +615,10 @@
dark: {
$value: '{control.transparent.bgColor.hover}',
},
'dark-high-contrast': {
$value: '{base.color.neutral.2}',
alpha: null,
},
},
},
},
Expand All @@ -602,6 +637,10 @@
dark: {
$value: '{control.transparent.bgColor.active}',
},
'dark-high-contrast': {
$value: '{base.color.neutral.3}',
alpha: null,
},
},
},
},
Expand Down Expand Up @@ -901,6 +940,9 @@
'dark-protanopia-deuteranopia': {
$value: '{fgColor.danger}',
},
'dark-high-contrast': {
$value: '{base.color.red.2}',
},
},
},
},
Expand Down Expand Up @@ -983,6 +1025,9 @@
'dark-protanopia-deuteranopia': {
$value: '#f0883e',
},
'dark-high-contrast': {
$value: '#ffb1af',
},
},
},
},
Expand Down Expand Up @@ -1042,6 +1087,9 @@
'dark-protanopia-deuteranopia': {
$value: '{base.color.orange.6}',
},
'dark-high-contrast': {
$value: '{bgColor.danger.emphasis}',
},
},
},
},
Expand All @@ -1066,6 +1114,9 @@
'dark-protanopia-deuteranopia': {
$value: '#b5531d',
},
'dark-high-contrast': {
$value: '{bgColor.danger.emphasis}',
},
},
},
},
Expand Down Expand Up @@ -1122,6 +1173,10 @@
dark: {
$value: '{button.primary.borderColor.rest}',
},
'dark-high-contrast': {
$value: '{base.color.red.2}',
alpha: 1,
},
},
},
},
Expand All @@ -1140,6 +1195,10 @@
dark: {
$value: '{button.danger.borderColor.hover}',
},
'dark-high-contrast': {
$value: '{base.color.red.2}',
alpha: 1,
},
},
},
},
Expand All @@ -1164,6 +1223,9 @@
'dark-dimmed': {
$value: '{base.color.neutral.8}',
},
'dark-high-contrast': {
$value: '{base.color.neutral.10}',
},
},
},
},
Expand All @@ -1185,6 +1247,9 @@
'dark-dimmed': {
$value: '{base.color.neutral.5}',
},
'dark-high-contrast': {
$value: '{control.bgColor.rest}',
},
},
},
},
Expand Down Expand Up @@ -1273,6 +1338,10 @@
$value: '{base.color.green.9}',
alpha: 0.2,
},
'dark-high-contrast': {
$value: '{base.color.neutral.0}',
alpha: 0.15,
},
},
},
alpha: 0.2,
Expand Down Expand Up @@ -1419,6 +1488,10 @@
$value: '{base.color.neutral.13}',
alpha: 0.2,
},
'dark-high-contrast': {
$value: '{base.color.neutral.0}',
alpha: 0.15,
},
},
},
alpha: 0.2,
Expand Down Expand Up @@ -1459,6 +1532,10 @@
$value: '{base.color.red.9}',
alpha: 0.2,
},
'dark-high-contrast': {
$value: '{base.color.neutral.0}',
alpha: 0.15,
},
},
},
alpha: 0.1,
Expand Down
143 changes: 0 additions & 143 deletions src/tokens/functional/color/dark/overrides/dark.high-contrast.json5
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,149 +4,6 @@
* @description All overwrites for functional color tokens for dark high contrast color mode are in this file
*/
{
button: {
primary: {
bgColor: {
hover: {
$value: '#08792b',
$type: 'color',
},
active: {
$value: '#109135',
$type: 'color',
},
disabled: {
$value: '#048f2f',
$type: 'color',
},
},
borderColor: {
rest: {
$value: '{base.color.green.2}',
$type: 'color',
alpha: 1,
},
hover: {
$value: '{base.color.green.2}',
$type: 'color',
alpha: 1,
},
active: {
$value: '{base.color.green.2}',
$type: 'color',
alpha: 1,
},
disabled: {
$value: '{base.color.green.2}',
$type: 'color',
alpha: 0.4,
},
},
},
invisible: {
iconColor: {
rest: {
$value: '{base.color.neutral.11}',
$type: 'color',
},
hover: {
$value: '{base.color.neutral.11}',
$type: 'color',
},
},
bgColor: {
hover: {
$value: '{base.color.neutral.2}',
$type: 'color',
alpha: null,
},
active: {
$value: '{base.color.neutral.3}',
$type: 'color',
alpha: null,
},
},
},
danger: {
fgColor: {
rest: {
$value: '{base.color.red.2}',
$type: 'color',
$extensions: {
'org.primer.figma': {
collection: 'mode',

group: 'component (internal)',
scopes: ['fgColor'],
},
},
},
},
borderColor: {
hover: {
$value: '{base.color.red.2}',
$type: 'color',
alpha: 1,
},
active: {
$value: '{base.color.red.2}',
$type: 'color',
alpha: 1,
},
},
bgColor: {
hover: {
$value: '{bgColor.danger.emphasis}',
$type: 'color',
},
active: {
$value: '{bgColor.danger.emphasis}',
$type: 'color',
},
},
iconColor: {
rest: {
$value: '#ffb1af',
$type: 'color',
},
},
},
inactive: {
bgColor: {
$value: '{control.bgColor.rest}',
$type: 'color',
},
fgColor: {
$value: '{base.color.neutral.10}',
$type: 'color',
},
},
},
buttonCounter: {
primary: {
bgColor: {
rest: {
$value: '{base.color.neutral.0}',
$type: 'color',
alpha: 0.15,
},
},
},
danger: {
bgColor: {
hover: {
$value: '{base.color.neutral.0}',
$type: 'color',
alpha: 0.15,
},
rest: {
$value: '{base.color.neutral.0}',
$type: 'color',
alpha: 0.15,
},
},
},
},
display: {
blue: {
bgColor: {
Expand Down

0 comments on commit 49eccae

Please sign in to comment.