150 lines
7.4 KiB
CSS
150 lines
7.4 KiB
CSS
/*
|
|
* ╭───────────────────────────────────────────────╮
|
|
* │ GTK Theme Colours │
|
|
* ╰───────────────────────────────────────────────╯
|
|
*/
|
|
|
|
|
|
|
|
/*
|
|
* Replace the colours with variable names
|
|
*/
|
|
|
|
/*
|
|
* ┌ ┐
|
|
* │ Foreground │
|
|
* └ ┘
|
|
*/
|
|
|
|
/*
|
|
* ── Foreground color, main interface text colour ─────────────────────
|
|
*/
|
|
@define-color fg {{ colour-foreground-hex }};
|
|
@define-color fg_rgba_07 {{ colour-foreground-rgba-07 }};
|
|
@define-color fg_rgba_06 {{ colour-foreground-rgba-06 }};
|
|
@define-color fg_rgba_05 {{ colour-foreground-rgba-05 }};
|
|
@define-color fg_rgba_03 {{ colour-foreground-rgba-03 }};
|
|
@define-color fg_rgba_02 {{ colour-foreground-rgba-02 }};
|
|
@define-color fg_rgba_01 {{ colour-foreground-rgba-01 }};
|
|
|
|
/*
|
|
* ── Foreground accent, usually brighter or darker than default ───────
|
|
*/
|
|
@define-color fg_accent {{ colour-foreground-accent-hex }};
|
|
@define-color fg_accent_rgba_07 {{ colour-foreground-accent-rgba-07 }};
|
|
@define-color fg_accent_rgba_06 {{ colour-foreground-accent-rgba-06 }};
|
|
@define-color fg_accent_rgba_05 {{ colour-foreground-accent-rgba-05 }};
|
|
@define-color fg_accent_rgba_03 {{ colour-foreground-accent-rgba-03 }};
|
|
@define-color fg_accent_rgba_02 {{ colour-foreground-accent-rgba-02 }};
|
|
|
|
/*
|
|
* ── Accent colour ────────────────────────────────────────────────────
|
|
*/
|
|
@define-color accent {{ colour-accent-hex }};
|
|
@define-color accent_rgba_05 {{ colour-accent-rgba-05 }};
|
|
@define-color accent_rgba_03 {{ colour-accent-rgba-03 }};
|
|
@define-color accent_rgba_02 {{ colour-accent-rgba-02 }};
|
|
@define-color accent_rgba_015 {{ colour-accent-rgba-015 }};
|
|
@define-color accent_rgba_011 {{ colour-accent-rgba-011 }};
|
|
@define-color accent_rgba_007 {{ colour-accent-rgba-007 }};
|
|
|
|
/*
|
|
* ── Accent Gradient ──────────────────────────────────────────────────
|
|
*/
|
|
@define-color accent_gradient_1 {{ colour-accent-gradient-1-hex }};
|
|
@define-color accent_gradient_2 {{ colour-accent-gradient-2-hex }};
|
|
@define-color accent_gradient_3 {{ colour-accent-gradient-3-hex }};
|
|
@define-color accent_gradient_4 {{ colour-accent-gradient-4-hex }};
|
|
@define-color accent_gradient_5 {{ colour-accent-gradient-5-hex }};
|
|
@define-color accent_gradient_inverse_1 {{ colour-accent-gradient-inverse-1-hex }};
|
|
@define-color accent_gradient_inverse_2 {{ colour-accent-gradient-inverse-2-hex }};
|
|
@define-color accent_gradient_inverse_3 {{ colour-accent-gradient-inverse-3-hex }};
|
|
|
|
/*
|
|
* ── Secondary accent colour ──────────────────────────────────────────
|
|
*/
|
|
@define-color accent2 {{ colour-accent-2-hex }};
|
|
@define-color accent2_rgba_05 {{ colour-accent-2-rgba-05 }};
|
|
@define-color accent2_rgba_03 {{ colour-accent-2-rgba-03 }};
|
|
@define-color accent2_rgba_02 {{ colour-accent-2-rgba-02 }};
|
|
@define-color accent2_rgba_015 {{ colour-accent-2-rgba-015 }};
|
|
@define-color accent2_rgba_01 {{ colour-accent-2-rgba-01 }};
|
|
|
|
/*
|
|
* ── Tertiary accent colour ───────────────────────────────────────────
|
|
*/
|
|
@define-color accent3 {{ colour-accent-3-hex }};
|
|
|
|
/*
|
|
* ── Inactive Colour ──────────────────────────────────────────────────
|
|
*/
|
|
@define-color inactive {{ colour-inactive-hex }};
|
|
@define-color inactive_rgba_07 {{ colour-inactive-rgba-07 }};
|
|
@define-color inactive_rgba_05 {{ colour-inactive-rgba-05 }};
|
|
@define-color inactive_rgba_03 {{ colour-inactive-rgba-03 }};
|
|
@define-color inactive_rgba_02 {{ colour-inactive-rgba-02 }};
|
|
@define-color inactive_rgba_015 {{ colour-inactive-rgba-015 }};
|
|
|
|
|
|
|
|
|
|
/*
|
|
* ┌ ┐
|
|
* │ Background │
|
|
* └ ┘
|
|
*/
|
|
|
|
/*
|
|
* ── Background color, main interface background ──────────────────────
|
|
*/
|
|
@define-color bg {{ colour-background-hex }};
|
|
@define-color bg_rgba_07 {{ colour-background-rgba-07 }};
|
|
@define-color bg_rgba_05 {{ colour-background-rgba-05 }};
|
|
@define-color bg_rgba_03 {{ colour-background-rgba-03 }};
|
|
@define-color bg_rgba_02 {{ colour-background-rgba-02 }};
|
|
@define-color bg_rgba_015 {{ colour-background-rgba-015 }};
|
|
@define-color bg_rgba_011 {{ colour-background-rgba-011 }};
|
|
|
|
/*
|
|
* ── Accent background color ──────────────────────────────────────────
|
|
*/
|
|
@define-color bg_accent {{ colour-background-alternative-hex }};
|
|
@define-color bg_accent_rgba_07 {{ colour-background-alternative-rgba-07 }};
|
|
@define-color bg_accent_rgba_06 {{ colour-background-alternative-rgba-06 }};
|
|
@define-color bg_accent_rgba_05 {{ colour-background-alternative-rgba-05 }};
|
|
@define-color bg_accent_rgba_04 {{ colour-background-alternative-rgba-04 }};
|
|
@define-color bg_accent_rgba_03 {{ colour-background-alternative-rgba-03 }};
|
|
@define-color bg_accent_rgba_02 {{ colour-background-alternative-rgba-02 }};
|
|
@define-color bg_accent_rgba_015 {{ colour-background-alternative-rgba-015 }};
|
|
@define-color bg_accent_rgba_01 {{ colour-background-alternative-rgba-01 }};
|
|
|
|
/*
|
|
* ── Tertiary background colour ───────────────────────────────────────
|
|
*/
|
|
@define-color bg_tertiary {{ colour-background-tertiary-hex }};
|
|
@define-color bg_tertiary_rgba_05 {{ colour-background-tertiary-rgba-05 }};
|
|
@define-color bg_tertiary_rgba_02 {{ colour-background-tertiary-rgba-02 }};
|
|
|
|
/*
|
|
* ── Inactive background colour ───────────────────────────────────────
|
|
*/
|
|
@define-color bg_inactive {{ colour-inactive-background-hex }};
|
|
@define-color bg_inactive_rgba_07 {{ colour-inactive-background-rgba-07 }};
|
|
@define-color bg_inactive_rgba_05 {{ colour-inactive-background-rgba-05 }};
|
|
@define-color bg_inactive_rgba_04 {{ colour-inactive-background-rgba-04 }};
|
|
@define-color bg_inactive_rgba_03 {{ colour-inactive-background-rgba-03 }};
|
|
@define-color bg_inactive_rgba_02 {{ colour-inactive-background-rgba-02 }};
|
|
@define-color bg_inactive_rgba_015 {{ colour-inactive-background-rgba-015 }};
|
|
@define-color bg_inactive_rgba_01 {{ colour-inactive-background-rgba-01 }};
|
|
|
|
/*
|
|
* ── Shadow colours ───────────────────────────────────────────────────
|
|
*/
|
|
@define-color shadow {{ colour-shadow-hex }};
|
|
@define-color shadow_rgba_07 {{ colour-shadow-rgba-07 }};
|
|
@define-color shadow_rgba_05 {{ colour-shadow-rgba-05 }};
|
|
@define-color shadow_rgba_03 {{ colour-shadow-rgba-03 }};
|
|
@define-color shadow_rgba_02 {{ colour-shadow-rgba-02 }};
|
|
@define-color shadow_rgba_015 {{ colour-shadow-rgba-015 }};
|
|
@define-color shadow_rgba_011 {{ colour-shadow-rgba-011 }};
|