blue-web 1.14.3 → 1.15.1

package/dist/merged.scss

@@ -1,5 +1,5 @@
 /*!
- * Blue Web v1.14.3 (https://bruegmann.github.io/blue-web)
+ * Blue Web v1.15.1 (https://bruegmann.github.io/blue-web)
  * Licensed under GNU General Public License v3.0 (https://github.com/bruegmann/blue-web/blob/master/LICENSE).
 */
 
@@ -33,9 +33,9 @@ $h4-font-size: $font-size-base * 1.125 !default;
 $h5-font-size: $font-size-base * 1.1 !default;
 $h6-font-size: $font-size-base !default;
 
-$border-radius: 0.5rem !default;
-$border-radius-lg: 0.7rem !default;
-$border-radius-sm: 0.3rem !default;
+$border-radius: 0.7rem !default;
+$border-radius-lg: 1rem !default;
+$border-radius-sm: 0.5rem !default;
 
 $custom-checkbox-indicator-border-radius: $border-radius-sm !default;
 
@@ -47,6 +47,8 @@ $link-hover-decoration: underline !default;
 $focus-ring-color: #{rgba(var(--bs-primary-rgb), 25%)} !default;
 $input-focus-border-color: #{rgba(var(--bs-primary-rgb), 50%)} !default;
 
+$enable-button-pointers: false !default;
+
 
 // Bootstrap functions
 //
@@ -10771,13 +10773,21 @@ $utilities: map-merge(
 // scss-docs-end import-stack
 
 
-// Per CSS-Variablen überschreibbar machen, da es von Bootstrap aus noch nicht möglich ist.
-// Bei neuer Bootstrap-Version prüfen, ob es noch nötig ist.
+// Make it overridable via CSS variables, as it is not yet possible in Bootstrap.
+// Check with a newer Bootstrap version to see if it is still necessary.
 .form-check-input:checked {
     background-color: var(--bs-primary, #{$form-check-input-checked-bg-color});
     border-color: var(--bs-primary, #{$form-check-input-checked-border-color});
 }
 
+// Resets cursor from Bootstrap' _reboot.scss based on option.
+@if ($enable-button-pointers: false) {
+    summary,
+    [role="button"] {
+        cursor: unset;
+    }
+}
+
 // In previous versions of Bootstrap, `.page-header` was a class that could be used to add a border to the bottom of a page header.
 // Unfortunately his class was removed in Bootstrap 5, so it's now part of Blue Web CSS.
 .blue-page-header,
@@ -11071,6 +11081,8 @@ body {
     }
 
     border: none;
+    box-shadow: none;
+    background-image: none;
 
     &:focus {
         box-shadow: none;
@@ -11288,77 +11300,40 @@ body {
 }
 
 .blue-header-title-image {
-    width: 2rem;
-    height: 2rem;
+    width: var(--blue-header-title-image-width, var(--blue-header-title-image-size, 2rem));
+    height: var(--blue-header-title-image-height, var(--blue-header-title-image-size, 2rem));
 }
 
-.blue-search {
-    display: flex;
-    align-items: center;
+.blue-input-group {
     border: $input-border-width solid $input-border-color;
     border-radius: $input-border-radius;
     background-color: $input-bg;
 
-    &.blue-search-body {
-        border: 1px solid $input-border-color;
+    &.focus,
+    &:has(input:focus) {
+        box-shadow: $input-btn-focus-box-shadow;
+        border-color: $input-focus-border-color;
 
-        .blue-search-input-group {
-            display: flex;
-        }
-
-        &.focus {
-            box-shadow: $input-btn-focus-box-shadow;
+        .input-group-text {
+            color: #{var(--bs-primary-text-emphasis)};
         }
     }
 
-    &.focus {
-        box-shadow: inset $input-btn-focus-box-shadow;
-    }
-}
-
-.blue-sidebar .blue-search:not(.blue-search-body) {
-    margin-left: map-get($spacers, 1);
-    margin-right: map-get($spacers, 1);
-}
-
-.blue-search-input-group {
-    display: none;
-
     .input-group-text {
         border-color: transparent;
         background-color: transparent;
     }
-}
-
-.blue-search-control {
-    border: none;
-    background-color: transparent !important;
-
-    &:focus {
-        box-shadow: none;
-    }
-}
-
-.blue-search-reset-btn {
-    color: rgba($input-color, 0.7);
-
-    &:hover {
-        color: $input-color;
-    }
-}
 
-.blue-search.blue-search-sidebar {
-    transition: opacity 0.2s ease-in-out;
+    .form-control {
+        border: none;
+        background-color: transparent !important;
 
-    @media (prefers-reduced-motion) {
-        transition: none;
+        &:focus {
+            box-shadow: none;
+        }
     }
 }
 
-.blue-search.blue-search-sidebar:not(:hover):not(.focus) {
-    opacity: 0.7;
-}
-
 .blue-actions {
     --max-width: calc(
         var(--bs-btn-border-width, 1px) + var(--bs-btn-padding-x, 0.75rem) + var(--bs-btn-font-size, 1rem) +
@@ -11750,6 +11725,11 @@ body {
     );
 
     .blue-btn-plain-#{$color} {
+        &:not(:hover) {
+            box-shadow: none;
+            background-image: none;
+        }
+
         @if $color == "light" {
             $text-color: color-contrast($value);
         }
@@ -11758,19 +11738,14 @@ body {
             transparent,
             transparent,
             $text-color,
-            $hover-background: shade-color($bg, $btn-hover-bg-shade-amount),
-            $hover-border: shade-color($bg, $btn-hover-border-shade-amount),
-            $active-background: $active-background,
-            $active-border:
-                if(
-                    $color == $color-contrast-light,
-                    shade-color($value, $btn-active-border-shade-amount),
-                    tint-color($value, $btn-active-border-tint-amount)
-                ),
-            $active-color: color-contrast($active-background),
-            $disabled-background: $value,
-            $disabled-border: $value,
-            $disabled-color: color-contrast($value)
+            $hover-background: tint-color($value, 80%),
+            $hover-border: tint-color($value, 80%),
+            $hover-color: if($color == "light", color-contrast($value), shade-color($value, 60%)),
+            $active-background: shade-color($bg, $btn-hover-bg-shade-amount),
+            $active-border: shade-color($bg, $btn-hover-border-shade-amount),
+            $disabled-background: transparent,
+            $disabled-border: transparent,
+            $disabled-color: $text-color
         );
     }
 }
@@ -11778,7 +11753,7 @@ body {
 @include color-mode(dark) {
     @each $color, $value in $theme-colors {
         $bg: shade-color($value, 80%);
-        $text-color: $value;
+        $text-color: tint-color($value, 40%);
 
         .blue-btn-plain-#{$color} {
             @if $color == "dark" {
@@ -11865,10 +11840,13 @@ body {
 
     position: relative;
     order: 0;
-    cursor: pointer;
     user-select: none;
     -webkit-appearance: none;
     appearance: none;
+
+    @if ($enable-button-pointers) {
+        cursor: pointer;
+    }
 }
 
 .blue-tab::before {
@@ -12311,6 +12289,10 @@ dialog.blue-modal:has(.offcanvas-start) {
     font-size: 1rem;
 }
 
+.dxbl-pager-page-edit {
+    min-width: 2.5em;
+}
+
 .dxbl-toolbar {
     --dxbl-toolbar-font-size: var(--bs-body-font-size) !important;
     font-size: var(--dxbl-toolbar-font-size);