Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(Themes): add in G80 theme #8478

Merged
merged 7 commits into from
Apr 27, 2021
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
fix(Tokens): update g80 theme based on design
  • Loading branch information
tw15egan committed Apr 26, 2021

Verified

This commit was signed with the committer’s verified signature.
darccio Dario Castañé
commit 68f9fa1e67f5de43c7df3fcda3658d455b41f448
Original file line number Diff line number Diff line change
@@ -138,7 +138,6 @@ Array [
"formatTokenName",
"g10",
"g100",
"g80",
"g90",
"getTypeSize",
"gray",
19 changes: 9 additions & 10 deletions packages/themes/src/g80.js
Original file line number Diff line number Diff line change
@@ -112,7 +112,6 @@ export const layerHover = adjustLightness(layer, +7);
export const fieldHover = adjustLightness(field, +7);
export const backgroundInverseHover = adjustLightness(backgroundInverse, -5);

// No token listed in notion doc
export const linkPrimaryHover = blue30;
tw15egan marked this conversation as resolved.
Show resolved Hide resolved

export const buttonDangerHover = adjustLightness(buttonDangerPrimary, -8);
@@ -174,7 +173,7 @@ export const link02 = linkSecondary;
export const inverseLink = linkInverse;

export const field01 = field;
export const field02 = gray70;
export const field02 = gray60;

export const inverse01 = textInverse;
export const inverse02 = backgroundInverse;
@@ -202,26 +201,26 @@ export const activePrimary = buttonPrimaryActive;

export const hoverPrimaryText = linkPrimaryHover;

export const hoverSecondary = '#606060';
export const activeSecondary = gray80;
export const hoverSecondary = buttonSecondaryHover;
export const activeSecondary = buttonSecondaryActive;

export const hoverTertiary = gray10;
export const activeTertiary = gray30;
export const hoverTertiary = buttonTertiaryHover;
export const activeTertiary = buttonTertiaryActive;

export const hoverUI = backgroundHover;
export const hoverLightUI = '#656565';
export const hoverLightUI = '#5E5E5E';
export const activeUI = backgroundActive;
export const activeLightUI = gray50;
export const selectedUI = backgroundSelected;
export const selectedLightUI = gray60;
export const selectedLightUI = gray50;
export const inverseHoverUI = backgroundInverseHover;

export const hoverSelectedUI = backgroundSelectedHover;
export const hoverSelectedUI = layerSelectedHover;

export const hoverDanger = buttonDangerHover;
export const activeDanger = buttonDangerActive;

export const hoverRow = '#4c4c4c';
export const hoverRow = layerHover;

export const visitedLink = linkVisited;