112 lines
No EOL
2.7 KiB
SCSS
112 lines
No EOL
2.7 KiB
SCSS
$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;
|
|
$error-color: $nord12;
|
|
$warning-color: $nord13;
|
|
$success-color: $nord14;
|
|
$primary-color-hl: darken($primary-color, $hoverAmount);
|
|
$danger-color-hl: darken($danger-color, $hoverAmount);
|
|
$error-color-hl: darken($error-color, $hoverAmount);
|
|
$warning-color-hl: darken($warning-color, $hoverAmount);
|
|
$success-color-hl: darken($success-color, $hoverAmount);
|
|
|
|
$button-font-color: #2C364A;
|
|
$button-alternate-color: #01103C;
|
|
|
|
$pagination-border-color: $nord3;
|
|
$pagination-hover-color: rgb(115, 151, 186);
|
|
|
|
$close-background: rgba(10,10,10,.6);
|
|
$close-background-dark: rgba(240,240,240,.6);
|
|
|
|
:root {
|
|
--default-color: #{$white};
|
|
--bg-color: #{darken($white, 5%)};
|
|
--bg-alternate-color: #{darken($white, 8%)};
|
|
--font-color: #{$nord3};
|
|
--hover-font-color: #{lighten($nord3, 16%)};
|
|
--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};
|
|
|
|
--button-link-text-color: #2C364A;
|
|
|
|
--close-background: #{$close-background};
|
|
|
|
--loader-img: url('/img/loading-light.gif');
|
|
|
|
--nord0: #{$nord0};
|
|
--nord1: #{$nord1};
|
|
--nord2: #{$nord2};
|
|
--nord3: #{$nord3};
|
|
--nord4: #{$nord4};
|
|
--nord5: #{$nord5};
|
|
--nord6: #{$nord6};
|
|
--nord7: #{$nord7};
|
|
--nord8: #{$nord8};
|
|
--nord9: #{$nord9};
|
|
--nord10: #{$nord10};
|
|
--nord11: #{$nord11};
|
|
--nord12: #{$nord12};
|
|
--nord13: #{$nord13};
|
|
--nord14: #{$nord14};
|
|
--nord15: #{$nord15};
|
|
}
|
|
|
|
[data-theme="dark"] {
|
|
--default-color: #{$nord3};
|
|
--bg-color: #{lighten($nord0, 2%)};
|
|
--bg-alternate-color: #{lighten($nord3, 8%)};
|
|
--font-color: #{$nord6};
|
|
--hover-font-color: #{darken($nord6, 16%)};
|
|
--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};
|
|
|
|
--button-link-text-color: #{$white};
|
|
|
|
--close-background: #{$nord3};
|
|
|
|
--loader-img: url('/img/loading-dark.gif');
|
|
} |