170 lines
4.4 KiB
SCSS
170 lines
4.4 KiB
SCSS
// Grays
|
|
$black: #000000;
|
|
$gray-darkest: #1c1c1c;
|
|
$gray-darker: #2c2c2c;
|
|
$gray-dark: #333333;
|
|
$gray: #666666;
|
|
$gray-light: #d6d6d6;
|
|
$gray-lighter: #ededed;
|
|
$white: #ffffff;
|
|
|
|
// Colors
|
|
$variant-colors: (
|
|
primary: #e5287a,
|
|
secondary: $gray-light,
|
|
success: #4ba74b,
|
|
warning: #fdbc41,
|
|
danger: #ef5652,
|
|
info: #0097c4,
|
|
);
|
|
$variant-text-colors: (
|
|
primary: $black,
|
|
secondary: $black,
|
|
success: $black,
|
|
warning: $black,
|
|
danger: $black,
|
|
info: $black,
|
|
);
|
|
|
|
$variant-color-primary: map-get($variant-colors, primary);
|
|
$variant-color-secondary: map-get($variant-colors, secondary);
|
|
$variant-color-success: map-get($variant-colors, success);
|
|
$variant-color-warning: map-get($variant-colors, warning);
|
|
$variant-color-danger: map-get($variant-colors, danger);
|
|
$variant-color-info: map-get($variant-colors, info);
|
|
|
|
// Page
|
|
$page-breakpoints: (
|
|
// first value is <=, second <
|
|
smallest: (0px, 375px),
|
|
smaller: (375px, 576px),
|
|
small: (576px, 768px),
|
|
medium: (768px, 992px),
|
|
large: (992px, 1200px),
|
|
larger: (1200px, 1400px),
|
|
largest: (1400px, null),
|
|
);
|
|
$page-container-widths: (
|
|
smallest: 100%,
|
|
smaller: 100%,
|
|
small: 100%,
|
|
medium: 768px,
|
|
large: 992px,
|
|
larger: 992px,
|
|
largest: 992px,
|
|
);
|
|
$page-font-size: 0.9em;
|
|
$page-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
$page-background-color: $gray-darkest;
|
|
$page-text-color: $gray-lighter;
|
|
$page-padding-top: 0.5em;
|
|
$page-padding-bottom: 4.5em;
|
|
$page-paddings-horizontal: (
|
|
smallest: 0.75em,
|
|
smaller: 0.75em,
|
|
small: 1em,
|
|
medium: 1.25em,
|
|
large: 1.25em,
|
|
larger: 1.25em,
|
|
largest: 1.25em,
|
|
);
|
|
|
|
// Typography
|
|
$h2-font-size: 2.5em;
|
|
$h2-margin: 0.5em 0;
|
|
|
|
// Links
|
|
$link-color: $variant-color-warning;
|
|
$link-hover-color: $variant-color-warning;
|
|
|
|
// Form
|
|
$label-font-weight: 600;
|
|
$fieldset-margin: 0;
|
|
$fieldset-padding: 0.5em 0.75em;
|
|
$fieldset-border: 0.1em solid $gray;
|
|
$fieldset-border-radius: 0.5em;
|
|
$fieldset-background-color: $gray-darker;
|
|
|
|
// Inputs
|
|
$input-padding: 0.25em 0.5em;
|
|
$input-background-color: $gray-lighter;
|
|
$input-text-color: $gray-darkest;
|
|
$input-placeholder-color: $gray-darkest;
|
|
$input-placeholder-opacity: 0.8;
|
|
$input-border-radius: 0.5em;
|
|
$input-outline: 0.1em solid $variant-color-info;
|
|
$input-outline-offset: 0.125em;
|
|
|
|
$button-margin: 0.3em;
|
|
$button-padding: 0.25em 0.5em;
|
|
$button-border-radius: $input-border-radius;
|
|
$button-border-width: 0.15em;
|
|
$button-border-style: solid;
|
|
$button-outline-width: 0.15em;
|
|
$button-sizes: (
|
|
small: 0.8em,
|
|
medium: 1em,
|
|
large: 1.15em,
|
|
);
|
|
|
|
// Error cards
|
|
$error-card-margin: 1em 0;
|
|
$error-card-padding: 0.5em;
|
|
$error-card-border: 0.1em solid $variant-color-danger;
|
|
$error-card-border-radius: 0.5em;
|
|
$error-card-font-weight: 600;
|
|
$error-card-background-color: lighten($variant-color-danger, 10%);
|
|
$error-card-color: $page-background-color;
|
|
|
|
// Node preview
|
|
$node-preview-card-padding: 0.75em 1em;
|
|
$node-preview-card-border: 0.2em solid $gray;
|
|
$node-preview-card-border-radius: 1em;
|
|
$node-preview-card-headline-font-size: 1.5em;
|
|
$node-preview-card-headline-margin: 0 0 0.5em;
|
|
$node-preview-card-field-margin: 0.25em 0;
|
|
$node-preview-card-field-code-font-size: 1.25em;
|
|
|
|
// Deleted node summary
|
|
$node-deleted-summary-padding: $node-preview-card-padding;
|
|
$node-deleted-summary-border: $node-preview-card-border;
|
|
$node-deleted-summary-border-radius: $node-preview-card-border-radius;
|
|
$node-deleted-summary-font-size: 1.25em;
|
|
|
|
// Navigation
|
|
$nav-bar-background-color: $gray-dark;
|
|
$nav-link-color: $page-text-color;
|
|
$nav-link-spacing: 1.5em;
|
|
|
|
$nav-header-padding: 0.75em;
|
|
$nav-header-logo-size: 2em;
|
|
$nav-header-logo-margin: 0 0.5em 0 0;
|
|
|
|
$nav-footer-padding: 0.75em;
|
|
|
|
// Home
|
|
$home-actions-margin-top: 2.5em;
|
|
|
|
// Statistics
|
|
$statistics-card-widths: (
|
|
smallest: 100%,
|
|
smaller: 80%,
|
|
small: 50%,
|
|
medium: 50%,
|
|
large: 33.3333%,
|
|
larger: 33.3333%,
|
|
largest: 33.3333%,
|
|
);
|
|
$statistics-card-height: 4.5em;
|
|
$statistics-card-margin: 0.5em;
|
|
$statistics-card-padding: 0.3em 0.5em;
|
|
$statistics-card-border-radius: 0.5em;
|
|
$statistics-card-icon-size: 4em;
|
|
$statistics-card-icon-gap: 0.15em;
|
|
$statistics-card-value-font-size: 2.5em;
|
|
|
|
// Nodes filter panel
|
|
$nodes-filter-panel-pill-variant: success;
|
|
$nodes-filter-panel-pill-text-color: map-get($variant-text-colors, $nodes-filter-panel-pill-variant);
|
|
$nodes-filter-panel-pill-background-color: map-get($variant-colors, $nodes-filter-panel-pill-variant);
|
|
$nodes-filter-panel-pill-font-weight: 600;
|