mirror of
https://github.com/retspen/webvirtcloud
synced 2026-11-10 12:16:49 +00:00
chore(frontend): upgrade Bootswatch and Bootstrap SCSS to v5.3.3
- Upgraded Bootswatch SCSS source files across all 25 themes (dev/scss/bootswatch/) to v5.3.3 - Upgraded Bootstrap SCSS source files (dev/scss/bootstrap/) to v5.3.3 to match static/js/bootstrap.bundle.min.js - Updated dev/scss/bootstrap-overrides.scss to import bootstrap/variables-dark - Verified error-free LibSass compilation for all 26 themes (25 Bootswatch + bootstrap-orj) - Recompiled static/css/wvc-main.min.css
This commit is contained in:
catborise
parent
ac91248a29
commit
2ea6652a0e
155 changed files with 1923 additions and 1095 deletions
|
|
@ -19,4 +19,4 @@
|
|||
|
||||
// Progress bars ===============================================================
|
||||
|
||||
// Containers ==================================================================
|
||||
// Containers ==================================================================
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Cerulean 5.2.2
|
||||
// Cerulean 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,16 +6,20 @@
|
|||
|
||||
$text-shadow: 0 1px 0 rgba(0, 0, 0, .05) !default;
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
// Mixins
|
||||
|
||||
@mixin btn-shadow($color){
|
||||
@include gradient-y-three-colors(tint-color($color, 16%), $color, 60%, shade-color($color, 6%));
|
||||
}
|
||||
|
||||
@mixin btn-shadow-hover($color){
|
||||
@include gradient-y-three-colors($color, shade-color($color, 5%), 60%, shade-color($color, 15%));
|
||||
}
|
||||
|
||||
@mixin btn-shadow-active($color){
|
||||
@include gradient-y-three-colors(shade-color($color, 20%), shade-color($color, 20%), 60%, shade-color($color, 30%));
|
||||
}
|
||||
|
||||
// Navbar
|
||||
|
||||
.navbar {
|
||||
|
|
@ -46,6 +50,18 @@ $text-shadow: 0 1px 0 rgba(0, 0, 0, .05) !default;
|
|||
.btn-#{$color} {
|
||||
@include btn-shadow($value);
|
||||
}
|
||||
|
||||
.btn-#{$color}:hover {
|
||||
@include btn-shadow-hover($value);
|
||||
}
|
||||
|
||||
.btn-#{$color}:active {
|
||||
@include btn-shadow-active($value);
|
||||
}
|
||||
|
||||
.btn-check:checked + .btn-#{$color} {
|
||||
@include btn-shadow-active($value);
|
||||
}
|
||||
}
|
||||
|
||||
// Typography
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Cerulean 5.2.2
|
||||
// Cerulean 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "cerulean" !default;
|
||||
|
|
@ -51,7 +51,6 @@ $headings-color: $cyan !default;
|
|||
|
||||
// Dropdowns
|
||||
|
||||
$dropdown-link-color: $body-color !default;
|
||||
$dropdown-link-hover-color: $white !default;
|
||||
$dropdown-link-hover-bg: $primary !default;
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Cosmo 5.2.2
|
||||
// Cosmo 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@300;400;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Typography
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Cosmo 5.2.2
|
||||
// Cosmo 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "cosmo" !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Cyborg 5.2.2
|
||||
// Cyborg 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: dark;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Navbar
|
||||
|
|
@ -59,9 +55,6 @@ legend {
|
|||
}
|
||||
|
||||
.form-control {
|
||||
color-scheme: light;
|
||||
background-clip: border-box;
|
||||
|
||||
&:disabled,
|
||||
&[readonly] {
|
||||
border-color: transparent;
|
||||
|
|
@ -132,6 +125,11 @@ legend {
|
|||
}
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
--bs-tooltip-bg: var(--bs-tertiary-bg);
|
||||
--bs-tooltip-color: var(--bs-emphasis-color);
|
||||
}
|
||||
|
||||
// Containers
|
||||
|
||||
.list-group-item-action {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Cyborg 5.2.2
|
||||
// Cyborg 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "cyborg" !default;
|
||||
|
|
@ -67,7 +67,7 @@ $table-border-color: $gray-700 !default;
|
|||
$table-dark-bg: $gray-500 !default;
|
||||
$table-dark-border-color: darken($gray-500, 7.5%) !default;
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Buttons
|
||||
|
||||
|
|
@ -89,7 +89,9 @@ $input-group-addon-border-color: transparent !default;
|
|||
$form-check-input-bg: $white !default;
|
||||
$form-check-input-border: none !default;
|
||||
|
||||
$form-file-button-color: $white !default;
|
||||
$form-file-button-color: $input-group-addon-color !default;
|
||||
$form-file-button-bg: $input-group-addon-bg !default;
|
||||
$form-file-button-hover-bg: darken($form-file-button-bg, 2%) !default;
|
||||
|
||||
// Dropdowns
|
||||
|
||||
|
|
@ -128,7 +130,6 @@ $card-bg: $gray-700 !default;
|
|||
|
||||
// Tooltips
|
||||
|
||||
$tooltip-bg: $gray-700 !default;
|
||||
$tooltip-opacity: 1 !default;
|
||||
|
||||
// Popovers
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Darkly 5.2.2
|
||||
// Darkly 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,400&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: dark;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Typography
|
||||
|
|
@ -23,16 +19,18 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0
|
|||
|
||||
// Forms
|
||||
|
||||
.form-control {
|
||||
color-scheme: light;
|
||||
@include color-mode(dark) {
|
||||
.input-group-text {
|
||||
// color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
.input-group-addon {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.form-floating > label {
|
||||
color: $gray-700;
|
||||
.form-floating {
|
||||
> label,
|
||||
> .form-control:focus ~ label,
|
||||
> .form-control:not(:placeholder-shown) ~ label {
|
||||
color: $input-placeholder-color;
|
||||
}
|
||||
}
|
||||
|
||||
// Navs
|
||||
|
|
@ -82,3 +80,8 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
--bs-tooltip-bg: var(--bs-tertiary-bg);
|
||||
--bs-tooltip-color: var(--bs-emphasis-color);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Darkly 5.2.2
|
||||
// Darkly 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "darkly" !default;
|
||||
|
|
@ -61,9 +61,11 @@ $text-muted: $gray-600 !default;
|
|||
|
||||
// Tables
|
||||
|
||||
$table-color: $white !default;
|
||||
|
||||
$table-border-color: $gray-700 !default;
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Forms
|
||||
|
||||
|
|
@ -72,11 +74,16 @@ $input-color: $gray-800 !default;
|
|||
$input-border-color: $body-bg !default;
|
||||
$input-group-addon-color: $gray-500 !default;
|
||||
$input-group-addon-bg: $gray-700 !default;
|
||||
$input-placeholder-color: $gray-600 !default;
|
||||
|
||||
$form-check-input-bg: $white !default;
|
||||
$form-check-input-border: none !default;
|
||||
|
||||
$form-file-button-color: $white !default;
|
||||
$form-select-disabled-color: $gray-600 !default;
|
||||
|
||||
$form-file-button-color: $input-group-addon-color !default;
|
||||
$form-file-button-bg: $input-group-addon-bg !default;
|
||||
$form-file-button-hover-bg: darken($form-file-button-bg, 5%) !default;
|
||||
|
||||
// Dropdowns
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Flatly 5.2.2
|
||||
// Flatly 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,37 +6,11 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;1,400&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
// Navbar
|
||||
|
||||
.bg-primary {
|
||||
.navbar-nav .show > .nav-link,
|
||||
.navbar-nav .nav-link.active,
|
||||
.navbar-nav .nav-link:hover,
|
||||
.navbar-nav .nav-link:focus {
|
||||
color: $success !important;
|
||||
}
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Navs
|
||||
|
||||
.nav-tabs {
|
||||
.nav-link.active,
|
||||
.nav-link.active:focus,
|
||||
.nav-link.active:hover,
|
||||
.nav-item.open .nav-link,
|
||||
.nav-item.open .nav-link:focus,
|
||||
.nav-item.open .nav-link:hover {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
.pagination {
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Flatly 5.2.2
|
||||
// Flatly 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "flatly" !default;
|
||||
|
|
@ -55,30 +55,36 @@ $h3-font-size: 2rem !default;
|
|||
|
||||
// Tables
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Dropdowns
|
||||
|
||||
$dropdown-border-color: $gray-400 !default;
|
||||
$dropdown-link-color: $gray-700 !default;
|
||||
$dropdown-link-hover-color: $white !default;
|
||||
$dropdown-link-hover-bg: $primary !default;
|
||||
|
||||
// Navs
|
||||
|
||||
$nav-link-padding-y: .5rem !default !default;
|
||||
$nav-link-padding-y: .5rem !default;
|
||||
$nav-link-padding-x: 2rem !default;
|
||||
$nav-link-disabled-color: $gray-600 !default !default;
|
||||
$nav-tabs-border-color: $gray-200 !default;
|
||||
$nav-link-disabled-color: $gray-600 !default;
|
||||
|
||||
$nav-tabs-border-color: $dropdown-border-color !default;
|
||||
$nav-tabs-link-hover-border-color: $nav-tabs-border-color $nav-tabs-border-color transparent !default;
|
||||
$nav-tabs-link-active-color: $success !default;
|
||||
$nav-tabs-link-active-border-color: $nav-tabs-link-hover-border-color !default;
|
||||
|
||||
|
||||
// Navbar
|
||||
|
||||
$navbar-padding-y: 1rem !default;
|
||||
$navbar-dark-color: $white !default;
|
||||
$navbar-dark-hover-color: $primary !default;
|
||||
$navbar-dark-active-color: $primary !default;
|
||||
$navbar-dark-hover-color: $success !default;
|
||||
$navbar-dark-active-color: $success !default;
|
||||
|
||||
$navbar-dark-brand-color: $white !default;
|
||||
$navbar-dark-brand-hover-color: $navbar-dark-brand-color !default;
|
||||
$navbar-dark-brand-hover-color: $navbar-dark-hover-color !default;
|
||||
|
||||
// Pagination
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Journal 5.2.2
|
||||
// Journal 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,33 +6,11 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=News+Cycle:wght@400;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Navbar
|
||||
|
||||
.bg-dark {
|
||||
background-color: $black !important;
|
||||
}
|
||||
|
||||
.bg-light {
|
||||
color: $black;
|
||||
background-color: $white !important;
|
||||
border: 1px solid $gray-200;
|
||||
|
||||
&.navbar-fixed-top {
|
||||
border-width: 0 0 1px;
|
||||
}
|
||||
|
||||
&.navbar-fixed-bottom {
|
||||
border-width: 1px 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar {
|
||||
font-family: $headings-font-family;
|
||||
font-size: 18px;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Journal 5.2.2
|
||||
// Journal 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "journal" !default;
|
||||
|
|
@ -53,10 +53,6 @@ $input-btn-padding-x: 1rem !default;
|
|||
|
||||
// Navbar
|
||||
|
||||
$navbar-light-color: rgba($black, .7) !default;
|
||||
$navbar-light-hover-color: $black !default;
|
||||
$navbar-light-active-color: $black !default;
|
||||
|
||||
// Pagination
|
||||
|
||||
$pagination-hover-color: $white !default;
|
||||
|
|
|
|||
|
|
@ -1,34 +1,13 @@
|
|||
// Litera 5.2.2
|
||||
// Litera 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
// Variables
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
// Navbar
|
||||
|
||||
.navbar {
|
||||
font-size: $font-size-sm;
|
||||
|
||||
&.bg-dark {
|
||||
background-color: $success !important;
|
||||
}
|
||||
|
||||
&.bg-light {
|
||||
background-color: $white !important;
|
||||
border: 1px solid rgba(0, 0, 0, .1);
|
||||
|
||||
&.navbar-fixed-top {
|
||||
border-width: 0 0 1px;
|
||||
}
|
||||
|
||||
&.navbar-fixed-bottom {
|
||||
border-width: 1px 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Typography
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Litera 5.2.2
|
||||
// Litera 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "litera" !default;
|
||||
|
|
@ -59,7 +59,7 @@ $headings-font-weight: 700 !default;
|
|||
|
||||
$table-border-color: rgba(0, 0, 0, .1) !default;
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Buttons
|
||||
|
||||
|
|
@ -76,15 +76,10 @@ $btn-border-radius-sm: .844em !default;
|
|||
// Forms
|
||||
|
||||
$input-border-color: rgba(0, 0, 0, .1) !default;
|
||||
$input-group-addon-bg: $gray-200 !default !default;
|
||||
$input-group-addon-bg: $gray-200 !default;
|
||||
|
||||
// Navbar
|
||||
|
||||
$navbar-dark-color: rgba($white, .6) !default;
|
||||
$navbar-dark-hover-color: $white !default;
|
||||
$navbar-light-hover-color: $body-color !default;
|
||||
$navbar-light-active-color: $body-color !default;
|
||||
|
||||
// Tooltips
|
||||
|
||||
$tooltip-font-size: 11px !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Lumen 5.2.2
|
||||
// Lumen 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,300;0,400;0,700;1,400&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Mixins
|
||||
|
|
@ -30,6 +26,11 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,w
|
|||
border-color: shade-color($value, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
&.bg-body-secondary,
|
||||
&.bg-body-tertiary {
|
||||
border-color: rgba(0, 0, 0, .1);
|
||||
}
|
||||
}
|
||||
|
||||
// Buttons
|
||||
|
|
@ -68,7 +69,7 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,w
|
|||
}
|
||||
|
||||
.btn-outline-secondary {
|
||||
color: $black;
|
||||
color: var(--bs-tertiary-color);
|
||||
}
|
||||
|
||||
[class*="btn-outline"] {
|
||||
|
|
@ -117,7 +118,7 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,w
|
|||
|
||||
.nav-tabs {
|
||||
.nav-link {
|
||||
color: $body-color;
|
||||
color: var(--#{$prefix}body-color);
|
||||
|
||||
&,
|
||||
&.disabled,
|
||||
|
|
@ -133,6 +134,7 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,w
|
|||
&.active {
|
||||
padding-bottom: add(.5rem, 6px);
|
||||
margin-top: 0;
|
||||
color: var(--#{$prefix}body-color);
|
||||
border-bottom-color: transparent;
|
||||
}
|
||||
}
|
||||
|
|
@ -150,7 +152,7 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,w
|
|||
}
|
||||
|
||||
.breadcrumb {
|
||||
border-color: shade-color($breadcrumb-bg, 10%);
|
||||
border-color: $pagination-border-color;
|
||||
@include shadow();
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Lumen 5.2.2
|
||||
// Lumen 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "lumen" !default;
|
||||
|
|
@ -41,6 +41,11 @@ $dark: $gray-700 !default;
|
|||
|
||||
$min-contrast-ratio: 1.75 !default;
|
||||
|
||||
// Prefix for :root CSS variables
|
||||
|
||||
$variable-prefix: bs- !default; // Deprecated in v5.2.0 for the shorter `$prefix`
|
||||
$prefix: $variable-prefix !default;
|
||||
|
||||
// Fonts
|
||||
|
||||
// stylelint-disable-next-line value-keyword-case
|
||||
|
|
@ -48,7 +53,7 @@ $font-family-sans-serif: "Source Sans Pro", -apple-system, BlinkMacSystemFo
|
|||
|
||||
// Tables
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Buttons
|
||||
|
||||
|
|
@ -56,19 +61,17 @@ $btn-font-weight: 700 !default;
|
|||
|
||||
// Dropdowns
|
||||
|
||||
$dropdown-link-color: rgba(0, 0, 0, .5) !default;
|
||||
$dropdown-link-color: var(--#{$prefix}tertiary-color) !default;
|
||||
|
||||
// Navs
|
||||
|
||||
$nav-tabs-border-color: $gray-200 !default;
|
||||
$nav-tabs-link-hover-border-color: $nav-tabs-border-color !default;
|
||||
$nav-tabs-link-active-color: $gray-900 !default;
|
||||
$nav-tabs-link-active-border-color: $nav-tabs-border-color !default;
|
||||
$nav-link-color: var(--#{$prefix}link-color) !default;
|
||||
|
||||
// Pagination
|
||||
|
||||
$pagination-color: $gray-700 !default;
|
||||
$pagination-bg: $gray-200 !default;
|
||||
$pagination-bg: var(--#{$prefix}tertiary-bg) !default;
|
||||
$pagination-border-color: var(--#{$prefix}border-color) !default;
|
||||
$pagination-hover-color: $pagination-color !default;
|
||||
$pagination-hover-bg: $pagination-bg !default;
|
||||
$pagination-active-border-color: darken($primary, 5%) !default;
|
||||
|
|
|
|||
|
|
@ -1,16 +1,12 @@
|
|||
// Lux 5.2.2
|
||||
// Lux 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
// Variables
|
||||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;600&display=swap" !default;
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@200;300;400;500;600;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Navbar
|
||||
|
|
@ -93,10 +89,15 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;6
|
|||
border: 1px solid $gray-400 !important;
|
||||
}
|
||||
|
||||
@include color-mode(dark) {
|
||||
.btn-primary {
|
||||
background-color: #080808;
|
||||
}
|
||||
}
|
||||
|
||||
// Typography
|
||||
|
||||
body {
|
||||
font-weight: 200;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
|
|
@ -135,6 +136,53 @@ th {
|
|||
}
|
||||
}
|
||||
|
||||
// Forms
|
||||
|
||||
@include color-mode(dark) {
|
||||
.form-control {
|
||||
color: $body-color;
|
||||
|
||||
&::placeholder {
|
||||
color: $body-secondary-color;
|
||||
}
|
||||
}
|
||||
|
||||
.form-floating {
|
||||
> label,
|
||||
> .form-control:focus ~ label,
|
||||
> .form-control:not(:placeholder-shown) ~ label,
|
||||
> .form-control-plaintext ~ label,
|
||||
> .form-select ~ label {
|
||||
color: $body-secondary-color;
|
||||
}
|
||||
|
||||
> .form-control::placeholder,
|
||||
> .form-control-plaintext::placeholder {
|
||||
color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.form-check-input:checked {
|
||||
background-color: $body-secondary-color;
|
||||
}
|
||||
|
||||
.form-switch .form-check-input {
|
||||
background-image: $form-switch-bg-image;
|
||||
}
|
||||
|
||||
.form-range::-webkit-slider-thumb {
|
||||
background-color: $gray-600;
|
||||
}
|
||||
|
||||
.form-range:disabled::-webkit-slider-thumb {
|
||||
background-color: $gray-800;
|
||||
}
|
||||
|
||||
.input-group-text {
|
||||
color: $body-secondary-color;
|
||||
}
|
||||
}
|
||||
|
||||
// Navs
|
||||
|
||||
.dropdown-menu {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Lux 5.2.2
|
||||
// Lux 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "lux" !default;
|
||||
|
|
@ -53,6 +53,15 @@ $body-color: $gray-700 !default;
|
|||
|
||||
// stylelint-disable-next-line value-keyword-case
|
||||
$font-family-sans-serif: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default;
|
||||
|
||||
$font-weight-lighter: lighter !default;
|
||||
$font-weight-light: 200 !default;
|
||||
$font-weight-normal: 300 !default;
|
||||
$font-weight-medium: 400 !default;
|
||||
$font-weight-semibold: 500 !default;
|
||||
$font-weight-bold: 600 !default;
|
||||
$font-weight-bolder: bolder !default;
|
||||
|
||||
$h1-font-size: 2rem !default;
|
||||
$h2-font-size: 1.75rem !default;
|
||||
$h3-font-size: 1.5rem !default;
|
||||
|
|
@ -88,6 +97,9 @@ $input-bg: $gray-200 !default;
|
|||
$input-disabled-bg: $gray-300 !default;
|
||||
$input-group-addon-bg: $gray-300 !default;
|
||||
|
||||
$form-select-disabled-color: $gray-600 !default;
|
||||
$form-select-disabled-bg: $input-disabled-bg !default;
|
||||
|
||||
// Navbar
|
||||
|
||||
$navbar-padding-y: 1.5rem !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Materia 5.2.2
|
||||
// Materia 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Mixins
|
||||
|
|
@ -118,16 +114,6 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;50
|
|||
}
|
||||
}
|
||||
|
||||
.bg-primary,
|
||||
.bg-success,
|
||||
.bg-info,
|
||||
.bg-warning,
|
||||
.bg-danger,
|
||||
.bg-dark,
|
||||
.bg-black {
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
// Buttons
|
||||
|
||||
@include btn(primary, $primary, $white);
|
||||
|
|
@ -264,10 +250,6 @@ p {
|
|||
}
|
||||
}
|
||||
|
||||
.form-control {
|
||||
color-scheme: inherit;
|
||||
}
|
||||
|
||||
textarea,
|
||||
textarea.form-control,
|
||||
input.form-control,
|
||||
|
|
@ -302,12 +284,12 @@ input[type="number"],
|
|||
select,
|
||||
select.form-control {
|
||||
padding: .5rem 0;
|
||||
appearance: none;
|
||||
background-image: escape-svg(url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 4'><path fill='#{$gray-600}' d='M8 0 4 4 0 0z'/></svg>"));
|
||||
background-repeat: no-repeat;
|
||||
background-position: right center;
|
||||
background-size: 8px 4px;
|
||||
box-shadow: inset 0 -1px 0 #ddd;
|
||||
appearance: none;
|
||||
|
||||
&.input {
|
||||
&-sm {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Materia 5.2.2
|
||||
// Materia 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "materia" !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Minty 5.2.2
|
||||
// Minty 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Navbar
|
||||
|
|
@ -19,14 +15,6 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Montserrat:wght@400;50
|
|||
font-family: $headings-font-family;
|
||||
}
|
||||
|
||||
.bg-dark {
|
||||
background-color: $secondary !important;
|
||||
}
|
||||
|
||||
.border-dark {
|
||||
border-color: $secondary !important;
|
||||
}
|
||||
|
||||
// Buttons
|
||||
|
||||
.btn {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Minty 5.2.2
|
||||
// Minty 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "minty" !default;
|
||||
|
|
@ -61,7 +61,7 @@ $headings-color: $gray-700 !default;
|
|||
|
||||
$table-border-color: rgba(0, 0, 0, .05) !default;
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Dropdowns
|
||||
|
||||
|
|
@ -70,13 +70,6 @@ $dropdown-link-hover-bg: $secondary !default;
|
|||
|
||||
// Navbar
|
||||
|
||||
$navbar-dark-color: rgba($white, .6) !default;
|
||||
$navbar-dark-hover-color: $white !default;
|
||||
$navbar-light-color: rgba($black, .3) !default;
|
||||
$navbar-light-hover-color: $gray-700 !default;
|
||||
$navbar-light-active-color: $gray-700 !default;
|
||||
$navbar-light-disabled-color: rgba($black, .1) !default;
|
||||
|
||||
// Pagination
|
||||
|
||||
$pagination-color: $white !default;
|
||||
|
|
@ -94,7 +87,7 @@ $pagination-disabled-border-color: $pagination-disabled-bg !default;
|
|||
// Alerts
|
||||
|
||||
$alert-color-scale: 0% !default;
|
||||
$alert-bg-scale: 0 !default;
|
||||
$alert-bg-scale: 0% !default;
|
||||
|
||||
// Breadcrumbs
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Morph 5.2.2
|
||||
// Morph 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,25 +6,23 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
$btn-box-shadow-inset: inset 2px 3px 6px rgba($black, .2), inset -3px -2px 6px rgba($white, .2) !default;
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
}
|
||||
$box-shadow-dark: 5px 5px 10px rgba(darken($dark, 50%), .2), -5px -5px 10px rgba($white, .05) !default;
|
||||
|
||||
// Mixins
|
||||
|
||||
@mixin shadow($shadow: $box-shadow) {
|
||||
background-color: $gray-200;
|
||||
@mixin shadow($bg: $gray-200, $shadow: $box-shadow) {
|
||||
background-color: $bg;
|
||||
border: none;
|
||||
box-shadow: $shadow;
|
||||
transition: background-color .15s ease-in-out, border .15s ease-in-out, box-shadow .15s ease-in-out, color .15s ease-in-out;
|
||||
}
|
||||
|
||||
@mixin shadow-outline($shadow: $box-shadow) {
|
||||
@mixin shadow-outline($bg: $body-bg, $shadow: $box-shadow) {
|
||||
position: absolute;
|
||||
top: -.5rem;
|
||||
right: -.5rem;
|
||||
|
|
@ -32,7 +30,7 @@ $btn-box-shadow-inset: inset 2px 3px 6px rgba($black, .2), inset -3px -2px 6px r
|
|||
left: -.5rem;
|
||||
z-index: -1;
|
||||
content: "";
|
||||
background-color: $body-bg;
|
||||
background-color: $bg;
|
||||
border: 1px solid rgba($white, .1);
|
||||
box-shadow: $shadow;
|
||||
transition: background-color .15s ease-in-out, border .15s ease-in-out, box-shadow .15s ease-in-out, color .15s ease-in-out;
|
||||
|
|
@ -97,6 +95,13 @@ $btn-box-shadow-inset: inset 2px 3px 6px rgba($black, .2), inset -3px -2px 6px r
|
|||
}
|
||||
}
|
||||
|
||||
@include color-mode(dark) {
|
||||
.btn {
|
||||
@include shadow($dark, $box-shadow-dark);
|
||||
color: $navbar-dark-color;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-outline {
|
||||
@each $color, $value in $theme-colors {
|
||||
&-#{$color} {
|
||||
|
|
@ -160,6 +165,14 @@ $btn-box-shadow-inset: inset 2px 3px 6px rgba($black, .2), inset -3px -2px 6px r
|
|||
}
|
||||
}
|
||||
|
||||
@include color-mode(dark) {
|
||||
.btn-group,
|
||||
.btn-group-vertical {
|
||||
@include shadow($dark, $box-shadow-dark);
|
||||
color: $navbar-dark-color;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
|
||||
> .btn:nth-child(n + 3),
|
||||
|
|
@ -258,6 +271,14 @@ $btn-box-shadow-inset: inset 2px 3px 6px rgba($black, .2), inset -3px -2px 6px r
|
|||
box-shadow: inset 0 3px 6px rgba($black, .2);
|
||||
}
|
||||
|
||||
@include color-mode(dark) {
|
||||
.btn-check:not(:checked) + .btn,
|
||||
.btn-check:not(:checked) + .btn:active {
|
||||
color: $navbar-dark-color;
|
||||
background-color: $dark;
|
||||
}
|
||||
}
|
||||
|
||||
// Navs
|
||||
|
||||
.dropdown-menu {
|
||||
|
|
@ -310,6 +331,16 @@ $btn-box-shadow-inset: inset 2px 3px 6px rgba($black, .2), inset -3px -2px 6px r
|
|||
border-radius: $border-radius;
|
||||
}
|
||||
|
||||
@include color-mode(dark) {
|
||||
.nav-tabs,
|
||||
.nav-pills,
|
||||
.breadcrumb,
|
||||
.pagination {
|
||||
@include shadow($dark, $box-shadow-dark);
|
||||
color: $navbar-dark-color;
|
||||
}
|
||||
}
|
||||
|
||||
// Forms
|
||||
|
||||
.input-group {
|
||||
|
|
@ -318,8 +349,6 @@ $btn-box-shadow-inset: inset 2px 3px 6px rgba($black, .2), inset -3px -2px 6px r
|
|||
box-shadow: $box-shadow-inset;
|
||||
|
||||
> .form-control {
|
||||
padding-right: 0;
|
||||
padding-left: 0;
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
|
@ -327,6 +356,19 @@ $btn-box-shadow-inset: inset 2px 3px 6px rgba($black, .2), inset -3px -2px 6px r
|
|||
.input-group-text {
|
||||
background: none;
|
||||
}
|
||||
|
||||
.btn {
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
|
||||
&:first-child {
|
||||
border-radius: $border-radius 0 0 $border-radius;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-radius: 0 $border-radius $border-radius 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-range {
|
||||
|
|
@ -371,11 +413,27 @@ $btn-box-shadow-inset: inset 2px 3px 6px rgba($black, .2), inset -3px -2px 6px r
|
|||
box-shadow: $box-shadow;
|
||||
}
|
||||
|
||||
@include color-mode(dark) {
|
||||
.form-control {
|
||||
&:disabled {
|
||||
background-color: $gray-400;
|
||||
}
|
||||
|
||||
&::file-selector-button {
|
||||
box-shadow: 2px 2px 5px rgba($black, .2), inset 3px 3px 10px rgba(shade-color($form-range-thumb-bg, 50%), .1);
|
||||
}
|
||||
}
|
||||
|
||||
.form-select:not([multiple]) {
|
||||
box-shadow: $box-shadow-dark;
|
||||
}
|
||||
}
|
||||
|
||||
// Indicators
|
||||
|
||||
.alert {
|
||||
box-shadow: $dropdown-box-shadow;
|
||||
backdrop-filter: blur(3px);
|
||||
box-shadow: $dropdown-box-shadow;
|
||||
|
||||
@each $color, $value in $theme-colors {
|
||||
&-#{$color} {
|
||||
|
|
@ -399,16 +457,16 @@ $btn-box-shadow-inset: inset 2px 3px 6px rgba($black, .2), inset -3px -2px 6px r
|
|||
|
||||
&-inner,
|
||||
.arrow {
|
||||
box-shadow: $dropdown-box-shadow;
|
||||
backdrop-filter: blur(3px);
|
||||
box-shadow: $dropdown-box-shadow;
|
||||
}
|
||||
}
|
||||
|
||||
.popover,
|
||||
.toast,
|
||||
.modal-content {
|
||||
box-shadow: $dropdown-box-shadow;
|
||||
backdrop-filter: blur(3px);
|
||||
box-shadow: $dropdown-box-shadow;
|
||||
}
|
||||
|
||||
.progress {
|
||||
|
|
@ -462,3 +520,31 @@ $btn-box-shadow-inset: inset 2px 3px 6px rgba($black, .2), inset -3px -2px 6px r
|
|||
.list-group-item {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
@include color-mode(dark) {
|
||||
|
||||
.card,
|
||||
.list-group {
|
||||
background-color: mix($black, $dark, 3%);
|
||||
box-shadow: inset 2px 2px 6px rgba(shade-color($dark, 50%), .2), inset -3px -2px 4px rgba($white, .05);
|
||||
}
|
||||
|
||||
.card {
|
||||
&.bg-secondary,
|
||||
&.bg-light {
|
||||
color: $body-color;
|
||||
}
|
||||
}
|
||||
|
||||
.modal-content,
|
||||
.popover,
|
||||
.toast {
|
||||
background-color: mix($white, $dark, 3%);
|
||||
box-shadow: 8px 8px 40px rgba(0, 0, 0, .15), inset 1px 1px 3px rgba(255, 255, 255, .05), inset -5px -5px 20px rgba(0, 0, 0, .05);
|
||||
}
|
||||
|
||||
.popover-header,
|
||||
.toast-header {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Morph 5.2.2
|
||||
// Morph 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "morph" !default;
|
||||
|
|
@ -110,8 +110,6 @@ $form-range-thumb-bg: $gray-100 !default;
|
|||
$form-range-thumb-active-bg: $form-range-thumb-bg !default;
|
||||
$form-range-thumb-disabled-bg: $gray-200 !default;
|
||||
|
||||
$form-file-button-bg: $gray-100 !default;
|
||||
|
||||
// Navs
|
||||
|
||||
$nav-link-color: $body-color !default;
|
||||
|
|
@ -152,7 +150,7 @@ $pagination-padding-y-sm: .5rem !default;
|
|||
$pagination-padding-y-lg: 1.5rem !default;
|
||||
|
||||
$pagination-color: $gray-700 !default;
|
||||
$pagination-bg: $body-bg !default;
|
||||
$pagination-bg: transparent !default;
|
||||
|
||||
$pagination-active-color: darken($pagination-color, 20%) !default;
|
||||
$pagination-active-bg: transparent !default;
|
||||
|
|
@ -166,22 +164,19 @@ $pagination-disabled-bg: $pagination-bg !default;
|
|||
$card-spacer-y: 1.5rem !default;
|
||||
$card-spacer-x: 1.5rem !default;
|
||||
$card-cap-bg: transparent !default;
|
||||
$card-bg: lighten($body-bg, 3%) !default;
|
||||
|
||||
// Tooltips
|
||||
|
||||
$tooltip-color: $body-color !default;
|
||||
$tooltip-bg: $dropdown-bg !default;
|
||||
|
||||
// Popovers
|
||||
|
||||
$popover-bg: $dropdown-bg !default;
|
||||
|
||||
$popover-header-bg: transparent !default;
|
||||
|
||||
$popover-arrow-width: 0 !default;
|
||||
|
||||
// Toasts
|
||||
|
||||
$toast-background-color: $dropdown-bg !default;
|
||||
$toast-border-width: 0 !default;
|
||||
|
||||
$toast-header-color: $body-color !default;
|
||||
|
|
@ -194,8 +189,6 @@ $badge-padding-x: 1.25em !default;
|
|||
|
||||
// Modals
|
||||
|
||||
$modal-content-bg: $dropdown-bg !default;
|
||||
|
||||
// Progress bars
|
||||
|
||||
$progress-height: 1.5rem !default;
|
||||
|
|
@ -203,8 +196,6 @@ $progress-border-radius: $border-radius-pill !default;
|
|||
|
||||
// List groups
|
||||
|
||||
$list-group-bg: $card-bg !default;
|
||||
|
||||
$list-group-hover-bg: transparent !default;
|
||||
$list-group-active-color: $link-color !default;
|
||||
$list-group-active-bg: transparent !default;
|
||||
|
|
|
|||
|
|
@ -1,13 +1,9 @@
|
|||
// Pulse 5.2.2
|
||||
// Pulse 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
// Variables
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
// Buttons
|
||||
|
||||
.btn {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Pulse 5.2.2
|
||||
// Pulse 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "pulse" !default;
|
||||
|
|
@ -75,11 +75,6 @@ $nav-tabs-link-hover-border-color: $primary !default;
|
|||
// Navbar
|
||||
|
||||
$navbar-padding-y: 1.2rem !default;
|
||||
$navbar-dark-hover-color: rgba($white, .9) !default;
|
||||
$navbar-dark-active-color: rgba($white, .9) !default;
|
||||
$navbar-light-color: rgba($black, .4) !default;
|
||||
$navbar-light-active-color: rgba($black, .7) !default;
|
||||
$navbar-light-disabled-color: rgba($black, .2) !default;
|
||||
|
||||
// Progress bars
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Quartz 5.2.2
|
||||
// Quartz 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -7,10 +7,6 @@
|
|||
$body-bg-image: linear-gradient(90deg, shade-color($cyan, 10%), shade-color($purple, 10%), shade-color($pink, 5%)) !default;
|
||||
$frosted-opacity: .3 !default;
|
||||
|
||||
:root {
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
// Mixins
|
||||
|
||||
@mixin glass($opacity: $frosted-opacity, $bg: $white) {
|
||||
|
|
@ -39,6 +35,12 @@ body {
|
|||
background-image: $body-bg-image;
|
||||
}
|
||||
|
||||
@include color-mode(dark) {
|
||||
body {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
// Tables
|
||||
|
||||
.table-secondary {
|
||||
|
|
@ -83,8 +85,12 @@ body {
|
|||
.form-control::file-selector-button {
|
||||
background-color: transparent;
|
||||
background-image: linear-gradient(125deg, rgba($white, .3), rgba($white, .2) 70%);
|
||||
border: none;
|
||||
backdrop-filter: blur(5px);
|
||||
border: none;
|
||||
}
|
||||
|
||||
.form-control:hover:not(:disabled):not([readonly])::file-selector-button {
|
||||
background-color: rgba($white, .1);
|
||||
}
|
||||
|
||||
.input-group-text {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Quartz 5.2.2
|
||||
// Quartz 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "quartz" !default;
|
||||
|
|
@ -79,7 +79,7 @@ $blockquote-footer-color: $text-muted !default;
|
|||
$table-dark-bg: $dark !default;
|
||||
$table-dark-border-color: darken($dark, 5%) !default;
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Buttons + Forms
|
||||
|
||||
|
|
@ -103,6 +103,9 @@ $input-focus-box-shadow: none !default;
|
|||
|
||||
$input-placeholder-color: $text-muted !default;
|
||||
|
||||
$form-select-disabled-color: $input-placeholder-color !default;
|
||||
$form-select-disabled-bg: $input-disabled-bg !default;
|
||||
|
||||
$form-switch-color: $white !default;
|
||||
|
||||
$form-switch-focus-color: $form-switch-color !default;
|
||||
|
|
@ -117,8 +120,6 @@ $form-select-focus-box-shadow: none !default;
|
|||
|
||||
$form-range-track-bg: rgba($black, .2) !default;
|
||||
|
||||
$form-range-thumb-disabled-bg: $gray-500 !default;
|
||||
|
||||
// Navs
|
||||
|
||||
$nav-link-disabled-color: $text-muted !default;
|
||||
|
|
@ -135,14 +136,6 @@ $nav-pills-link-active-bg: $primary !default;
|
|||
|
||||
// Navbars
|
||||
|
||||
$navbar-dark-color: rgba($white, .8) !default;
|
||||
$navbar-dark-hover-color: $white !default;
|
||||
|
||||
$navbar-light-color: rgba($gray-800, .8) !default;
|
||||
$navbar-light-hover-color: $gray-800 !default;
|
||||
$navbar-light-active-color: $gray-800 !default;
|
||||
$navbar-light-disabled-color: rgba($gray-800, .3) !default;
|
||||
|
||||
// Dropdowns
|
||||
|
||||
$dropdown-border-color: $border-color !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Sandstone 5.2.2
|
||||
// Sandstone 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Navbar
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Sandstone 5.2.2
|
||||
// Sandstone 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "sandstone" !default;
|
||||
|
|
@ -75,10 +75,6 @@ $nav-pills-link-active-bg: $gray-200 !default;
|
|||
|
||||
// Navbar
|
||||
|
||||
$navbar-dark-hover-color: $white !default;
|
||||
$navbar-light-hover-color: $black !default;
|
||||
$navbar-light-active-color: $black !default;
|
||||
|
||||
// Pagination
|
||||
|
||||
$pagination-color: $gray-600 !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Simplex 5.2.2
|
||||
// Simplex 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Mixins
|
||||
|
|
@ -37,7 +33,6 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700
|
|||
}
|
||||
|
||||
&.bg-primary {
|
||||
background-color: $primary !important;
|
||||
border-color: shade-color($primary, 13%) !important;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Simplex 5.2.2
|
||||
// Simplex 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "simplex" !default;
|
||||
|
|
@ -63,9 +63,6 @@ $nav-tabs-border-color: darken(#fff, 6.5%) !default;
|
|||
|
||||
// Navbar
|
||||
|
||||
$navbar-dark-color: rgba($white, .75) !default;
|
||||
$navbar-dark-hover-color: $white !default;
|
||||
|
||||
// Pagination
|
||||
|
||||
$pagination-border-color: $nav-tabs-border-color !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Sketchy 5.2.2
|
||||
// Sketchy 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,7 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css?family=Neucha|Cabin+Sketch&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// stylelint-disable scss/dollar-variable-default
|
||||
|
|
@ -15,10 +15,6 @@ $border-radius-lg-sketchy: 55px 225px 15px 25px / 25px 25px 35px 355px;
|
|||
$border-radius-sm-sketchy: 255px 25px 225px 25px / 25px 225px 25px 255px;
|
||||
// style-enable scss/dollar-variable-default
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
// Navbar
|
||||
|
||||
.navbar {
|
||||
|
|
@ -173,9 +169,9 @@ select.form-control {
|
|||
position: relative;
|
||||
width: 0;
|
||||
height: 0;
|
||||
appearance: none;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
appearance: none;
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
|
|
@ -193,16 +189,25 @@ select.form-control {
|
|||
box-shadow: 0 0 0 .25rem rgba(51, 51, 51, .25);
|
||||
}
|
||||
|
||||
&:checked::after {
|
||||
&:checked::after,
|
||||
&:indeterminate::after {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: .1em;
|
||||
font-size: 1.5rem;
|
||||
line-height: .5;
|
||||
color: $gray-800;
|
||||
}
|
||||
|
||||
&:checked::after {
|
||||
content: "x";
|
||||
}
|
||||
|
||||
&:indeterminate::after {
|
||||
top: .1em;
|
||||
content: "-";
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
&::before {
|
||||
border: 2px solid $gray-500;
|
||||
|
|
@ -214,9 +219,9 @@ select.form-control {
|
|||
position: relative;
|
||||
width: 0;
|
||||
height: 0;
|
||||
appearance: none;
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
appearance: none;
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Sketchy 5.2.2
|
||||
// Sketchy 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "sketchy" !default;
|
||||
|
|
@ -70,8 +70,12 @@ $table-border-color: $gray-800 !default;
|
|||
// Forms
|
||||
|
||||
$input-border-color: $gray-800 !default;
|
||||
$input-disabled-border-color: $gray-600 !default;
|
||||
$input-focus-border-color: $input-border-color !default;
|
||||
|
||||
$form-select-disabled-color: $gray-600 !default;
|
||||
$form-select-disabled-border-color: $input-disabled-border-color !default;
|
||||
|
||||
// Dropdowns
|
||||
|
||||
$dropdown-border-color: $gray-800 !default;
|
||||
|
|
@ -88,14 +92,6 @@ $nav-tabs-link-active-border-color: $gray-800 !default;
|
|||
|
||||
// Navbar
|
||||
|
||||
$navbar-dark-color: $white !default;
|
||||
$navbar-dark-hover-color: $white !default;
|
||||
$navbar-dark-toggler-border-color: $white !default;
|
||||
$navbar-light-color: $gray-800 !default;
|
||||
$navbar-light-hover-color: $gray-800 !default;
|
||||
$navbar-light-active-color: $gray-800 !default;
|
||||
$navbar-light-toggler-border-color: $gray-800 !default;
|
||||
|
||||
// Pagination
|
||||
|
||||
$pagination-border-color: $gray-800 !default;
|
||||
|
|
|
|||
|
|
@ -1,21 +1,22 @@
|
|||
// Slate 5.2.2
|
||||
// Slate 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
// Variables
|
||||
|
||||
:root {
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
// Mixins
|
||||
|
||||
@mixin btn-shadow($color){
|
||||
@include gradient-y-three-colors(tint-color($color, 12%), $color, 60%, shade-color($color, 8%));
|
||||
@include gradient-y-three-colors(tint-color($color, 5%), $color, 20%, shade-color($color, 20%));
|
||||
filter: none;
|
||||
}
|
||||
|
||||
@mixin btn-shadow-inverse($color){
|
||||
@include gradient-y-three-colors(shade-color($color, 16%), shade-color($color, 10%), 40%, shade-color($color, 6%));
|
||||
filter: none;
|
||||
}
|
||||
|
||||
@mixin btn-shadow-inverse-dark($color){
|
||||
@include gradient-y-three-colors(shade-color($color, 36%), shade-color($color, 30%), 40%, shade-color($color, 26%));
|
||||
filter: none;
|
||||
}
|
||||
|
|
@ -23,7 +24,7 @@
|
|||
// Navbar
|
||||
|
||||
.navbar {
|
||||
text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
|
||||
text-shadow: 1px 1px 1px rgba(0, 0, 0, .2);
|
||||
border: 1px solid rgba(0, 0, 0, .6);
|
||||
|
||||
.container {
|
||||
|
|
@ -46,12 +47,6 @@
|
|||
padding: 1rem;
|
||||
border-right: 1px solid rgba(0, 0, 0, .2);
|
||||
border-left: 1px solid rgba(255, 255, 255, .1);
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
@include btn-shadow-inverse($gray-800);
|
||||
border-left: 1px solid rgba(0, 0, 0, .2);
|
||||
}
|
||||
}
|
||||
|
||||
&-brand {
|
||||
|
|
@ -69,14 +64,20 @@
|
|||
margin-left: 0;
|
||||
}
|
||||
|
||||
&.bg-light {
|
||||
text-shadow: 1px 1px 1px rgba(0, 0, 0, .1);
|
||||
@each $color, $value in $theme-colors {
|
||||
&.bg-#{$color} {
|
||||
|
||||
.nav-link {
|
||||
&:hover,
|
||||
&:focus {
|
||||
@include btn-shadow-inverse($gray-600);
|
||||
border-left: 1px solid rgba(0, 0, 0, .2);
|
||||
.nav-link {
|
||||
&:hover {
|
||||
@include btn-shadow-inverse($value);
|
||||
border-left: 1px solid rgba(0, 0, 0, .2);
|
||||
}
|
||||
|
||||
&:active,
|
||||
&.active {
|
||||
@include btn-shadow-inverse-dark($value);
|
||||
border-left: 1px solid rgba(0, 0, 0, .2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -128,74 +129,20 @@
|
|||
&:not([disabled]):not(.disabled).active:hover {
|
||||
border-color: rgba(0, 0, 0, .6);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
@include btn-shadow($primary);
|
||||
@each $color, $value in $theme-colors {
|
||||
&-#{$color} {
|
||||
@include btn-shadow($value);
|
||||
|
||||
&:not([disabled]):not(.disabled):hover,
|
||||
&:not([disabled]):not(.disabled):focus,
|
||||
&:not([disabled]):not(.disabled):active:hover,
|
||||
&:not([disabled]):not(.disabled).active:hover {
|
||||
@include btn-shadow-inverse($primary);
|
||||
}
|
||||
}
|
||||
&:not([disabled]):not(.disabled):hover {
|
||||
@include btn-shadow-inverse($value);
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
@include btn-shadow($secondary);
|
||||
|
||||
&:not([disabled]):not(.disabled):hover,
|
||||
&:not([disabled]):not(.disabled):focus,
|
||||
&:not([disabled]):not(.disabled):active,
|
||||
&:not([disabled]):not(.disabled).active {
|
||||
@include btn-shadow-inverse($secondary);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-success {
|
||||
@include btn-shadow($success);
|
||||
color: $white;
|
||||
|
||||
&:not([disabled]):not(.disabled):hover,
|
||||
&:not([disabled]):not(.disabled):focus,
|
||||
&:not([disabled]):not(.disabled):active,
|
||||
&:not([disabled]):not(.disabled).active {
|
||||
@include btn-shadow-inverse($success);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-info {
|
||||
@include btn-shadow($info);
|
||||
color: $white;
|
||||
|
||||
&:not([disabled]):not(.disabled):hover,
|
||||
&:not([disabled]):not(.disabled):focus,
|
||||
&:not([disabled]):not(.disabled):active,
|
||||
&:not([disabled]):not(.disabled).active {
|
||||
@include btn-shadow-inverse($info);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-warning {
|
||||
@include btn-shadow($warning);
|
||||
color: $white;
|
||||
|
||||
&:not([disabled]):not(.disabled):hover,
|
||||
&:not([disabled]):not(.disabled):focus,
|
||||
&:not([disabled]):not(.disabled):active,
|
||||
&:not([disabled]):not(.disabled).active {
|
||||
@include btn-shadow-inverse($warning);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
@include btn-shadow($danger);
|
||||
|
||||
&:not([disabled]):not(.disabled):hover,
|
||||
&:not([disabled]):not(.disabled):focus,
|
||||
&:not([disabled]):not(.disabled):active,
|
||||
&:not([disabled]):not(.disabled).active {
|
||||
@include btn-shadow-inverse($danger);
|
||||
&:not([disabled]):not(.disabled):active:hover,
|
||||
&:not([disabled]):not(.disabled).active:hover {
|
||||
@include btn-shadow-inverse-dark($value);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -217,6 +164,12 @@
|
|||
}
|
||||
}
|
||||
|
||||
.btn-check:checked + .btn,
|
||||
.btn-check + .btn:hover {
|
||||
color: $white;
|
||||
border-color: rgba(0, 0, 0, .6);
|
||||
}
|
||||
|
||||
// Typography
|
||||
|
||||
h1,
|
||||
|
|
@ -234,10 +187,6 @@ legend {
|
|||
color: $white;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
.input-group-addon {
|
||||
@include btn-shadow($secondary);
|
||||
color: $white;
|
||||
|
|
@ -350,7 +299,7 @@ legend {
|
|||
&,
|
||||
a:not(.btn),
|
||||
.alert-link {
|
||||
color: $body-bg;
|
||||
color: $dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -361,10 +310,30 @@ legend {
|
|||
}
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
--bs-tooltip-bg: var(--bs-tertiary-bg);
|
||||
--bs-tooltip-color: var(--bs-emphasis-color);
|
||||
}
|
||||
|
||||
// Containers
|
||||
|
||||
.list-group {
|
||||
&-item {
|
||||
color: $white;
|
||||
|
||||
&-light {
|
||||
color: $dark;
|
||||
}
|
||||
}
|
||||
|
||||
&-item-action:hover {
|
||||
background-color: shade-color($gray-900, 10%);
|
||||
}
|
||||
|
||||
@each $color, $value in $theme-colors {
|
||||
&-item-#{$color} {
|
||||
background-color: $value;
|
||||
border-color: $list-group-border-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Slate 5.2.2
|
||||
// Slate 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "slate" !default;
|
||||
|
|
@ -39,6 +39,8 @@ $danger: $red !default;
|
|||
$light: $gray-200 !default;
|
||||
$dark: $gray-900 !default;
|
||||
|
||||
$primary-bg-subtle: lighten($gray-800, 10%) !default;
|
||||
|
||||
$min-contrast-ratio: 1.95 !default;
|
||||
|
||||
// Body
|
||||
|
|
@ -61,7 +63,7 @@ $table-border-color: rgba($black, .6) !default;
|
|||
$table-dark-border-color: $table-border-color !default;
|
||||
$table-dark-color: $white !default;
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Buttons
|
||||
|
||||
|
|
@ -70,13 +72,23 @@ $input-btn-padding-x: 1rem !default;
|
|||
|
||||
// Forms
|
||||
|
||||
$input-bg: $white !default;
|
||||
$input-disabled-bg: #ccc !default;
|
||||
|
||||
$input-bg: $white !default;
|
||||
$input-color: $gray-900 !default;
|
||||
$input-border-color: rgba($black, .6) !default;
|
||||
$input-group-addon-color: $gray-500 !default;
|
||||
$input-group-addon-bg: $gray-700 !default;
|
||||
$input-disabled-color: $gray-600 !default;
|
||||
$input-disabled-bg: #ccc !default;
|
||||
|
||||
$form-check-input-bg: $white !default;
|
||||
|
||||
$form-select-disabled-bg: $input-disabled-bg !default;
|
||||
$form-select-disabled-color: $input-disabled-color !default;
|
||||
|
||||
$form-file-button-color: $input-group-addon-color !default;
|
||||
$form-file-button-bg: $input-group-addon-bg !default;
|
||||
$form-file-button-hover-bg: darken($form-file-button-bg, 5%) !default;
|
||||
|
||||
// Dropdowns
|
||||
|
||||
$dropdown-bg: $gray-800 !default;
|
||||
|
|
@ -98,12 +110,10 @@ $nav-tabs-link-active-border-color: $nav-tabs-border-color !default;
|
|||
// Navbar
|
||||
|
||||
$navbar-padding-y: 0 !default;
|
||||
$navbar-dark-hover-color: $white !default;
|
||||
$navbar-light-hover-color: $gray-800 !default;
|
||||
$navbar-light-active-color: $gray-800 !default;
|
||||
|
||||
|
||||
// Pagination
|
||||
$pagination-padding-y: $input-btn-padding-y !default;
|
||||
$pagination-padding-x: $input-btn-padding-x !default;
|
||||
|
||||
$pagination-color: $white !default;
|
||||
$pagination-bg: transparent !default;
|
||||
|
|
@ -122,6 +132,12 @@ $card-border-color: rgba($black, .6) !default;
|
|||
$card-cap-bg: lighten($gray-800, 10%) !default;
|
||||
$card-bg: lighten($body-bg, 5%) !default;
|
||||
|
||||
// Accordions
|
||||
|
||||
$accordion-bg: lighten($body-bg, 5%) !default;
|
||||
$accordion-border-color: $table-border-color !default;
|
||||
$accordion-button-active-color: $white !default;
|
||||
|
||||
// Popovers
|
||||
|
||||
$popover-bg: lighten($body-bg, 5%) !default;
|
||||
|
|
@ -149,6 +165,7 @@ $progress-bar-color: $gray-600 !default;
|
|||
$list-group-color: $white !default;
|
||||
$list-group-bg: lighten($body-bg, 5%) !default;
|
||||
$list-group-border-color: rgba($black, .6) !default;
|
||||
$list-group-item-bg-scale: 0% !default;
|
||||
$list-group-hover-bg: lighten($body-bg, 10%) !default;
|
||||
$list-group-active-color: $white !default;
|
||||
$list-group-active-bg: $list-group-hover-bg !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Solar 5.2.2
|
||||
// Solar 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: dark;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Buttons
|
||||
|
|
@ -58,9 +54,13 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@4
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
.badge {
|
||||
&.bg-light {
|
||||
color: $dark;
|
||||
}
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
--bs-tooltip-bg: var(--bs-tertiary-bg);
|
||||
--bs-tooltip-color: var(--bs-emphasis-color);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Solar 5.2.2
|
||||
// Solar 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "solar" !default;
|
||||
|
|
@ -59,10 +59,11 @@ $component-active-bg: $gray-800 !default;
|
|||
|
||||
// Fonts
|
||||
|
||||
$font-family-sans-serif: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default !default;
|
||||
$font-family-sans-serif: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default;
|
||||
|
||||
// Tables
|
||||
|
||||
$table-color: $white !default;
|
||||
$table-accent-bg: rgba($white, .05) !default;
|
||||
$table-hover-bg: rgba($white, .075) !default;
|
||||
$table-border-color: $component-active-bg !default;
|
||||
|
|
@ -70,12 +71,13 @@ $table-dark-bg: $gray-500 !default;
|
|||
$table-dark-border-color: darken($gray-500, 3%) !default;
|
||||
$table-dark-color: $body-bg !default;
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Forms
|
||||
|
||||
$input-bg: #a9bdbd !default;
|
||||
$input-disabled-bg: #657b83 !default;
|
||||
$input-bg: $gray-500 !default;
|
||||
$input-disabled-color: $gray-100 !default;
|
||||
$input-disabled-bg: $gray-600 !default;
|
||||
|
||||
$input-color: $gray-800 !default;
|
||||
$input-border-color: rgba($black, .15) !default;
|
||||
|
|
@ -83,6 +85,9 @@ $input-placeholder-color: #657b83 !default;
|
|||
$input-group-addon-color: $gray-600 !default;
|
||||
$input-group-addon-bg: $gray-800 !default;
|
||||
|
||||
$form-select-disabled-color: $gray-700 !default;
|
||||
$form-select-disabled-bg: $input-disabled-bg !default;
|
||||
|
||||
$form-check-input-bg: rgba(255, 255, 255, .75) !default;
|
||||
$form-check-input-border: 1px solid $white !default;
|
||||
$form-check-input-checked-bg-color: $primary !default;
|
||||
|
|
@ -113,9 +118,6 @@ $nav-tabs-link-active-border-color: $nav-tabs-border-color !default;
|
|||
|
||||
// Navbars
|
||||
|
||||
$navbar-light-color: rgba($black, .4) !default !default;
|
||||
$navbar-light-active-color: rgba($black, .7) !default !default;
|
||||
|
||||
// Pagination
|
||||
|
||||
$pagination-bg: transparent !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Spacelab 5.2.2
|
||||
// Spacelab 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Mixins
|
||||
|
|
@ -26,7 +22,7 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,
|
|||
.navbar {
|
||||
.nav-link,
|
||||
.navbar-brand {
|
||||
text-shadow: -1px -1px 0 rgba(0, 0, 0, .1);
|
||||
text-shadow: -1px -1px 0 rgba(0, 0, 0, .05);
|
||||
transition: color ease-in-out .2s;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Spacelab 5.2.2
|
||||
// Spacelab 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "spacelab" !default;
|
||||
|
|
@ -57,8 +57,5 @@ $headings-color: $gray-900 !default;
|
|||
|
||||
// Navbar
|
||||
|
||||
$navbar-dark-color: rgba($white, .75) !default;
|
||||
$navbar-dark-hover-color: $white !default;
|
||||
$navbar-light-color: rgba($black, .4) !default;
|
||||
$navbar-light-hover-color: $info !default;
|
||||
$navbar-light-active-color: $info !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Superhero 5.2.2
|
||||
// Superhero 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: dark;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Buttons
|
||||
|
|
@ -73,12 +69,10 @@ label,
|
|||
font-size: $font-size-sm;
|
||||
}
|
||||
|
||||
.form-control{
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
.form-floating {
|
||||
label {
|
||||
> label,
|
||||
> .form-control:focus ~ label,
|
||||
> .form-control:not(:placeholder-shown) ~ label {
|
||||
color: $input-placeholder-color;
|
||||
}
|
||||
}
|
||||
|
|
@ -133,6 +127,11 @@ label,
|
|||
}
|
||||
}
|
||||
|
||||
.tooltip {
|
||||
--bs-tooltip-bg: var(--bs-tertiary-bg);
|
||||
--bs-tooltip-color: var(--bs-emphasis-color);
|
||||
}
|
||||
|
||||
// Popovers
|
||||
|
||||
.popover-header {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Superhero 5.2.2
|
||||
// Superhero 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "superhero" !default;
|
||||
|
|
@ -9,11 +9,11 @@ $theme: "superhero" !default;
|
|||
|
||||
$white: #fff !default;
|
||||
$gray-100: #ebebeb !default;
|
||||
$gray-200: #4e5d6c !default;
|
||||
$gray-300: #dee2e6 !default;
|
||||
$gray-400: #ced4da !default;
|
||||
$gray-500: #adb5bd !default;
|
||||
$gray-600: #868e96 !default;
|
||||
$gray-200: #dee2e6 !default;
|
||||
$gray-300: #ced4da !default;
|
||||
$gray-400: #adb5bd !default;
|
||||
$gray-500: #868e96 !default;
|
||||
$gray-600: #4e5d6c !default;
|
||||
$gray-700: #495057 !default;
|
||||
$gray-800: #343a40 !default;
|
||||
$gray-900: #212529 !default;
|
||||
|
|
@ -24,19 +24,19 @@ $indigo: #6610f2 !default;
|
|||
$purple: #6f42c1 !default;
|
||||
$pink: #e83e8c !default;
|
||||
$red: #d9534f !default;
|
||||
$orange: #f0ad4e !default;
|
||||
$orange: #df6919 !default;
|
||||
$yellow: #ffc107 !default;
|
||||
$green: #5cb85c !default;
|
||||
$teal: #20c997 !default;
|
||||
$cyan: #5bc0de !default;
|
||||
|
||||
$primary: $blue !default;
|
||||
$secondary: $gray-200 !default;
|
||||
$primary: $orange !default;
|
||||
$secondary: $gray-600 !default;
|
||||
$success: $green !default;
|
||||
$info: $cyan !default;
|
||||
$warning: $yellow !default;
|
||||
$danger: $red !default;
|
||||
$light: lighten($gray-200, 35%) !default;
|
||||
$light: lighten($gray-600, 35%) !default;
|
||||
$dark: #20374c !default;
|
||||
|
||||
$min-contrast-ratio: 1.6 !default;
|
||||
|
|
@ -46,6 +46,7 @@ $min-contrast-ratio: 1.6 !default;
|
|||
$body-bg: #0f2537 !default;
|
||||
$body-color: $gray-100 !default;
|
||||
|
||||
|
||||
// Components
|
||||
|
||||
$border-radius: 0 !default;
|
||||
|
|
@ -61,50 +62,60 @@ $text-muted: rgba(255, 255, 255, .4) !default;
|
|||
|
||||
// Tables
|
||||
|
||||
$table-color: $white !default;
|
||||
$table-accent-bg: rgba($white, .05) !default;
|
||||
$table-hover-bg: rgba($white, .075) !default;
|
||||
$table-border-color: rgba($black, .15) !default;
|
||||
$table-head-bg: $light !default;
|
||||
$table-dark-bg: $light !default;
|
||||
$table-dark-border-color: $gray-200 !default;
|
||||
$table-dark-border-color: $gray-600 !default;
|
||||
$table-dark-color: $body-bg !default;
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Forms
|
||||
|
||||
$input-bg: $white !default;
|
||||
$input-disabled-color: $gray-600 !default;
|
||||
$input-disabled-bg: $gray-100 !default;
|
||||
|
||||
$input-color: $gray-900 !default;
|
||||
$input-border-color: transparent !default;
|
||||
$input-border-width: 0 !default;
|
||||
|
||||
$input-placeholder-color: $gray-600 !default;
|
||||
$input-placeholder-color: $gray-500 !default;
|
||||
|
||||
$input-group-addon-color: $body-color !default;
|
||||
$input-group-addon-bg: $gray-600 !default;
|
||||
|
||||
$form-select-disabled-bg: $input-disabled-bg !default;
|
||||
$form-select-disabled-color: $input-disabled-color !default;
|
||||
|
||||
$form-check-input-bg: $white !default;
|
||||
$form-check-input-border: none !default;
|
||||
|
||||
$form-file-button-color: $body-color !default;
|
||||
$form-file-button-color: $input-group-addon-color !default;
|
||||
$form-file-button-bg: $input-group-addon-bg !default;
|
||||
$form-file-button-hover-bg: darken($form-file-button-bg, 5%) !default;
|
||||
|
||||
$form-floating-label-opacity: 1 !default;
|
||||
|
||||
// Dropdowns
|
||||
|
||||
$dropdown-bg: $gray-200 !default;
|
||||
$dropdown-bg: $gray-600 !default;
|
||||
$dropdown-divider-bg: rgba($black, .15) !default;
|
||||
$dropdown-link-color: $body-color !default;
|
||||
$dropdown-link-hover-color: $dropdown-link-color !default;
|
||||
$dropdown-link-hover-bg: $table-hover-bg !default;
|
||||
|
||||
$dropdown-header-color: $gray-500 !default;
|
||||
|
||||
// Navs
|
||||
|
||||
$nav-link-disabled-color: rgba(255, 255, 255, .4) !default;
|
||||
$nav-tabs-border-color: $gray-200 !default;
|
||||
$nav-tabs-border-color: $gray-600 !default;
|
||||
$nav-tabs-link-hover-border-color: $nav-tabs-border-color !default;
|
||||
$nav-tabs-link-active-color: $body-color !default;
|
||||
$nav-tabs-link-active-border-color: $gray-200 !default;
|
||||
$nav-tabs-link-active-border-color: $gray-600 !default;
|
||||
|
||||
// Navbar
|
||||
|
||||
|
|
@ -114,7 +125,7 @@ $navbar-dark-hover-color: $white !default;
|
|||
// Pagination
|
||||
|
||||
$pagination-color: $white !default;
|
||||
$pagination-bg: $gray-200 !default;
|
||||
$pagination-bg: $gray-600 !default;
|
||||
$pagination-border-color: transparent !default;
|
||||
$pagination-hover-color: $white !default;
|
||||
$pagination-hover-bg: $nav-link-disabled-color !default;
|
||||
|
|
@ -126,17 +137,26 @@ $pagination-disabled-border-color: $pagination-border-color !default;
|
|||
// Cards
|
||||
|
||||
$card-cap-bg: $table-hover-bg !default;
|
||||
$card-bg: $gray-200 !default;
|
||||
$card-bg: $gray-600 !default;
|
||||
$card-inner-border-radius: 0 !default;
|
||||
|
||||
// Accordion
|
||||
|
||||
$accordion-bg: $card-bg !default;
|
||||
$accordion-border-width: 0 !default;
|
||||
$accordion-button-bg: $card-cap-bg !default;
|
||||
$accordion-button-active-bg: $primary !default;
|
||||
$accordion-button-active-color: $body-color !default;
|
||||
|
||||
|
||||
// Popovers
|
||||
|
||||
$popover-bg: $gray-200 !default;
|
||||
$popover-bg: $gray-600 !default;
|
||||
$popover-header-bg: $table-hover-bg !default;
|
||||
|
||||
// Toasts
|
||||
|
||||
$toast-background-color: $gray-200 !default;
|
||||
$toast-background-color: $gray-600 !default;
|
||||
$toast-border-color: rgba(0, 0, 0, .2) !default;
|
||||
$toast-header-color: $body-color !default;
|
||||
$toast-header-background-color: $toast-background-color !default;
|
||||
|
|
@ -144,13 +164,17 @@ $toast-header-border-color: $toast-border-color !default;
|
|||
|
||||
// Modals
|
||||
|
||||
$modal-content-bg: $gray-200 !default;
|
||||
$modal-content-bg: $gray-600 !default;
|
||||
$modal-header-border-color: rgba(0, 0, 0, .2) !default;
|
||||
|
||||
// Progress bars
|
||||
|
||||
$progress-bg: $gray-600 !default;
|
||||
|
||||
// List group
|
||||
|
||||
$list-group-color: $white !default;
|
||||
$list-group-bg: $gray-200 !default;
|
||||
$list-group-bg: $gray-600 !default;
|
||||
$list-group-border-color: transparent !default;
|
||||
$list-group-hover-bg: $nav-link-disabled-color !default;
|
||||
$list-group-disabled-color: $nav-link-disabled-color !default;
|
||||
|
|
@ -161,7 +185,7 @@ $list-group-action-hover-color: $white !default;
|
|||
|
||||
$breadcrumb-padding-y: .375rem !default;
|
||||
$breadcrumb-padding-x: .75rem !default;
|
||||
$breadcrumb-bg: $gray-200 !default;
|
||||
$breadcrumb-bg: $gray-600 !default;
|
||||
$breadcrumb-divider-color: $body-color !default;
|
||||
$breadcrumb-active-color: $body-color !default;
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// United 5.2.2
|
||||
// United 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Ubuntu:wght@400;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Indicators
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// United 5.2.2
|
||||
// United 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "united" !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Vapor 5.2.2
|
||||
// Vapor 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,15 +6,11 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
$outrun: false !default;
|
||||
|
||||
:root {
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
// Mixins
|
||||
|
||||
@mixin text-shadow($color) {
|
||||
|
|
@ -53,6 +49,7 @@ $outrun: false !default;
|
|||
// Body
|
||||
|
||||
body {
|
||||
min-height: 100vh;
|
||||
background-image: linear-gradient(shade-color($body-bg, 10%) 0%, $body-bg 7%, $body-bg 80%, shade-color(#173e98, 50%) 100%);
|
||||
@include text-shadow-sm($body-color);
|
||||
|
||||
|
|
@ -165,27 +162,27 @@ table,
|
|||
@include box-shadow($value);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-dark {
|
||||
&,
|
||||
a {
|
||||
@include text-shadow-sm($navbar-dark-color);
|
||||
&[data-bs-theme="dark"] {
|
||||
&,
|
||||
a {
|
||||
@include text-shadow-sm($white);
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
@include text-shadow($white);
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
@include text-shadow($navbar-dark-color);
|
||||
}
|
||||
}
|
||||
&[data-bs-theme="light"] {
|
||||
&,
|
||||
a {
|
||||
@include text-shadow-sm($black);
|
||||
}
|
||||
|
||||
.navbar-light {
|
||||
&,
|
||||
a {
|
||||
@include text-shadow-sm($navbar-light-color);
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
@include text-shadow($navbar-light-color);
|
||||
.navbar-brand {
|
||||
@include text-shadow($black);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -276,6 +273,8 @@ legend {
|
|||
}
|
||||
|
||||
.tooltip {
|
||||
--bs-tooltip-bg: var(--bs-body-bg);
|
||||
--bs-tooltip-color: var(--bs-body-color);
|
||||
|
||||
&-inner,
|
||||
.arrow {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Vapor 5.2.2
|
||||
// Vapor 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "vapor" !default;
|
||||
|
|
@ -76,11 +76,12 @@ $blockquote-footer-color: $text-muted !default;
|
|||
|
||||
$table-color: $white !default;
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Forms
|
||||
|
||||
$input-bg: lighten($body-bg, 10%) !default;
|
||||
$input-disabled-color: $gray-500 !default;
|
||||
$input-disabled-bg: lighten($body-bg, 5%) !default;
|
||||
|
||||
$input-color: $white !default;
|
||||
|
|
@ -89,6 +90,12 @@ $input-placeholder-color: rgba($white, .4) !default;
|
|||
|
||||
$input-group-addon-bg: $input-disabled-bg !default;
|
||||
|
||||
$form-select-disabled-color: $input-placeholder-color !default;
|
||||
$form-select-disabled-bg: $input-disabled-bg !default;
|
||||
|
||||
$form-file-button-bg: $input-group-addon-bg !default;
|
||||
$form-file-button-hover-bg: darken($form-file-button-bg, 2%) !default;
|
||||
|
||||
$form-range-track-bg: $input-bg !default;
|
||||
|
||||
$form-range-thumb-disabled-bg: $purple !default;
|
||||
|
|
@ -99,6 +106,10 @@ $nav-link-disabled-color: $text-muted !default;
|
|||
|
||||
$nav-tabs-link-active-color: $component-active-bg !default;
|
||||
|
||||
// Dropdowns
|
||||
|
||||
$dropdown-link-hover-bg: rgba($white, .15) !default;
|
||||
|
||||
// Pagination
|
||||
|
||||
$pagination-bg: transparent !default;
|
||||
|
|
@ -118,7 +129,6 @@ $card-color: $white !default;
|
|||
|
||||
// Tooltips
|
||||
|
||||
$tooltip-bg: $dark !default;
|
||||
$tooltip-opacity: 1 !default;
|
||||
|
||||
// Popovers
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Yeti 5.2.2
|
||||
// Yeti 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Navbar
|
||||
|
|
@ -114,7 +110,7 @@ $web-font-path: "https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,
|
|||
}
|
||||
|
||||
.btn-outline-secondary {
|
||||
color: $black;
|
||||
color: var(--bs-primary-color);
|
||||
}
|
||||
|
||||
.btn-group {
|
||||
|
|
@ -245,22 +241,6 @@ label,
|
|||
font-weight: 300;
|
||||
}
|
||||
|
||||
.nav-tabs {
|
||||
.nav-link,
|
||||
.nav-link.disabled,
|
||||
.nav-link.disabled:hover,
|
||||
.nav-link.disabled:focus {
|
||||
background-color: $gray-200;
|
||||
border-color: $nav-tabs-border-color;
|
||||
}
|
||||
|
||||
.nav-item + .nav-item {
|
||||
.nav-link {
|
||||
border-left: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav-pills {
|
||||
.active {
|
||||
border: 1px solid shade-color($primary, 10%);
|
||||
|
|
@ -307,35 +287,31 @@ label,
|
|||
}
|
||||
}
|
||||
|
||||
@include color-mode(dark) {
|
||||
.pagination {
|
||||
--bs-pagination-disabled-color: #{$gray-700};
|
||||
}
|
||||
}
|
||||
|
||||
.list-group {
|
||||
font-size: $font-size-sm;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
.list-group-item.disabled,
|
||||
.list-group-item:disabled {
|
||||
background-color: var(--bs-secondary-bg);
|
||||
}
|
||||
|
||||
// Indicators
|
||||
|
||||
.alert {
|
||||
font-size: $font-size-sm;
|
||||
font-weight: 300;
|
||||
color: $white;
|
||||
|
||||
.alert-link {
|
||||
color: $white;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
&:not(.alert-secondary):not(.alert-light) .btn-close {
|
||||
background-image: escape-svg(url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$white}'><path d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/></svg>"));
|
||||
}
|
||||
|
||||
&-secondary,
|
||||
&-light {
|
||||
&,
|
||||
a:not(.btn),
|
||||
.alert-link {
|
||||
color: $body-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.badge {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Yeti 5.2.2
|
||||
// Yeti 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "yeti" !default;
|
||||
|
|
@ -37,7 +37,7 @@ $info: $cyan !default;
|
|||
$warning: $yellow !default;
|
||||
$danger: $red !default;
|
||||
$light: $gray-200 !default;
|
||||
$dark: $gray-900 !default;
|
||||
$dark: $gray-800 !default;
|
||||
|
||||
$min-contrast-ratio: 1.9 !default;
|
||||
|
||||
|
|
@ -55,7 +55,7 @@ $headings-font-weight: 300 !default;
|
|||
|
||||
// Tables
|
||||
|
||||
$table-bg-scale: 0 !default;
|
||||
$table-bg-scale: 0% !default;
|
||||
|
||||
// Buttons
|
||||
|
||||
|
|
@ -67,13 +67,6 @@ $btn-font-weight: 300 !default;
|
|||
$dropdown-border-color: rgba($black, .1) !default;
|
||||
$dropdown-divider-bg: rgba($black, .1) !default;
|
||||
|
||||
// Navs
|
||||
|
||||
$nav-link-disabled-color: $gray-400 !default;
|
||||
$nav-tabs-border-color: $dropdown-border-color !default;
|
||||
$nav-tabs-link-hover-border-color: $nav-tabs-border-color !default;
|
||||
$nav-tabs-link-active-border-color: $nav-tabs-border-color !default;
|
||||
|
||||
// Navbar
|
||||
|
||||
$navbar-dark-color: rgba($white, .7) !default;
|
||||
|
|
@ -82,9 +75,10 @@ $navbar-dark-hover-color: $white !default;
|
|||
// Pagination
|
||||
|
||||
$pagination-color: $gray-600 !default;
|
||||
$pagination-border-color: $nav-tabs-border-color !default;
|
||||
// $pagination-border-color: $nav-tabs-border-color !default;
|
||||
$pagination-active-border-color: darken($primary, 5%) !default;
|
||||
$pagination-disabled-color: $gray-200 !default;
|
||||
$pagination-disabled-bg: transparent !default;
|
||||
$pagination-disabled-color: $gray-400 !default;
|
||||
|
||||
// Cards
|
||||
|
||||
|
|
@ -99,17 +93,6 @@ $badge-padding-x: 1rem !default;
|
|||
|
||||
$alert-link-font-weight: 400 !default;
|
||||
|
||||
$alert-bg-scale: 0 !default;
|
||||
|
||||
// Progress bars
|
||||
|
||||
$progress-bg: $gray-400 !default;
|
||||
$progress-bar-color: $white !default;
|
||||
|
||||
// List group
|
||||
|
||||
$list-group-disabled-bg: $gray-200 !default;
|
||||
|
||||
// Breadcrumbs
|
||||
|
||||
$breadcrumb-padding-y: .375rem !default;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Zephyr 5.2.2
|
||||
// Zephyr 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
|
||||
|
|
@ -6,11 +6,7 @@
|
|||
|
||||
$web-font-path: "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&display=swap" !default;
|
||||
@if $web-font-path {
|
||||
@import url($web-font-path);
|
||||
}
|
||||
|
||||
:root {
|
||||
color-scheme: light;
|
||||
@import url("#{$web-font-path}");
|
||||
}
|
||||
|
||||
// Navbar
|
||||
|
|
@ -150,7 +146,7 @@ thead th {
|
|||
.breadcrumb {
|
||||
font-size: $font-size-sm;
|
||||
font-weight: 500;
|
||||
border: 1px solid $gray-300;
|
||||
border: 1px solid var(--bs-secondary-bg);
|
||||
border-radius: $border-radius;
|
||||
box-shadow: $box-shadow;
|
||||
|
||||
|
|
@ -207,7 +203,7 @@ thead th {
|
|||
}
|
||||
|
||||
.modal-footer {
|
||||
background-color: $gray-100;
|
||||
background-color: var(--bs-tertiary-bg);
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Zephyr 5.2.2
|
||||
// Zephyr 5.3.3
|
||||
// Bootswatch
|
||||
|
||||
$theme: "zephyr" !default;
|
||||
|
|
@ -47,7 +47,7 @@ $enable-shadows: true !default;
|
|||
|
||||
$body-color: $gray-700 !default;
|
||||
|
||||
$headings-color: $gray-900 !default;
|
||||
$headings-color: var(--bs-primary-color) !default;
|
||||
|
||||
// Fonts
|
||||
|
||||
|
|
@ -89,8 +89,6 @@ $form-label-font-weight: 500 !default;
|
|||
|
||||
$input-box-shadow: $box-shadow !default;
|
||||
|
||||
$input-group-addon-bg: $gray-100 !default;
|
||||
|
||||
// Navs
|
||||
|
||||
$nav-link-color: $body-color !default;
|
||||
|
|
@ -105,14 +103,6 @@ $navbar-padding-y: .85rem !default;
|
|||
|
||||
$navbar-nav-link-padding-x: .75rem !default;
|
||||
|
||||
$navbar-dark-color: $white !default;
|
||||
$navbar-dark-hover-color: $white !default;
|
||||
$navbar-dark-active-color: $white !default;
|
||||
|
||||
$navbar-light-color: $black !default;
|
||||
$navbar-light-hover-color: $black !default;
|
||||
$navbar-light-active-color: $black !default;
|
||||
|
||||
// Dropdowns
|
||||
|
||||
$dropdown-font-size: $font-size-sm !default;
|
||||
|
|
@ -130,12 +120,15 @@ $dropdown-item-padding-x: 1rem !default;
|
|||
$pagination-padding-y: .5rem !default;
|
||||
$pagination-padding-x: 1rem !default;
|
||||
|
||||
$pagination-color: $gray-700 !default;
|
||||
$pagination-color: var(--bs-primary-bg) !default;
|
||||
|
||||
$pagination-focus-color: $pagination-color !default;
|
||||
|
||||
$pagination-hover-color: $pagination-color !default;
|
||||
$pagination-hover-bg: $gray-100 !default;
|
||||
$pagination-hover-bg: var(--bs-secondary-bg) !default;
|
||||
|
||||
$pagination-disabled-color: var(--bs-tertiary-color) !default;
|
||||
$pagination-disabled-bg: var(--bs-tertiary-bg) !default;
|
||||
|
||||
// Cards
|
||||
$card-spacer-x: 1.5rem !default;
|
||||
|
|
@ -148,7 +141,6 @@ $toast-header-color: $headings-color !default;
|
|||
|
||||
// Modals
|
||||
|
||||
$modal-content-border-color: $gray-300 !default;
|
||||
$modal-header-border-width: 0 !default;
|
||||
|
||||
// List group
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue