MusicTopus/sass/colors.scss

74 lines
1.7 KiB
SCSS
Raw Normal View History

$hoverAmount: 10%;
$white: #ffffff;
$darken-white: #F8F9FB;
/* Couleurs du thème Nord (https://www.nordtheme.com/) */
$nord0: #2e3440;
$nord1: #3b4252;
$nord2: #434c5e;
$nord3: #4C566A;
$nord4: #d8dee9;
$nord5: #e5e9f0;
$nord6: #eceff4;
$nord7: #8fbcbb;
$nord8: #88c0d0;
$nord9: #81a1c1;
$nord10: #5e81ac;
$nord11: #d08770;
$nord12: #bf616a;
$nord13: #ebcb8b;
$nord14: #a3be8c;
$nord15: #b48ead;
$primary-color: $nord8;
$danger-color: $nord11;
$warning-color: $nord13;
$success-color: $nord14;
$primary-color-hl: darken($primary-color, $hoverAmount);
$danger-color-hl: darken($danger-color, $hoverAmount);
$warning-color-hl: darken($warning-color, $hoverAmount);
$success-color-hl: darken($success-color, $hoverAmount);
$button-font-color: $nord1;
$button-alternate-color: #01103C;
$pagination-border-color: $nord3;
$pagination-hover-color: rgb(115, 151, 186);
:root {
--default-color: #{$white};
--bg-color: #{darken($white, 5%)};
--font-color: #{$nord3};
--footer-color: #{$darken-white};
--link-color: #{$nord1};
--input-font-color: #{$nord3};
--input-color: #{$white};
--input-active-color: #{$nord5};
--navbar-color: #{darken($white, 5%)};
--box-bg-color: #F8F9FB;
--box-shadow-color: #{rgba($nord4, 0.35)};
--border-color: #{$nord4};
}
[data-theme="dark"] {
--default-color: #{$nord3};
--bg-color: #{lighten($nord0, 2%)};
--font-color: #{$nord6};
--footer-color: #{$nord1};
--link-color: #{$nord4};
--input-font-color: #{$nord6};
--input-color: #{$nord0};
--input-active-color: #{$nord3};
--navbar-color: #{$nord0};
--box-bg-color: #{$nord1};
--box-shadow-color: #{rgba($nord4, 0.2)};
--border-color: #{$nord1};
}