nova-ui/assets/styles/_colors.scss
2022-12-04 07:02:30 +01:00

99 lines
2.5 KiB
SCSS

// MAIN COLORS
$color-transparent: transparent;
$color-white: #fafafa;
$color-white-003: hsla(0, 0%, 100%, 0.03);
$color-white-005: hsla(0, 0%, 100%, 0.05);
$color-white-01: hsla(0, 0%, 100%, 0.1);
$color-white-02: hsla(0, 0%, 100%, 0.2);
$color-white-03: hsla(0, 0%, 100%, 0.3);
$color-white-04: hsla(0, 0%, 100%, 0.4);
$color-white-08: hsla(0, 0%, 100%, 0.8);
$color-black: #161616;
$color-black-004: hsla(0, 0%, 0%, 0.04);
$color-black-01: hsla(0, 0%, 0%, 0.1);
$color-black-02: hsla(0, 0%, 0%, 0.2);
$color-black-04: hsla(0, 0%, 0%, 0.4);
$color-black-06: hsla(0, 0%, 0%, 0.6);
$color-black-08: hsla(0, 0%, 0%, 0.8);
$color-grey: #b2b2b2;
$color-grey-medium: #61626d;
$color-grey-bold: #4f5059;
$color-grey-heavy: #3a3a42;
$color-grey-hard: #37383e;
$color-dark: #1d1e23;
$color-dark-light: #3f4047;
$color-dark-heavy: #2a2b31;
$color-dark-hard: #1e1e1e;
$color-default: #69db99;
$color-default-light: #0b152d;
$color-default-dark: #091226;
$color-gradient-green: linear-gradient(268.07deg, #69db99 -0.94%, #51cb84 105.66%);
$color-gradient-green-light: linear-gradient(268.07deg, #90e4b3 -0.94%, #56cc88 105.66%);
$color-gradient-green-disabled: linear-gradient(215.2deg, #3a3a42 -4.49%, #2a2b31 107.38%),
linear-gradient(268.07deg, #69db99 -0.94%, #51cb84 105.66%);
$color-primary: #10b3ff;
$color-primary-light: #1b3156;
$color-bg: #202122;
$color-bg-primary: #46474e;
$color-overlay-modal: hsla(210, 3%, 13%, 0.8);
$color-gradient-black: linear-gradient(
238.73deg,
hsla(228, 6%, 17%, 1),
-1.77%,
hsla(225, 5%, 15%, 1),
100%,
hsla(210, 3%, 13%, 1)
);
$color-gradient-grey: linear-gradient(215.2deg, #3a3a42 -4.49%, #2a2b31 107.38%);
$color-green: $color-default;
$color-red: #e45050;
$color-yellow: #ffc01f;
$color-orange: #ff8a00;
// STATUS
$color-success: $color-default;
$color-danger: $color-red;
$color-warning: $color-yellow;
$color-alert: $color-orange;
// INPUTS
$color-input-bg: $color-bg-primary;
$color-input-bg-light: $color-grey-medium;
$color-input-bg-bold: $color-grey-bold;
$color-input-bg-disabled: $color-grey-hard;
$color-input-placeholder: $color-grey;
$color-input-caret: $color-white;
// CHECKBOX
$color-checkbox-border: $color-grey;
$color-input-bg-light: $color-grey-medium;
$color-input-bg-bold: $color-grey-bold;
$color-input-bg-disabled: $color-grey-hard;
$color-input-placeholder: $color-grey;
$color-input-caret: $color-white;
// LINKS
$color-link-text: $color-grey;
$color-link-hover: $color-default;
//BLOCKS
$color-block-bg: $color-grey-hard;
//MODALS
$color-modal-bg: $color-bg;
//ERRORS
$color-errors-bg: rgba(193, 61, 84, 0.34);