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

Update themes and variables

Browse source
This commit is contained in:
Justin Edmund 2023-06-30 22:53:56 -07:00
parent 1aebea8ba3
commit 43d5faeead
2 changed files with 27 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
styles/themes.scss
View file

@ -58,11 +58,9 @@
--input-bound-bg-hover: #{$input--bound--bg--light--hover}; --input-bound-bg-hover: #{$input--bound--bg--light--hover};
// Light - Selects // Light - Selects
--select-bg: #{$select--bg--light}; --select-bg: #{$select--trigger--bg--light};
--select-contained-bg: #{$select--contained--bg--light}; --select-contained-bg: #{$select--trigger--contained--bg--light};
--select-contained-bg-hover: #{$select--contained--bg--light--hover}; --select-contained-bg-hover: #{$select--trigger--contained--bg--light--hover};
--select-modal-bg: #{$select--modal--bg--light};
--select-modal-bg-hover: #{$select--modal--bg--light--hover};
--select-separator: #{$select--separator--light}; --select-separator: #{$select--separator--light};
--select-content-contained-bg: #{$select--content--contained--bg--light}; --select-content-contained-bg: #{$select--content--contained--bg--light};
--option-bg-hover: #{$option--bg--light--hover}; --option-bg-hover: #{$option--bg--light--hover};
@ -98,7 +96,9 @@
--extra-purple-card-bg: #{$extra--purple--card--bg--light}; --extra-purple-card-bg: #{$extra--purple--card--bg--light};
--extra-purple-primary: #{$extra--purple--primary--light}; --extra-purple-primary: #{$extra--purple--primary--light};
--extra-purple-secondary: #{$extra--purple--secondary--light}; --extra-purple-secondary: #{$extra--purple--secondary--light};
--extra-purple-light-text: #{$extra--purple--light--text--light};
--extra-purple-text: #{$extra--purple--text--light}; --extra-purple-text: #{$extra--purple--text--light};
--extra-purple-dark-text: #{$extra--purple--dark--text--dark};
--switch-nub: #{$switch--nub--bg--light}; --switch-nub: #{$switch--nub--bg--light};
@ -163,7 +163,7 @@
--grid-rep-hover: #{$grid--rep--hover--dark}; --grid-rep-hover: #{$grid--rep--hover--dark};
--card-bg: #{$page--element--bg--dark}; --card-bg: #{$page--element--bg--dark};
--bar-bg: #{$grey-10}; --bar-bg: #{$grey-20};
--link-text-hover: #{$text--link--hover--dark}; --link-text-hover: #{$text--link--hover--dark};
@ -216,11 +216,9 @@
--input-bound-bg-hover: #{$input--bound--bg--dark--hover}; --input-bound-bg-hover: #{$input--bound--bg--dark--hover};
// Dark - Selects // Dark - Selects
--select-bg: #{$select--bg--dark}; --select-bg: #{$select--trigger--bg--dark};
--select-contained-bg: #{$select--contained--bg--dark}; --select-contained-bg: #{$select--trigger--contained--bg--dark};
--select-contained-bg-hover: #{$select--contained--bg--dark--hover}; --select-contained-bg-hover: #{$select--trigger--contained--bg--dark--hover};
--select-modal-bg: #{$select--modal--bg--dark};
--select-modal-bg-hover: #{$select--modal--bg--dark--hover};
--select-separator: #{$select--separator--dark}; --select-separator: #{$select--separator--dark};
--select-content-contained-bg: #{$select--content--contained--bg--dark}; --select-content-contained-bg: #{$select--content--contained--bg--dark};
--option-bg-hover: #{$option--bg--dark--hover}; --option-bg-hover: #{$option--bg--dark--hover};
@ -256,7 +254,9 @@
--extra-purple-card-bg: #{$extra--purple--card--bg--dark}; --extra-purple-card-bg: #{$extra--purple--card--bg--dark};
--extra-purple-primary: #{$extra--purple--primary--dark}; --extra-purple-primary: #{$extra--purple--primary--dark};
--extra-purple-secondary: #{$extra--purple--secondary--dark}; --extra-purple-secondary: #{$extra--purple--secondary--dark};
--extra-purple-text-light: #{$extra--purple--light--text--dark};
--extra-purple-text: #{$extra--purple--text--dark}; --extra-purple-text: #{$extra--purple--text--dark};
--extra-purple-text-dark: #{$extra--purple--dark--text--dark};
--switch-nub: #{$switch--nub--bg--dark}; --switch-nub: #{$switch--nub--bg--dark};

31
styles/variables.scss
View file

@ -41,6 +41,7 @@ $grey-00: #000;
$grey-05: #0a0a0a; $grey-05: #0a0a0a;
$grey-10: #111; $grey-10: #111;
$grey-15: #191919; $grey-15: #191919;
$grey-20: #212121;
$grey-25: #232323; $grey-25: #232323;
$grey-30: #2f2f2f; $grey-30: #2f2f2f;
$grey-40: #444; $grey-40: #444;
@ -208,18 +209,16 @@ $input--bound--bg--dark: $grey-15;
$input--bound--bg--dark--hover: $grey-10; $input--bound--bg--dark--hover: $grey-10;
// Color Definitions: Select // Color Definitions: Select
$select--bg--light: $grey-100; $select--trigger--bg--light: $grey-100;
$select--bg--dark: $grey-10; $select--trigger--bg--dark: $grey-10;
$select--contained--bg--light: $grey-85; $select--trigger--contained--bg--light: $grey-85;
$select--contained--bg--light--hover: $grey-80; $select--trigger--contained--bg--light--hover: $grey-80;
$select--contained--bg--dark: $grey-15; $select--trigger--contained--bg--dark: $grey-15;
$select--contained--bg--dark--hover: $grey-10; $select--trigger--contained--bg--dark--hover: $grey-10;
$select--modal--bg--light: $grey-85; $select--content--contained--bg--light: $grey-100;
$select--modal--bg--light--hover: $grey-80; $select--content--contained--bg--dark: $grey-15;
$select--modal--bg--dark: $grey-40;
$select--modal--bg--dark--hover: $grey-30;
$select--separator--light: $grey-90; $select--separator--light: $grey-90;
$select--separator--dark: $grey-05; $select--separator--dark: $grey-05;
@ -233,9 +232,6 @@ $grid--rep--hover--dark: $grey-10;
$grid--border--color--light: $grey-85; $grid--border--color--light: $grey-85;
$grid--border--color--dark: $grey-40; $grid--border--color--dark: $grey-40;
$select--content--contained--bg--light: $grey-85;
$select--content--contained--bg--dark: $grey-15;
// Color Definitions: Slider // Color Definitions: Slider
$slider--thumb--bg--light: $grey-100; $slider--thumb--bg--light: $grey-100;
$slider--thumb--bg--dark: $grey-100; $slider--thumb--bg--dark: $grey-100;
@ -263,13 +259,17 @@ $extra--purple--bg--light: $purple-90;
$extra--purple--card--bg--light: $purple-80; $extra--purple--card--bg--light: $purple-80;
$extra--purple--primary--light: $purple-30; $extra--purple--primary--light: $purple-30;
$extra--purple--secondary--light: $purple-40; $extra--purple--secondary--light: $purple-40;
$extra--purple--text--light: $purple-10; $extra--purple--light--text--light: $purple-40;
$extra--purple--text--light: $purple-20;
$extra--purple--dark--text--light: $purple-10;
$extra--purple--bg--dark: $purple-20; $extra--purple--bg--dark: $purple-20;
$extra--purple--card--bg--dark: $purple-40; $extra--purple--card--bg--dark: $purple-40;
$extra--purple--primary--dark: $purple-05; $extra--purple--primary--dark: $purple-05;
$extra--purple--secondary--dark: $purple-10; $extra--purple--secondary--dark: $purple-10;
$extra--purple--text--dark: $purple-00; $extra--purple--light--text--dark: $purple-30;
$extra--purple--text--dark: $purple-20;
$extra--purple--dark--text--dark: $purple-00;
// Color Definitions: Subaura // Color Definitions: Subaura
$subaura--orange--bg--light: $orange-90; $subaura--orange--bg--light: $orange-90;
@ -366,6 +366,7 @@ $full-corner: 500px;
$card-corner: $unit * 1.5; $card-corner: $unit * 1.5;
$input-corner: $unit; $input-corner: $unit;
$item-corner: $unit; $item-corner: $unit;
$item-corner-small: $unit-half;
// Shadows // Shadows
$hover-stroke: 1px solid rgba(0, 0, 0, 0.1); $hover-stroke: 1px solid rgba(0, 0, 0, 0.1);