colors-dark.vars.scss

@charset 'utf-8';

// Theme Colors

$scheme-main: $black;
$scheme-main-bis: $black-bis;
$scheme-main-ter: $black-ter;
$scheme-main-grey: $grey-darker;
$scheme-main-grey-bis: $grey-dark;
$scheme-main-grey-ter: $grey;
$scheme-invert-grey-ter: $grey-light;
$scheme-invert-grey-bis: $grey-lighter;
$scheme-invert-grey: $grey-lightest;
$scheme-invert-ter: $white-ter;
$scheme-invert-bis: $white-bis;
$scheme-invert: $white;

$green: hsl(153, 53%, 30%);
$turquoise: hsl(175, 100%, 30%);
$red: hsl(348, 86%, 50%);
$red-light: change-color($red, $lightness: 90%);
$blue: hsl(217, 71%, 65%);

$danger-light: $red-light;

// Element Colors

$body-background-color: $scheme-main-ter;
$background: $scheme-main-ter;
$focus-color: change-color($cyan, $lightness: 40%);
$scrollbar-color: $scheme-main-grey-bis;
$scrollbar-hover-color: $scheme-main-grey-ter;
$link: $blue;

// Component Colors

$toolbar-background-color: $scheme-main-bis;

$navbar-item-color: $scheme-invert-ter;
$navbar-background-color: $scheme-main;
$navbar-button-active-color: $scheme-invert;
$navbar-button-active-background: $scheme-main-grey;

$card-background-color: $scheme-main;
$card-header-background-color: $scheme-main-grey;
$card-item-border-color: $card-header-background-color;

$modal-dialog-background: $scheme-main-grey;

$zerotier-address-tag-color: change-color($cyan, $lightness: 85%);
$zerotier-address-tag-background-color: change-color($cyan, $lightness: 30%);
$zerotier-network-number-tag-color: change-color($green, $lightness: 85%);
$zerotier-network-number-tag-background-color: change-color($green, $lightness: 30%);
$zerotier-unknown-network-tag-color: $background;
$socket-tag-color: change-color($purple, $lightness: 90%);
$socket-tag-background-color: change-color($purple, $lightness: 20%);
$domain-name-tag-color: $white;
$domain-name-tag-background-color: $grey-dark;