Skip to content

Commit

Permalink
Removing Tritanopia colorblind scale and replacing with override (#562)
Browse files Browse the repository at this point in the history
* Replace tritanopia scale with overrides

* add changeset
  • Loading branch information
lukasoppermann authored May 3, 2023
1 parent f9f5473 commit d88095e
Show file tree
Hide file tree
Showing 3 changed files with 230 additions and 2 deletions.
5 changes: 5 additions & 0 deletions .changeset/tiny-wolves-prove.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@primer/primitives': patch
---

Replaces light Tritanopia scale with overrides
7 changes: 5 additions & 2 deletions scripts/themes.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,11 +16,14 @@ export const themes: TokenBuildInput[] = [
source: [
`src/tokens/functional/color/light/*.json5`,
`src/tokens/functional/color/scales.json5`,
`src/tokens/functional/color/light/overrides/light.tritanopia.json5`,
`src/tokens/functional/shadow/light.json5`,
`src/tokens/functional/border/light.json5`,
`src/tokens/functional/color/light/overrides/light.tritanopia.json5`,
],
include: [
`src/tokens/base/color/light/light.json5`,
// `src/tokens/base/color/light/light.tritanopia.json5`
],
include: [`src/tokens/base/color/light/light.json5`, `src/tokens/base/color/light/light.tritanopia.json5`],
},
{
filename: 'light-colorblind',
Expand Down
220 changes: 220 additions & 0 deletions src/tokens/functional/color/light/overrides/light.tritanopia.json5
Original file line number Diff line number Diff line change
@@ -0,0 +1,220 @@
/**
* Light tritanopia theme
* @extends all functional tokens
* @description All overwrites for functional color tokens for this theme are in this file
*/
{
fgColor: {
success: {
$value: '{base.color.blue.5}',
$type: 'color',
},
severe: {
$value: '{base.color.red.5}',
$type: 'color',
},
},
bgColor: {
success: {
muted: {
$value: '{base.color.blue.0}',
$type: 'color',
},
emphasis: {
$value: '{base.color.blue.4}',
$type: 'color',
mix: {
color: '{base.color.blue.5}',
weight: 0.75,
},
},
},
severe: {
muted: {
$value: '{base.color.red.0}',
$type: 'color',
},
emphasis: {
$value: '{base.color.red.5}',
$type: 'color',
},
},
},
borderColor: {
success: {
muted: {
$value: '{base.color.blue.3}',
$type: 'color',
alpha: 0.4,
},
emphasis: {
$value: '{base.color.blue.4}',
$type: 'color',
},
},
severe: {
muted: {
$value: '{base.color.red.3}',
$type: 'color',
alpha: 0.4,
},
emphasis: {
$value: '{base.color.red.5}',
$type: 'color',
},
},
},
diffBlob: {
addition: {
bgColor: {
num: {
$value: '{base.color.blue.1}',
$type: 'color',
mix: {
color: '{base.color.blue.0}',
weight: 0.8,
},
},
line: {
$value: '{base.color.blue.0}',
$type: 'color',
},
word: {
$value: '{base.color.blue.1}',
$type: 'color',
},
},
},
},
codeMirror: {
syntax: {
fgColor: {
variable: {
$value: '{base.color.red.6}',
$type: 'color',
},
},
},
},
button: {
primary: {
bgColor: {
hover: {
$value: '{bgColor.success.emphasis}',
$type: 'color',
mix: {
color: '{base.color.blue.6}',
weight: 0.2,
},
},
active: {
$value: '{bgColor.success.emphasis}',
$type: 'color',
mix: {
color: '{base.color.blue.6}',
weight: 0.4,
},
},
disabled: {
$value: '{base.color.blue.4}',
$type: 'color',
mix: {
color: '{base.color.blue.0}',
weight: 0.6,
},
},
},
shadow: {
selected: {
$value: [
{
color: '{base.color.blue.9}',
alpha: 0.3,
offsetX: '0px',
offsetY: '1px',
blur: '0px',
spread: '0px',
inset: true,
},
],
$type: 'shadow',
},
},
},
},
color: {
ansi: {
green: {
$value: '{base.color.blue.6}',
$type: 'color',
},
'green-bright': {
$value: '{base.color.blue.5}',
$type: 'color',
},
},
prettylights: {
syntax: {
'string-regexp': {
$value: '{base.color.blue.6}',
$type: 'color',
},
variable: {
$value: '{base.color.red.6}',
$type: 'color',
},
markup: {
inserted: {
text: {
$value: '{base.color.blue.6}',
$type: 'color',
},
bg: {
$value: '{base.color.blue.0}',
$type: 'color',
},
},
changed: {
text: {
$value: '{base.color.red.6}',
$type: 'color',
},
bg: {
$value: '{base.color.red.1}',
$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}'},
},
orange: {
'0': {$value: '{base.color.red.0}'},
'1': {$value: '{base.color.red.1}'},
'2': {$value: '{base.color.red.2}'},
'3': {$value: '{base.color.red.3}'},
'4': {$value: '{base.color.red.4}'},
'5': {$value: '{base.color.red.5}'},
'6': {$value: '{base.color.red.6}'},
'7': {$value: '{base.color.red.7}'},
'8': {$value: '{base.color.red.8}'},
'9': {$value: '{base.color.red.9}'},
},
},
},
}

0 comments on commit d88095e

Please sign in to comment.