Tweaked CSS variables
Added some new variables for elevation, rounder corners, and tweaked some other things
This commit is contained in:
parent
be09e67d42
commit
7fb9ef2d9a
3 changed files with 20 additions and 9 deletions
|
|
@ -202,10 +202,10 @@ $notice--button--text--light--hover: $accent--yellow--00;
|
|||
$notice--button--text--dark--hover: $accent--yellow--100;
|
||||
|
||||
// Color Definitions: Button
|
||||
$button--bg--light: $grey-80;
|
||||
$button--bg--light--hover: $grey-100;
|
||||
$button--bg--light--disabled: $grey-80;
|
||||
$button--contained--bg--light: $grey-85;
|
||||
$button--bg--light: $grey-85;
|
||||
$button--bg--light--hover: $grey-80;
|
||||
$button--bg--light--disabled: $grey-70;
|
||||
$button--contained--bg--light: $grey-90;
|
||||
$button--contained--bg--light--hover: $grey-80;
|
||||
|
||||
$button--bg--dark: $grey-00;
|
||||
|
|
@ -214,9 +214,9 @@ $button--bg--dark--disabled: $grey-30;
|
|||
$button--contained--bg--dark: $grey-15;
|
||||
$button--contained--bg--dark--hover: $grey-05;
|
||||
|
||||
$button--text--light: $grey-55;
|
||||
$button--text--light--hover: $grey-40;
|
||||
$button--text--light--disabled: $grey-70;
|
||||
$button--text--light: $grey-40;
|
||||
$button--text--light--hover: $grey-30;
|
||||
$button--text--light--disabled: $grey-50;
|
||||
$button--text--dark: $grey-70;
|
||||
$button--text--dark--hover: $grey-100;
|
||||
$button--text--dark--disabled: $grey-50;
|
||||
|
|
@ -227,8 +227,8 @@ $input--bg--light--hover: $grey-95;
|
|||
$input--bg--dark: $grey-40;
|
||||
$input--bg--dark--hover: $grey-30;
|
||||
|
||||
$input--bound--bg--light: $grey-85;
|
||||
$input--bound--bg--light--hover: $grey-80;
|
||||
$input--bound--bg--light: $grey-90;
|
||||
$input--bound--bg--light--hover: $grey-85;
|
||||
$input--bound--bg--dark: $grey-15;
|
||||
$input--bound--bg--dark--hover: $grey-10;
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,15 @@
|
|||
@use 'sass:list';
|
||||
|
||||
// Borders
|
||||
$page-border: 0.5px solid rgba(0, 0, 0, 0.18);
|
||||
$dialog-border: 0.5px solid rgba(0, 0, 0, 0.18);
|
||||
$card-border: 0.5px solid rgba(0, 0, 0, 0.18);
|
||||
|
||||
// Elevation
|
||||
$page-elevation: 0 0 4px rgba(0, 0, 0, 0.06);
|
||||
$dialog-elevation: 0 1px 8px rgba(0, 0, 0, 0.16);
|
||||
$card-elevation: 0 1px 3px rgba(0, 0, 0, 0.1);
|
||||
|
||||
// Shadows
|
||||
$hover-stroke: 1px solid rgba(0, 0, 0, 0.1);
|
||||
$hover-shadow: rgba(0, 0, 0, 0.08) 0px 0px 14px;
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@ $scale-tall: scale(1.012, 1.012);
|
|||
|
||||
// Border radius
|
||||
$full-corner: 500px;
|
||||
$page-corner: spacing.$unit-2x;
|
||||
$card-corner: spacing.$unit * 1.5;
|
||||
$input-corner: spacing.$unit;
|
||||
$item-corner: spacing.$unit;
|
||||
|
|
|
|||
Loading…
Reference in a new issue