79 lines
2.0 KiB
SCSS
79 lines
2.0 KiB
SCSS
/*
|
|
* Color Settings
|
|
* Provides common color settings for use throughout the styles.
|
|
*
|
|
* Version:
|
|
* 1.0.0 - 2018/05/03
|
|
*/
|
|
|
|
/*
|
|
== Color Sets ==
|
|
*/
|
|
//Pastel Colors
|
|
$s-color--pastel-pink: #FCE9F1;
|
|
$s-color--pastel-green: #E9FCF4;
|
|
$s-color--pastel-orange: #FEECE8;
|
|
$s-color--pastel-blue: #E8FAFE;
|
|
$s-color--pastel-purple: #ECE8FE;
|
|
|
|
//Swatch Colors
|
|
$s-color--swatch-red: #FFB3BA;
|
|
$s-color--swatch-orange: #FFDFBA;
|
|
$s-color--swatch-yellow: #FFFFBA;
|
|
$s-color--swatch-green: #BAFFC9;
|
|
$s-color--swatch-blue: #BAE1FF;
|
|
|
|
/*
|
|
== Color Definitions ==
|
|
*/
|
|
|
|
$s-color--background: white;
|
|
$s-color--shadow: rgba(0, 0, 0, 0.5);
|
|
|
|
//Hyperlink Colors
|
|
$s-color--link: #FC78DE;
|
|
$s-color--link-hover: lighten($s-color--link, 10%);
|
|
|
|
//Navbar Colors
|
|
$s-color--navbar: rgba(0, 0, 0, 0.75);
|
|
$s-color--navbar__text: white;
|
|
$s-color--navbar__text-hover: #CCC;
|
|
$s-color--navbar__bar-hover: $s-color--pastel-blue;
|
|
$s-color--navbar__bar-active: $s-color--pastel-green;
|
|
|
|
//Menu Colors
|
|
$s-color--menu__background: rgba(0, 0, 0, 0.8);
|
|
|
|
//loader
|
|
$s-color--loader: $s-color--swatch-blue;
|
|
|
|
/*** Buttons and Inputs ***/
|
|
|
|
//Defaults
|
|
$s-color--input-default__border: 1px solid #AAA;
|
|
$s-color--input-default__top: #F7F7F7;
|
|
$s-color--input-default__bottom: #DADADA;
|
|
$s-color--input-default-hover__top: $s-color--input-default__bottom;
|
|
$s-color--input-default__text: black;
|
|
$s-color--input-default-hover__text: black;
|
|
|
|
//Input Styles
|
|
$s-color--input-focus__outline: darken($s-color--swatch-blue, 20%);
|
|
|
|
//Button Primary
|
|
$s-color--input-primary__text: black;
|
|
$s-color--input-primary__top: $s-color--swatch-blue;
|
|
$s-color--input-primary__bottom: darken($s-color--input-primary__top, 8%);
|
|
|
|
//Btn Secondary
|
|
$s-color--input-secondary__top: $s-color--pastel-blue;
|
|
$s-color--input-secondary__bottom: darken($s-color--input-secondary__top, 8%);
|
|
|
|
//Btn Danger
|
|
$s-color--input-danger__top: $s-color--swatch-red;
|
|
$s-color--input-danger__bottom: darken($s-color--input-danger__top, 8%);
|
|
|
|
//Btn Warning
|
|
$s-color--input-warning__top: $s-color--swatch-orange;
|
|
$s-color--input-warning__bottom: darken($s-color--input-warning__top, 8%);
|