49 lines
2.2 KiB
CSS
49 lines
2.2 KiB
CSS
$ui-primary: hsla(215, 100%, 95%, 1); /* #E5F0FF */
|
|
$ui-secondary: hsla(215, 75%, 95%, 1); /* #E9F1FC */
|
|
$ui-tertiary: hsla(215, 50%, 90%, 1); /* #D9E3F2 */
|
|
|
|
/* tw: update to match updated motion-primary */
|
|
$ui-modal-overlay: hsla(0, 100%, 65%, 0.9); /* 90% transparent version of motion-primary */
|
|
|
|
$ui-white: hsla(0, 100%, 100%, 1); /* #FFFFFF */
|
|
$ui-white-dim: hsla(0, 100%, 100%, 0.75); /* 25% transparent version of ui-white */
|
|
$ui-white-transparent: hsla(0, 100%, 100%, 0.25); /* 25% transparent version of ui-white */
|
|
$ui-transparent: hsla(0, 100%, 100%, 0); /* 25% transparent version of ui-white */
|
|
|
|
$ui-black-transparent: hsla(0, 0%, 0%, 0.15); /* 15% transparent version of black */
|
|
|
|
$text-primary: hsla(225, 15%, 40%, 1); /* #575E75 */
|
|
$text-primary-transparent: hsla(225, 15%, 40%, 0.75);
|
|
|
|
/* tw: we change this to a red, even though motion isn't red. This is intentional. */
|
|
$motion-primary: hsla(0, 100%, 65%, 1);
|
|
$motion-tertiary: hsla(0, 60%, 50%, 1);
|
|
$motion-transparent: hsla(0, 100%, 65%, 0.35); /* 35% transparent version of motion-primary */
|
|
$motion-light-transparent: hsla(0, 100%, 65%, 0.15); /* 15% transparent version of motion-primary */
|
|
|
|
$red-primary: hsla(20, 100%, 55%, 1); /* #FF661A */
|
|
$red-tertiary: hsla(20, 100%, 45%, 1); /* #E64D00 */
|
|
|
|
$sound-primary: hsla(300, 53%, 60%, 1); /* #CF63CF */
|
|
$sound-tertiary: hsla(300, 48%, 50%, 1); /* #BD42BD */
|
|
|
|
$control-primary: hsla(38, 100%, 55%, 1); /* #FFAB19 */
|
|
|
|
$data-primary: hsla(30, 100%, 55%, 1); /* #FF8C1A */
|
|
|
|
$pen-primary: hsla(163, 85%, 40%, 1); /* #0FBD8C */
|
|
$pen-transparent: hsla(163, 85%, 40%, 0.25); /* #0FBD8C */
|
|
|
|
$error-primary: hsla(30, 100%, 55%, 1); /* #FF8C1A */
|
|
$error-light: hsla(30, 100%, 70%, 1); /* #FFB366 */
|
|
$error-transparent: hsla(30, 100%, 55%, 0.25); /* #FF8C1A */
|
|
|
|
/* tw: we change this to an orange, even though extensions aren't orange. This is intentional. */
|
|
$extensions-primary: hsla(10, 85%, 65%, 1);
|
|
$extensions-tertiary: hsla(10, 85%, 40%, 1);
|
|
$extensions-transparent: hsla(10, 85%, 65%, 0.35); /* 35% transparent version of extensions-primary */
|
|
$extensions-light: hsla(10, 57%, 85%, 1); /* opaque version of extensions-transparent, on white bg */
|
|
|
|
/* tw: update to match our changed motion-primary */
|
|
$drop-highlight: hsla(0, 100%, 77%, 1); /* lighter than motion-primary */
|