adjust framework css

This commit is contained in:
2026-01-04 17:56:40 +00:00
parent fa82ec6446
commit e4d698d8c6
3 changed files with 38 additions and 36 deletions

View File

@@ -63,7 +63,7 @@ p,
li, li,
td, td,
label { label {
color: colours.$grey-dark; color: colours.$grey-darker;
font-family: fonts.$font; font-family: fonts.$font;
font-weight: 400; font-weight: 400;
line-height: 1.5em; line-height: 1.5em;

View File

@@ -24,7 +24,7 @@
} }
} }
#{$button}.#{$name}.inverted { #{$button}.#{$name}.outline {
color: $hex; color: $hex;
background: transparent; background: transparent;
border-color: $hex; border-color: $hex;

View File

@@ -13,48 +13,50 @@ $secondary: #5bc0de;
$tertiary: color.invert($primary); $tertiary: color.invert($primary);
$quaternary: color.invert($secondary); $quaternary: color.invert($secondary);
//== Shades
$white: #FFFFFF;
$grey: #808080;
$black: #000000;
//== Primary Tints //== Primary Tints
$primary-darkest: color.adjust($primary, $lightness: -30%); $primary-darkest: color.adjust($primary, $lightness: -45%);
$primary-darker: color.adjust($primary, $lightness: -20%); $primary-darker: color.adjust($primary, $lightness: -30%);
$primary-dark: color.adjust($primary, $lightness: -10%); $primary-dark: color.adjust($primary, $lightness: -15%);
$primary-light: color.adjust($primary, $lightness: 10%); $primary-light: color.adjust($primary, $lightness: 15%);
$primary-lighter: color.adjust($primary, $lightness: 20%); $primary-lighter: color.adjust($primary, $lightness: 30%);
$primary-lightest: color.adjust($primary, $lightness: 30%); $primary-lightest: color.adjust($primary, $lightness: 45%);
//== Secondary Tints //== Secondary Tints
$secondary-darkest: color.adjust($secondary, $lightness: -30%); $secondary-darkest: color.adjust($secondary, $lightness: -45%);
$secondary-darker: color.adjust($secondary, $lightness: -20%); $secondary-darker: color.adjust($secondary, $lightness: -30%);
$secondary-dark: color.adjust($secondary, $lightness: -10%); $secondary-dark: color.adjust($secondary, $lightness: -15%);
$secondary-light: color.adjust($secondary, $lightness: 10%); $secondary-light: color.adjust($secondary, $lightness: 15%);
$secondary-lighter: color.adjust($secondary, $lightness: 20%); $secondary-lighter: color.adjust($secondary, $lightness: 30%);
$secondary-lightest: color.adjust($secondary, $lightness: 30%); $secondary-lightest: color.adjust($secondary, $lightness: 45%);
//== Tertiary Tints //== Tertiary Tints
$tertiary-darkest: color.adjust($tertiary, $lightness: -30%); $tertiary-darkest: color.adjust($tertiary, $lightness: -45%);
$tertiary-darker: color.adjust($tertiary, $lightness: -20%); $tertiary-darker: color.adjust($tertiary, $lightness: -30%);
$tertiary-dark: color.adjust($tertiary, $lightness: -10%); $tertiary-dark: color.adjust($tertiary, $lightness: -15%);
$tertiary-light: color.adjust($tertiary, $lightness: 10%); $tertiary-light: color.adjust($tertiary, $lightness: 15%);
$tertiary-lighter: color.adjust($tertiary, $lightness: 20%); $tertiary-lighter: color.adjust($tertiary, $lightness: 30%);
$tertiary-lightest: color.adjust($tertiary, $lightness: 30%); $tertiary-lightest: color.adjust($tertiary, $lightness: 45%);
//== quaternary Tints //== quaternary Tints
$quaternary-darkest: color.adjust($quaternary, $lightness: -30%); $quaternary-darkest: color.adjust($quaternary, $lightness: -45%);
$quaternary-darker: color.adjust($quaternary, $lightness: -20%); $quaternary-darker: color.adjust($quaternary, $lightness: -30%);
$quaternary-dark: color.adjust($quaternary, $lightness: -10%); $quaternary-dark: color.adjust($quaternary, $lightness: -15%);
$quaternary-light: color.adjust($quaternary, $lightness: 10%); $quaternary-light: color.adjust($quaternary, $lightness: 15%);
$quaternary-lighter: color.adjust($quaternary, $lightness: 20%); $quaternary-lighter: color.adjust($quaternary, $lightness: 30%);
$quaternary-lightest: color.adjust($quaternary, $lightness: 30%); $quaternary-lightest: color.adjust($quaternary, $lightness: 45%);
//== Shades //== six shades of grey
$white: white; $grey-darkest: color.adjust(grey, $lightness: -40%);
$grey-lightest: color.adjust(black, $lightness: 95%); $grey-darker: color.adjust(grey, $lightness: -25%);
$grey-lighter: color.adjust(black, $lightness: 80%); $grey-dark: color.adjust(grey, $lightness: -10%);
$grey-light: color.adjust(black, $lightness: 70%); $grey-light: color.adjust(grey, $lightness: 10%);
$grey: color.adjust(black, $lightness: 50%); $grey-lighter: color.adjust(grey, $lightness: 25%);
$grey-dark: color.adjust(black, $lightness: 40%); $grey-lightest: color.adjust(grey, $lightness: 40%);
$grey-darker: color.adjust(black, $lightness: 20%);
$grey-darkest: color.adjust(black, $lightness: 05%);
$black: black;
//## Colour Array (used in generating colour classes). //## Colour Array (used in generating colour classes).
$colors: ( $colors: (