// 35c3 dark (2018) // Variables // -------------------------------------------------- @import 'dark'; $gray-darker: #000; $gray-dark: #000; $gray: #4d4d4c; // BEBOOT $gray-light: $gray; $gray-lighter: lighten($gray, 15%); $brand-primary: #0084b0; // FRESH $primary: #0084b0; $brand-success: #00a356; // HOPE $success: #00a356; // HOPE $brand-info: $brand-primary; $info: $brand-primary; $brand-warning: #f9b000; // GLINT $warning: #f9b000; // GLINT $brand-danger: #e40429; // BEAT $danger: #e40429; // BEAT //== changed Scaffolding $text-color: $gray-lighter; $body-bg: #000; $body-color: $text-color; $link-color: $brand-primary; $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; // component $component-active-color: #fff; $component-active-bg: $primary; //== changed Buttons $btn-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, 9%); $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-color: $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-bg: $gray-darker; $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-bg: $component-active-bg; $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 Type $headings-small-color: $gray-light; $alert-bg-scale: 0%; $alert-border-scale: 0; $alert-color-scale: 0; @import 'cyborg_variables.scss'; @import 'cyborg_styles.scss'; .messages .text-danger { color: $gray-darker; } .messages .text-info { color: $gray-darker; } .messages .caret { color: $gray-darker; } .navbar-brand { strong { color: $brand-primary; } } .navbar-dark .navbar-nav .nav-link { color: $brand-primary; } // 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, .card-info .card-heading { background-image: linear-gradient(to right, rgb(0, 132, 176), rgb(0, 163, 86)); } .btn-secondary { color: $primary; background-color: #000; border-color: $primary; &:hover { color: $primary; background-color: #000; border-color: darken($primary, 10%); } } .bg-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; } &.bg-primary, &.bg-secondary, &.bg-success, &.bg-danger, &.bg-info { color: #fff; } }