2018-06-29 08:07:33 +10:00

83 lines
2.1 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;
//Footer Colors
$s-color--footer__link: black;
$s-color--footer__link-hover: white;
/*** 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%);