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

Updates themes and variables

Browse source
This commit is contained in:
Justin Edmund 2023-06-05 20:24:35 -07:00
parent d622d79f19
commit 436bec07b5
2 changed files with 34 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
styles/themes.scss
View file

@ -108,6 +108,12 @@
--subaura-orange-secondary: #{$subaura--orange--secondary--light};
--subaura-orange-text: #{$subaura--orange--text--light};
// Light - Pills
--pill-bg: #{$pill--bg--light};
--pill-bg-hover: #{$pill--bg--light--hover};
--pill-text: #{$pill--text--light};
--pill-text-hover: #{$pill--text--light--hover};
// Light - Element Toggle
--toggle-bg: #{$toggle--bg--light};
--toggle-stroke: #{$toggle--stroke--light};
@ -259,6 +265,12 @@
--subaura-orange-secondary: #{$subaura--orange--secondary--dark};
--subaura-orange-text: #{$subaura--orange--text--dark};
// Dark - Pills
--pill-bg: #{$pill--bg--dark};
--pill-bg-hover: #{$pill--bg--dark--hover};
--pill-text: #{$pill--text--dark};
--pill-text-hover: #{$pill--text--dark--hover};
// Dark - Element Toggle
--toggle-bg: #{$toggle--bg--dark};
--toggle-stroke: #{$toggle--stroke--dark};
@ -268,32 +280,32 @@
// Element theming
--wind-bg: #{$wind-bg-10};
--wind-hover-bg: #{$wind-bg-00};
--wind-text: #{$wind-text-10};
--wind-text: #{$wind-text-20};
--wind-hover-text: #{$wind-text-00};
--fire-bg: #{$fire-bg-10};
--fire-hover-bg: #{$fire-bg-00};
--fire-text: #{$fire-text-10};
--fire-text: #{$fire-text-20};
--fire-hover-text: #{$fire-text-00};
--water-bg: #{$water-bg-10};
--water-hover-bg: #{$water-bg-00};
--water-text: #{$water-text-10};
--water-text: #{$water-text-20};
--water-hover-text: #{$water-text-00};
--earth-bg: #{$earth-bg-10};
--earth-hover-bg: #{$earth-bg-00};
--earth-text: #{$earth-text-10};
--earth-text: #{$earth-text-20};
--earth-hover-text: #{$earth-text-00};
--dark-bg: #{$dark-bg-10};
--dark-hover-bg: #{$dark-bg-00};
--dark-text: #{$dark-text-10};
--dark-text: #{$dark-text-20};
--dark-hover-text: #{$dark-text-00};
--light-bg: #{$light-bg-10};
--light-hover-bg: #{$light-bg-00};
--light-text: #{$light-text-10};
--light-text: #{$light-text-20};
--light-hover-text: #{$light-text-00};
// Gradients

18
styles/variables.scss
View file

@ -56,6 +56,7 @@ $grey-100: white;
// Purple -- Additional Weapons
$purple-00: #25224e;
$purple-05: #373278;
$purple-10: #4f3c79;
$purple-20: #635fb7;
$purple-30: #8c86ff;
@ -256,9 +257,10 @@ $extra--purple--card--bg--light: $purple-80;
$extra--purple--primary--light: $purple-30;
$extra--purple--secondary--light: $purple-40;
$extra--purple--text--light: $purple-10;
$extra--purple--bg--dark: $purple-20;
$extra--purple--card--bg--dark: $purple-40;
$extra--purple--primary--dark: $purple-00;
$extra--purple--primary--dark: $purple-05;
$extra--purple--secondary--dark: $purple-10;
$extra--purple--text--dark: $purple-00;
@ -283,6 +285,17 @@ $full--auto--bg: $yellow-text-20;
$auto--guard--bg: $purple-30;
$auto--guard--text: $purple-10;
// Color Definitions: Pills
$pill--bg--light: $grey-90;
$pill--bg--light--hover: $grey-50;
$pill--text--light: $grey-30;
$pill--text--light--hover: $grey-100;
$pill--bg--dark: $grey-00;
$pill--bg--dark--hover: $grey-50;
$pill--text--dark: $grey-100;
$pill--text--dark--hover: $grey-00;
// Color Definitions: Element Toggle
$toggle--bg--light: $grey-90;
$toggle--bg--dark: $grey-15;
@ -342,9 +355,10 @@ $scale-wide: scale(1.05, 1.05);
$scale-tall: scale(1.012, 1.012);
// Border radius
$full-corner: 500px;
$card-corner: $unit * 1.5;
$input-corner: $unit;
$item-corner: $unit-half;
$item-corner: $unit;
// Shadows
$hover-stroke: 1px solid rgba(0, 0, 0, 0.1);