bootstrap 4.5 & Bootswatch Themes

dev/scss/wvc-theme/spacelab/_bootswatch.scss

@@ -0,0 +1,102 @@
+// Spacelab 4.5.0
+// Bootswatch
+
+
+// Variables ===================================================================
+
+$web-font-path: "https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700&display=swap" !default;
+@import url($web-font-path);
+
+@mixin btn-shadow($color){
+  @include gradient-y-three-colors(lighten($color, 15%), $color, 50%, darken($color, 4%));
+  filter: none;
+  border: 1px solid darken($color, 10%);
+}
+
+// Navbar ======================================================================
+
+.navbar {
+
+  .nav-link,
+  .navbar-brand {
+    text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.1);
+    transition: color ease-in-out .2s;
+  }
+
+  &.bg-primary {
+    @include btn-shadow(map-get($theme-colors, "primary"));
+  }
+
+  &.bg-dark {
+    @include btn-shadow(map-get($theme-colors, "secondary"));
+  }
+
+  &.bg-light {
+    @include btn-shadow(map-get($theme-colors, "light"));
+
+    .nav-link,
+    .navbar-brand {
+      text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.1);
+    }
+
+    .navbar-brand {
+      color: $navbar-light-color;
+
+      &:hover {
+        color: $info;
+      }
+    }
+  }
+}
+
+// Buttons =====================================================================
+
+.btn {
+  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.1);
+
+  &-link {
+    text-shadow: none;
+  }
+}
+
+@each $color, $value in $theme-colors {
+  .btn-#{$color} {
+    @include btn-shadow($value);
+  }
+
+  .btn-#{$color}:not(.disabled):hover {
+    @include btn-shadow(darken($value, 4%));
+  }
+}
+
+[class*="btn-outline-"] {
+  text-shadow: none;
+}
+
+// Typography ==================================================================
+
+// Tables ======================================================================
+
+// Forms =======================================================================
+
+// Navs ========================================================================
+
+// Indicators ==================================================================
+
+.badge {
+
+  &-secondary {
+    color: $white;
+  }
+}
+
+// Progress bars ===============================================================
+
+// Containers ==================================================================
+
+.card,
+.list-group-item {
+  h1, h2, h3, h4, h5, h6 {
+    color: inherit;
+  }
+}