⬆️ Update Slate

chaosdorf · Oct 20, 2023 · 6df9070 · 6df9070
1 parent ced156a
commit 6df9070
Show file tree

Hide file tree

Showing 2 changed files with 65 additions and 98 deletions.
diff --git a/app/assets/stylesheets/bootswatch/slate/_bootswatch.scss b/app/assets/stylesheets/bootswatch/slate/_bootswatch.scss
@@ -1,13 +1,9 @@
-// Slate 5.2.2
+// Slate 5.3.2
 // Bootswatch
 
 
 // Variables
 
-:root {
-  color-scheme: dark;
-}
-
 // Mixins
 
 @mixin btn-shadow($color) {
@@ -16,14 +12,19 @@
 }
 
 @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;
 }
 
 // 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,15 +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 {
+      .nav-link {
+        &:hover {
+          @include btn-shadow-inverse($value);
+          border-left: 1px solid rgba(0, 0, 0, .2);
+        }
 
-      &:hover,
-      &:focus {
-        @include btn-shadow-inverse($gray-600);
-        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);
+        }
       }
     }
   }
@@ -132,74 +132,20 @@
   &:not([disabled]):not(.disabled).active:hover {
     border-color: rgba(0, 0, 0, .6);
   }
-}
-
-.btn-primary {
-  @include btn-shadow($primary);
-
-  &: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);
-  }
-}
-
-.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);
-  }
-}
+  @each $color, $value in $theme-colors {
+    &-#{$color} {
+      @include btn-shadow($value);
 
-.btn-danger {
-  @include btn-shadow($danger);
+      &:not([disabled]):not(.disabled):hover {
+        @include btn-shadow-inverse($value);
+      }
 
-  &: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);
+      }
+    }
   }
 }
 
@@ -221,6 +167,12 @@
   }
 }
 
+.btn-check:checked+.btn,
+.btn-check+.btn:hover {
+  color: $white;
+  border-color: rgba(0, 0, 0, .6);
+}
+
 // Typography
 
 h1,
@@ -238,10 +190,6 @@ legend {
   color: $white;
 }
 
-.form-control {
-  color-scheme: light;
-}
-
 .input-group-addon {
   @include btn-shadow($secondary);
   color: $white;
@@ -344,8 +292,7 @@ legend {
     text-decoration: underline;
   }
 
-  @each $color,
-  $value in $theme-colors {
+  @each $color, $value in $theme-colors {
     &-#{$color} {
       background-color: $value;
     }
@@ -356,7 +303,7 @@ legend {
     &,
     a:not(.btn),
     .alert-link {
-      color: $body-bg;
+      color: $dark;
     }
   }
 }
@@ -367,9 +314,22 @@ 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%);
   }

diff --git a/app/assets/stylesheets/bootswatch/slate/_variables.scss b/app/assets/stylesheets/bootswatch/slate/_variables.scss
@@ -1,4 +1,4 @@
-// Slate 5.2.2
+// Slate 5.3.2
 // Bootswatch
 
 $theme: "slate" !default;
@@ -71,12 +71,22 @@ $input-btn-padding-x: 1rem !default;
 // Forms
 
 $input-bg: $white !default;
-$input-disabled-bg: #ccc !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,10 +108,6 @@ $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
 
@@ -149,6 +155,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;