granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add colors for highlights

Browse source
This commit is contained in:
Justin Edmund 2023-07-06 01:53:08 -07:00
parent ce57014677
commit 5a3cebf9ff
2 changed files with 33 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
styles/themes.scss
View file

@ -63,6 +63,12 @@
--toolbar-item-text-hover: #{$toolbar--item--text--light--hover};
--toolbar-item-text-active: #{$toolbar--item--text--light--active};
// Dark - Highlights
--highlight-bg: #{$highlight--bg--light};
--highlight-bg-hover: #{$highlight--bg--light--hover};
--highlight-text: #{$highlight--text--light};
--highlight-text-hover: #{$highlight--text--light--hover};
// Light - Placeholders
--placeholder-bound-bg: #{$placeholder--bound--bg--light};
--placeholder-bound-bg-hover: #{$placeholder--bound--bg--light--hover};
@ -271,6 +277,12 @@
--toolbar-item-text-hover: #{$toolbar--item--text--dark--hover};
--toolbar-item-text-active: #{$toolbar--item--text--dark--active};
// Dark - Highlights
--highlight-bg: #{$highlight--bg--dark};
--highlight-bg-hover: #{$highlight--bg--dark--hover};
--highlight-text: #{$highlight--text--dark};
--highlight-text-hover: #{$highlight--text--dark--hover};
// Dark - Placeholders
--placeholder-bound-bg: #{$placeholder--bound--bg--dark};
--placeholder-bound-bg-hover: #{$placeholder--bound--bg--dark--hover};

21
styles/variables.scss
View file

@ -79,6 +79,13 @@ $orange-75: #ffb461;
$orange-80: #facea7;
$orange-90: #ffebd9;
// Yellow -- Highlights
$yellow-10: #4d3703;
$yellow-30: #956d11;
$yellow-50: #c8a657;
$yellow-70: #fedc8d;
$yellow-90: #ffed4c;
// Colors -- Interface
$blue: #275dc5;
$red: #ff6161;
@ -96,6 +103,7 @@ $accent--yellow--light: #c89d39;
$accent--yellow--dark: #f9cc64;
$yellow-text-10: #a39200;
$yellow-text-20: #ffed4c;
$highlight-yellow: #ffed4c55;
$accent--yellow--00: #463805;
$accent--yellow--20: #7f6a00;
@ -383,6 +391,19 @@ $toolbar--item--text--dark--hover: $grey-90;
$toolbar--item--text--light--active: $grey-100;
$toolbar--item--text--dark--active: $grey-00;
// Color Definitions: Highlights
$highlight--bg--light: $yellow-70;
$highlight--bg--dark: $yellow-50;
$highlight--bg--light--hover: $yellow-50;
$highlight--bg--dark--hover: $yellow-70;
$highlight--text--light: $yellow-30;
$highlight--text--dark: $yellow-10;
$highlight--text--light--hover: $yellow-10;
$highlight--text--dark--hover: $yellow-30;
// Color Definitions: Element Toggle
$toggle--bg--light: $grey-90;
$toggle--bg--dark: $grey-15;