You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
281 lines
5.9 KiB
SCSS
281 lines
5.9 KiB
SCSS
// 35c3 dark (2018)
|
|
@import "cyborg_variables.scss";
|
|
|
|
// Variables
|
|
// --------------------------------------------------
|
|
|
|
//== changed Colors
|
|
|
|
// gray BEBOOT: #4d4d4c
|
|
// blue FRESH: #0084b0
|
|
// green HOPE: #00a356
|
|
// dark blue BASE: #18386b
|
|
// orange GLINT: #f9b000
|
|
// rot BEAT: #e40429
|
|
// violet TENACY: #44357e
|
|
|
|
$gray-darker: #000;
|
|
$gray-dark: #000;
|
|
$gray: #4d4d4c; // BEBOOT
|
|
$gray-light: $gray;
|
|
$gray-lighter: lighten($gray, 15%);
|
|
|
|
$brand-primary: #0084b0; // FRESH
|
|
$brand-success: #00a356; // HOPE
|
|
$brand-info: $brand-primary;
|
|
$brand-warning: #f9b000; // GLINT
|
|
$brand-danger: #e40429; // BEAT
|
|
|
|
|
|
//== changed Scaffolding
|
|
|
|
$body-bg: #000;
|
|
|
|
$text-color: $gray-lighter;
|
|
|
|
$link-hover-color: lighten($link-color, 10%);
|
|
|
|
|
|
//== changed Typography
|
|
|
|
$headings-color: $brand-primary;
|
|
|
|
|
|
//== changed Tables
|
|
|
|
$table-bg: $gray-darker;
|
|
|
|
$table-bg-accent: #111;
|
|
|
|
$table-border-color: $gray;
|
|
|
|
|
|
//== changed Buttons
|
|
|
|
$btn-default-color: $link-color;
|
|
$btn-default-bg: $gray-darker;
|
|
|
|
$btn-default-border: $brand-primary;
|
|
|
|
$btn-primary-color: $gray-darker;
|
|
$btn-primary-border: $brand-primary;
|
|
|
|
$btn-success-border: darken($btn-default-bg, 10%);
|
|
|
|
$btn-info-color: $gray-darker;
|
|
$btn-info-border: darken($btn-default-bg, 10%);
|
|
|
|
$btn-warning-color: $gray-darker;
|
|
$btn-warning-border: darken($btn-default-bg, 10%);
|
|
|
|
$btn-danger-color: $gray-darker;
|
|
$btn-danger-border: darken($btn-default-bg, 10%);
|
|
|
|
|
|
//== changed Forms
|
|
|
|
$input-bg: $gray-darker;
|
|
|
|
$input-color: $link-color;
|
|
|
|
$input-border: $brand-primary;
|
|
|
|
$input-group-addon-bg: $gray-lighter;
|
|
|
|
|
|
//== changed Dropdowns
|
|
|
|
$dropdown-border: $brand-primary;
|
|
|
|
$dropdown-fallback-border: $brand-primary;
|
|
|
|
$dropdown-divider-bg: $dropdown-border;
|
|
|
|
$dropdown-link-color: $link-color;
|
|
|
|
$dropdown-link-hover-color: $link-hover-color;
|
|
|
|
$dropdown-link-hover-bg: $dropdown-bg;
|
|
|
|
|
|
//== changed Navbar
|
|
|
|
$navbar-default-border: $brand-primary;
|
|
|
|
$navbar-default-link-hover-color: $link-hover-color;
|
|
|
|
$navbar-default-link-active-color: $brand-primary;
|
|
|
|
$navbar-default-brand-color: $brand-primary;
|
|
$navbar-default-brand-hover-color: lighten($brand-primary, 10%);
|
|
|
|
|
|
//== changed Pagination
|
|
|
|
$pagination-color: $brand-primary;
|
|
$pagination-border: $brand-primary;
|
|
|
|
$pagination-hover-color: $gray-darker;
|
|
$pagination-hover-border: $pagination-border;
|
|
|
|
$pagination-active-color: $pagination-hover-color;
|
|
$pagination-active-bg: $pagination-hover-bg;
|
|
$pagination-active-border: $pagination-hover-border;
|
|
|
|
|
|
//== changed Form states and alerts
|
|
|
|
$state-success-text: $gray-darker;
|
|
$state-success-bg: $brand-success;
|
|
$state-success-border: darken($state-success-bg, 5%);
|
|
|
|
$state-info-text: $gray-darker;
|
|
$state-info-bg: $brand-info;
|
|
$state-info-border: darken($state-info-bg, 7%);
|
|
|
|
$state-warning-text: $gray-darker;
|
|
$state-warning-bg: $brand-warning;
|
|
$state-warning-border: darken($state-warning-bg, 3%);
|
|
|
|
$state-danger-text: $gray-darker;
|
|
$state-danger-bg: $brand-danger;
|
|
$state-danger-border: darken($state-danger-bg, 3%);
|
|
|
|
|
|
//== changed Labels
|
|
|
|
$label-color: $gray-darker;
|
|
|
|
$label-link-hover-color: $brand-primary;
|
|
|
|
//== changed Panels
|
|
|
|
$panel-default-border: $brand-primary;
|
|
$panel-default-heading-bg: $gray-darker;
|
|
|
|
$panel-primary-text: $gray-darker;
|
|
|
|
|
|
//== changed Badges
|
|
|
|
$badge-color: #fff;
|
|
|
|
$badge-link-hover-color: #fff;
|
|
|
|
|
|
//== changed Type
|
|
|
|
$headings-small-color: $gray-light;
|
|
|
|
@import "cyborg_styles.scss";
|
|
|
|
.messages .text-danger {
|
|
color: $gray-darker;
|
|
}
|
|
|
|
.messages .text-info {
|
|
color: $gray-darker;
|
|
}
|
|
|
|
.messages .caret {
|
|
color: $gray-darker;
|
|
}
|
|
|
|
|
|
// Bootswatch
|
|
// -----------------------------------------------------
|
|
// changed Typography =================================================================
|
|
|
|
.text-primary,
|
|
.text-primary:hover,
|
|
a.text-primary:hover {
|
|
color: $brand-primary;
|
|
}
|
|
|
|
.text-success,
|
|
.text-success:hover,
|
|
a.text-success:hover {
|
|
color: $brand-success;
|
|
}
|
|
|
|
.text-danger,
|
|
.text-danger:hover,
|
|
a.text-danger:hover {
|
|
color: $brand-danger;
|
|
}
|
|
|
|
.text-warning,
|
|
.text-warning:hover,
|
|
a.text-warning:hover {
|
|
color: $brand-warning;
|
|
}
|
|
|
|
.text-info,
|
|
.text-info:hover,
|
|
a.text-info:hover {
|
|
color: $brand-info;
|
|
}
|
|
|
|
// changed Tables =====================================================================
|
|
|
|
table,
|
|
.table {
|
|
color: $text-color;
|
|
|
|
a:not(.btn) {
|
|
color: $brand-primary;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.text-muted {
|
|
color: $text-muted;
|
|
}
|
|
}
|
|
|
|
// changed Forms ======================================================================
|
|
|
|
.input-group-addon {
|
|
background-color: $btn-default-bg;
|
|
}
|
|
|
|
// changed Indicators =================================================================
|
|
|
|
.alert {
|
|
|
|
.h1, .h2, .h3, .h4, .h5, .h6,
|
|
h1, h2, h3, h4, h5, h6 {
|
|
color: #fff;
|
|
}
|
|
|
|
.alert-link,
|
|
a {
|
|
color: $alert-warning-text;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.close {
|
|
text-decoration: none;
|
|
}
|
|
}
|
|
|
|
// changed Containers =================================================================
|
|
|
|
.btn-primary, .panel-info .panel-heading {
|
|
background-image: linear-gradient(to right, rgb(0, 132, 176) , rgb(0, 163, 86));
|
|
}
|
|
|
|
.label-warning {
|
|
color: #000;
|
|
}
|
|
|
|
// changed code tag
|
|
code {
|
|
background-color: $state-info-bg;
|
|
color: $state-info-text;
|
|
}
|
|
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
|
code {
|
|
color: $headings-color;
|
|
}
|
|
}
|