You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
118 lines
2.2 KiB
118 lines
2.2 KiB
$white: #fff;
|
|
$black: #000;
|
|
$gray: #959595;
|
|
$invisibleGray: #555;
|
|
|
|
$main: #ebb864;
|
|
$secondary: #1d1d1d;
|
|
$grey: #f2f2f2;
|
|
$traditionalgrey: #ccc;
|
|
$lightgrey: #f7f7f7;
|
|
$darkgrey: #ebebeb;
|
|
$darkestgrey: #999;
|
|
$bluegrey: #2a2d38;
|
|
$spacegrey: #222e2b;
|
|
$spaceblue: #252832;
|
|
$darkspaceblue: #1c1e26;
|
|
$spaceborder: #404040;
|
|
|
|
$gold: #dea326;
|
|
$green: #0bb634;
|
|
$terminalgreen: #0f0;
|
|
$red: #ff556a;
|
|
$blue: #007bb6;
|
|
$orange: #ff8a65;
|
|
$yellow: #fff680;
|
|
$curve: cubic-bezier(0.65, 0, 0.45, 1);
|
|
|
|
:root {
|
|
--white: #fff;
|
|
--black: #000;
|
|
--gray: #959595;
|
|
--invisibleGray: #555;
|
|
--lightningOrange: #fd9800;
|
|
--superGreen: #39e673;
|
|
--superRed: #e63939;
|
|
--darkestBackground: #242633;
|
|
--lightBackground: #313340;
|
|
--lightestBackground: #373947;
|
|
--primaryText: #fff;
|
|
--gradient: linear-gradient(270deg, #868b9f 0%, #333c5e 100%);
|
|
}
|
|
|
|
.light {
|
|
--white: #fff;
|
|
--black: #000;
|
|
--gray: #959595;
|
|
--invisibleGray: #555;
|
|
--lightningOrange: #fd9800;
|
|
--superGreen: #39e673;
|
|
--superRed: #e63939;
|
|
--darkestBackground: #fff;
|
|
--lightBackground: #ebebeb;
|
|
--lightestBackground: #f3f3f3;
|
|
--primaryText: #000;
|
|
--gradient: linear-gradient(270deg, #fd9800 0%, #ffbd59 100%);
|
|
}
|
|
|
|
$z-layers: (
|
|
// Layer 1
|
|
"form": (
|
|
"container": 10,
|
|
"pay": 10,
|
|
"request": 10
|
|
),
|
|
"contact-form": (
|
|
"modal": 10,
|
|
),
|
|
"connect-form": (
|
|
"modal": 10,
|
|
),
|
|
"settings-form": (
|
|
"modal": 10
|
|
),
|
|
"network-filters": (
|
|
"open": 10,
|
|
),
|
|
// Layer 2
|
|
"loading-bolt": (
|
|
"container": 20,
|
|
),
|
|
// Layer 3
|
|
"global-error": (
|
|
"container": 30,
|
|
),
|
|
// Layer 4
|
|
"tooltip": (
|
|
"after": 40,
|
|
"before": 40
|
|
)
|
|
);
|
|
|
|
// Functions for pulling z-index values from $z-layers map
|
|
@function z($layer...) {
|
|
@if not map-has-nested-keys($z-layers, $layer) {
|
|
@warn "No layer found for `#{$layer}` in $z-layers map. Property omitted.";
|
|
}
|
|
|
|
@return map-deep-get($z-layers, $layer);
|
|
}
|
|
|
|
@function map-has-nested-keys($map, $keys) {
|
|
@each $key in $keys {
|
|
@if not map-has-key($map, $key) {
|
|
@return false;
|
|
}
|
|
$map: map-get($map, $key);
|
|
}
|
|
|
|
@return true;
|
|
}
|
|
|
|
@function map-deep-get($map, $keys) {
|
|
@each $key in $keys {
|
|
$map: map-get($map, $key);
|
|
}
|
|
|
|
@return $map;
|
|
}
|
|
|