refs #23867 [fid_adr] overlay

* set custom overlay color (see design)
* set higher z-index for overlay

co-authored by: Claas Kazzer <kazzer@uni-leipzig.de>
* refines Offcanvas settings
* override z-index of off-canvas overlay by using new finc variable

themes/fid_adlr/scss/_customVariables.scss

@@ -74,6 +74,10 @@ $state-info-border: $asphalt !default;
 $header-bg-color: $midnight;
 $a-visited-color: $black !default;
 $form-dropdown-focus-hover-color: #262626 !default;
+
+// overlay colors (modal & offcanvas)
+$overlay-color: rgba($midnight, 0.4);
+
 //// ELEMENT COLORS
 //$body-bg: $snow !default;
 //// Main content are bg
@@ -136,6 +140,11 @@ $screen-xl: 1600px !default; // FIXME EXPERIMENTAL
 $screen-xl-min: $screen-xl !default;
 $screen-lg-max: $screen-xl - 1 !default;
 
+
+// Set the default width up to which Offcanvas settings should apply
+$offcanvas-default-max-width: $screen-sm-max; // Use '$screen-sm-max' for installations where XS = SM;
+
+
 //// The general gutter width (padding between columns) is calculated like so: '$grid-gutter-width / 2'
 //// which gives you the left or right gutter width; this can be taken further by using '$grid-gutter-width / 1.5' etc
 $grid-gutter-width: 30px !default;
@@ -465,6 +474,7 @@ $z-index: (
   navbar-brand : 500,
   navbar-header-link : 150,
   navigation-overlay : 400,
+  offcanvas-overlay : 500
 );
 //// Z-Index - END
 
@@ -477,3 +487,13 @@ $imo-font-size-base: 18px;
 $imo-v-align: 0%; //-14.28571429%
 $icon-arrow-font-size: 30px;
 //// IcoMoon Custom Icons Font - END
+
+
+// *****************************************************************
+// **** S5 **** Off-canvas *****************************************
+// *****************************************************************
+
+// Z-Index of overlay
+$off-canvas-overlay-z-index: z-index(offcanvas-overlay, 0);
+
+$activate-on-demand-debug-bar: true;