Skip to content

Commit

Permalink
Dark protanopia deuteranopia adding overrides (#608)
Browse files Browse the repository at this point in the history 
* adding overrides

* add changeset
  • Loading branch information
@lukasoppermann @langermank
lukasoppermann authored and langermank committed Jun 1, 2023
1 parent f881993 commit 089d28e
Show file tree
Hide file tree
Showing 3 changed files with 276 additions and 3 deletions.
5 changes: 5 additions & 0 deletions .changeset/hip-trains-peel.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@primer/primitives': patch
---

Replace dark-colorblind scale with overrides
7 changes: 5 additions & 2 deletions scripts/themes.config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -87,11 +87,14 @@ export const themes: TokenBuildInput[] = [
source: [
`src/tokens/functional/color/dark/*.json5`,
`src/tokens/functional/color/scales.json5`,
`src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5`,
`src/tokens/functional/shadow/dark.json5`,
`src/tokens/functional/border/dark.json5`,
`src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5`,
],
include: [
`src/tokens/base/color/dark/dark.json5`,
// , `src/tokens/base/color/dark/dark.protanopia-deuteranopia.json5`
],
include: [`src/tokens/base/color/dark/dark.json5`, `src/tokens/base/color/dark/dark.protanopia-deuteranopia.json5`],
},
{
filename: 'dark-high-contrast',
Expand Down
267 changes: 266 additions & 1 deletion src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,14 @@
*/
{
fgColor: {
success: {
$value: '{base.color.blue.3}',
$type: 'color',
},
danger: {
$value: '{base.color.orange.4}',
$type: 'color',
},
open: {
$value: '{base.color.orange.3}',
$type: 'color',
Expand All @@ -15,6 +23,28 @@
},
},
bgColor: {
success: {
muted: {
$value: '{base.color.blue.4}',
$type: 'color',
alpha: 0.15,
},
emphasis: {
$value: '{base.color.blue.5}',
$type: 'color',
},
},
danger: {
muted: {
$value: '{base.color.orange.4}',
$type: 'color',
alpha: 0.1,
},
emphasis: {
$value: '{base.color.orange.5}',
$type: 'color',
},
},
open: {
muted: {
$value: '{base.color.orange.4}',
Expand Down Expand Up @@ -61,15 +91,250 @@
$type: 'color',
},
},
success: {
muted: {
$value: '{base.color.blue.4}',
$type: 'color',
alpha: 0.4,
},
emphasis: {
$value: '{base.color.blue.5}',
$type: 'color',
},
},
danger: {
muted: {
$value: '{base.color.orange.4}',
$type: 'color',
alpha: 0.4,
},
emphasis: {
$value: '{base.color.orange.5}',
$type: 'color',
},
},
},
control: {
danger: {
fgColor: {
hover: {
$value: '{base.color.orange.3}',
$type: 'color',
},
},
},
},
codeMirror: {
syntax: {
fgColor: {
keyword: {
$value: '{base.color.orange.3}',
$type: 'color',
},
storage: {
$value: '{base.color.orange.3}',
$type: 'color',
},
},
},
},
button: {
primary: {
bgColor: {
hover: {
$value: '{bgColor.success.emphasis}',
$type: 'color',
mix: {
color: '{base.color.blue.3}',
weight: 0.2,
},
},
active: {
$value: '{bgColor.success.emphasis}',
$type: 'color',
mix: {
color: '{base.color.blue.3}',
weight: 0.4,
},
},
disabled: {
$value: '{base.color.green.6}',
$value: '{base.color.blue.6}',
$type: 'color',
mix: null,
},
},
},
danger: {
bgColor: {
hover: {
$value: '{base.color.orange.6}',
$type: 'color',
},
active: {
$value: '{base.color.orange.6}',
$type: 'color',
mix: {
color: '{base.color.orange.4}',
weight: 0.4,
},
},
},
borderColor: {
hover: {
$value: '{base.color.orange.6}',
$type: 'color',
},
},
},
},
diffBlob: {
addition: {
bgColor: {
num: {
$value: '{base.color.blue.3}',
$type: 'color',
alpha: 0.3,
},
line: {
$value: '{base.color.blue.4}',
$type: 'color',
alpha: 0.15,
mix: null,
},
word: {
$value: '{base.color.blue.4}',
$type: 'color',
alpha: 0.4,
},
},
},
deletion: {
bgColor: {
num: {
$value: '{base.color.orange.4}',
$type: 'color',
alpha: 0.3,
},
line: {
$value: '{base.color.orange.4}',
$type: 'color',
alpha: 0.15,
mix: null,
},
word: {
$value: '{base.color.orange.4}',
$type: 'color',
alpha: 0.4,
},
},
},
},
color: {
ansi: {
green: {
$value: '{base.color.blue.3}',
$type: 'color',
},
'green-bright': {
$value: '{base.color.blue.2}',
$type: 'color',
},
red: {
$value: '{base.color.orange.3}',
$type: 'color',
},
'red-bright': {
$value: '{base.color.orange.2}',
$type: 'color',
},
},
prettylights: {
syntax: {
'entity-tag': {
$value: '{base.color.blue.1}',
$type: 'color',
},
keyword: {
$value: '{base.color.orange.3}',
$type: 'color',
},
brackethighlighter: {
unmatched: {
$value: '{base.color.orange.4}',
$type: 'color',
},
},
invalid: {
illegal: {
bg: {
$value: '{base.color.orange.7}',
$type: 'color',
},
},
},
carriage: {
return: {
bg: {
$value: '{base.color.orange.6}',
$type: 'color',
},
},
},
'string-regexp': {
$value: '{base.color.blue.1}',
$type: 'color',
},
markup: {
deleted: {
text: {
$value: '{base.color.orange.0}',
$type: 'color',
},
bg: {
$value: '{base.color.orange.8}',
$type: 'color',
},
},
inserted: {
text: {
$value: '{base.color.blue.0}',
$type: 'color',
},
bg: {
$value: '{base.color.blue.8}',
$type: 'color',
},
},
},
},
},
/**
* @description All overwrites for color scales
*/
scale: {
green: {
'0': {$value: '{base.color.blue.0}'},
'1': {$value: '{base.color.blue.1}'},
'2': {$value: '{base.color.blue.2}'},
'3': {$value: '{base.color.blue.3}'},
'4': {$value: '{base.color.blue.4}'},
'5': {$value: '{base.color.blue.5}'},
'6': {$value: '{base.color.blue.6}'},
'7': {$value: '{base.color.blue.7}'},
'8': {$value: '{base.color.blue.8}'},
'9': {$value: '{base.color.blue.9}'},
},
red: {
'0': {$value: '{base.color.orange.0}'},
'1': {$value: '{base.color.orange.1}'},
'2': {$value: '{base.color.orange.2}'},
'3': {$value: '{base.color.orange.3}'},
'4': {$value: '{base.color.orange.4}'},
'5': {$value: '{base.color.orange.5}'},
'6': {$value: '{base.color.orange.6}'},
'7': {$value: '{base.color.orange.7}'},
'8': {$value: '{base.color.orange.8}'},
'9': {$value: '{base.color.orange.9}'},
},
},
},
Expand Down

0 comments on commit 089d28e

Please sign in to comment.