2015-09-29 11:22:48 -04:00
|
|
|
/* UI Primary Colors */
|
2022-02-09 12:48:13 -05:00
|
|
|
$ui-blue: hsla(215, 100%, 65%, 1); // #4C97FF Motion Primary
|
|
|
|
$ui-blue-dark: hsla(215, 65%, 55%, 1); // #3373CC Motion Secondary
|
|
|
|
$ui-blue-10percent: hsla(215, 100%, 65%, .1);
|
|
|
|
$ui-blue-25percent: hsla(215, 100%, 65%, .25);
|
2018-07-16 18:02:12 -04:00
|
|
|
|
2022-02-09 12:48:13 -05:00
|
|
|
$ui-orange: hsla(38, 100%, 55%, 1); // #FFAB19 Control Primary
|
|
|
|
$ui-orange-high-contrast: hsla(30, 100%, 55%, 1); // #FFAB19 Control Primary
|
|
|
|
$ui-orange-10percent: hsla(35, 90%, 55%, .1);
|
|
|
|
$ui-orange-25percent: hsla(35, 90%, 55%, .25);
|
|
|
|
$ui-orange-90percent: hsla(38, 100%, 55%, .9);
|
2018-07-16 18:02:12 -04:00
|
|
|
|
2022-02-09 12:48:13 -05:00
|
|
|
$ui-dark-orange: hsla(30, 100%, 55%, 1); // ##FF8C1A Variables Primary
|
2018-12-12 11:35:41 -05:00
|
|
|
|
2018-11-20 11:59:50 -05:00
|
|
|
$ui-red: hsla(20, 100%, 55%, 1); /* #FF661A */
|
|
|
|
$ui-red-25percent: hsla(20, 100%, 55%, .25);
|
2018-11-23 01:17:46 -05:00
|
|
|
$ui-green-35percent: rgba(126, 225, 195, .35);
|
2018-11-20 11:59:50 -05:00
|
|
|
|
2022-02-09 12:48:13 -05:00
|
|
|
$ui-light-gray: hsla(0, 0%, 98%, 1); //#FAFAFA
|
|
|
|
$ui-gray: hsla(0, 0%, 95%, 1); //#F2F2F2
|
|
|
|
$ui-dark-gray: hsla(0, 0%, 70%, 1); //#B3B3B3
|
2015-09-29 11:22:48 -04:00
|
|
|
|
2022-02-09 12:48:13 -05:00
|
|
|
$background-color: hsla(0, 0%, 99%, 1); //#FDFDFD
|
2015-09-29 11:22:48 -04:00
|
|
|
|
2022-02-09 12:48:13 -05:00
|
|
|
$motion-blue-3: hsla(215, 60%, 50%, 1);//#3373CC
|
2021-10-19 18:58:14 -04:00
|
|
|
|
2015-09-29 11:22:48 -04:00
|
|
|
/* UI Secondary Colors */
|
2018-03-08 15:57:19 -05:00
|
|
|
/* 3.0 colors */
|
|
|
|
/* Using www naming convention for now, should be consistent with gui */
|
2022-12-16 14:26:15 -05:00
|
|
|
$ui-aqua: #338554;
|
|
|
|
$ui-aqua-dark: darken($ui-aqua, 10%);
|
2022-02-09 12:48:13 -05:00
|
|
|
$ui-purple: hsla(260, 100%, 70%, 1); // #9966FF Looks Primary
|
|
|
|
$ui-purple-dark: hsla(260, 60%, 60%, 1); // #774DCB Looks Secondary
|
2019-10-03 19:23:35 -04:00
|
|
|
$ui-magenta: hsla(300, 53%, 60%, 1); /* #CF63CF Sounds Primary */
|
2018-07-16 18:02:12 -04:00
|
|
|
|
2022-02-09 12:48:13 -05:00
|
|
|
$ui-yellow: hsla(45, 100%, 50%, 1); // #FFBF00 Events Primary
|
|
|
|
$ui-coral: hsla(350, 100%, 70%, 1); // #FF6680 More Blocks Primary
|
|
|
|
$ui-coral-dark: hsla(350, 100%, 60%, 1); // #FF3355 More Blocks tertiary
|
2018-07-16 18:02:12 -04:00
|
|
|
|
|
|
|
$ui-white: hsla(0, 100%, 100%, 1); //#FFF
|
|
|
|
$ui-white-15percent: hsla(0, 100%, 100%, .15); //#FFF
|
2022-02-09 12:48:13 -05:00
|
|
|
$ui-light-primary: hsl(215, 100%, 95%);
|
|
|
|
$ui-light-primary-transparent: hsla(215, 100%, 95%, 0);
|
2018-07-16 18:02:12 -04:00
|
|
|
|
2022-02-09 12:48:13 -05:00
|
|
|
$ui-border: hsla(0, 0%, 85%, 1); //#D9D9D9
|
2015-09-29 11:22:48 -04:00
|
|
|
|
2018-08-01 11:01:37 -04:00
|
|
|
/* modals */
|
2022-02-09 12:48:13 -05:00
|
|
|
$ui-mint-green: hsl(163, 69%, 44%);
|
|
|
|
$ui-light-mint: hsl(163, 53%, 67%);
|
2018-08-01 11:01:37 -04:00
|
|
|
|
2015-09-29 11:22:48 -04:00
|
|
|
/* Overlay UI Gray Colors */
|
2022-02-09 12:48:13 -05:00
|
|
|
$active-gray: hsla(0, 0%, 0%, .1);
|
|
|
|
$active-dark-gray: hsla(0, 0%, 0%, .2);
|
|
|
|
$box-shadow-gray: hsla(0, 0%, 0%, .25);
|
|
|
|
$box-shadow-light-gray: hsla(0, 0%, 0%, .15);
|
|
|
|
$overlay-gray: hsla(0, 0%, 0%, .75);
|
2018-07-31 15:00:56 -04:00
|
|
|
$transparent-light-blue: rgba(229, 240, 254, 0);
|
2015-09-29 11:22:48 -04:00
|
|
|
|
|
|
|
/* Typography Colors */
|
2022-02-09 12:48:13 -05:00
|
|
|
$header-gray: hsla(225, 15%, 40%, 1); //#575E75
|
|
|
|
$type-gray: hsla(225, 15%, 40%, 1); //#575E75
|
2022-12-16 14:26:15 -05:00
|
|
|
$type-dark-gray: #3B3B3B;
|
2022-02-09 12:48:13 -05:00
|
|
|
$type-gray-75percent: hsla(225, 15%, 40%, .75);
|
|
|
|
$type-gray-60percent: hsla(225, 15%, 40%, .6);
|
|
|
|
$type-white: hsla(0, 100%, 100%, 1); //#FFF
|
2015-09-29 11:22:48 -04:00
|
|
|
|
|
|
|
$link-blue: $ui-blue;
|
2015-10-22 12:21:47 -04:00
|
|
|
|
2017-07-19 11:48:29 -04:00
|
|
|
/* Down Deep */
|
2022-02-09 12:48:13 -05:00
|
|
|
$dd-darkblue: hsla(195, 72.4%, 17.1%, 1);
|
|
|
|
$dd-medium-blue: hsla(195, 72.4%, 42%, .65);
|