UI/setting mainbar colors (ILIAS-eLearning#8001)

templates/default/010-settings/_index.scss

@@ -10,8 +10,9 @@
 @forward "./settings_typography";
 @forward "./settings_borders";
 @forward "./settings_button";
-@forward "./settings_footer"; 
+@forward "./settings_footer";
 @forward "./settings_header";
 @forward "./settings_layout";
+@forward "./settings_mainbar";
 @forward "./settings_media";
-@forward "./settings_shadows";
+@forward "./settings_shadows";

templates/default/010-settings/_settings_mainbar.scss

@@ -0,0 +1,14 @@
+@use "./settings_color-palette" as s;
+
+$il-mainbar-btn-color: s.$il-main-bg !default;
+$il-mainbar-btn-bg-color: s.$il-neutral-color !default;
+
+$il-mainbar-btn-color-hover: s.$il-neutral-color !default;
+$il-mainbar-btn-bg-color-hover: s.$il-main-bg !default;
+
+$il-mainbar-btn-color-engaged: s.$il-neutral-color !default;
+$il-mainbar-btn-bg-color-engaged: s.$il-main-bg !default;
+
+$il-mainbar-btn-icon-filter: brightness(0) invert(1) !default;
+$il-mainbar-btn-hover-icon-filter: invert(50%) !default;
+$il-mainbar-btn-engaged-icon-filter: invert(50%) !default;

templates/default/070-components/UI-framework/MainControls/_ui-component_mainbar.scss

@@ -11,19 +11,7 @@
 $il-mainbar-btn-padding: 0;
 $il-mainbar-btn-label-icon-gap: $il-padding-xs-vertical;
 
-$il-mainbar-btn-color: white;
-$il-mainbar-btn-bg-color: $il-neutral-color;
-$il-mainbar-btn-border-radius: null;
-
-$il-mainbar-btn-color-hover: $il-neutral-color;
-$il-mainbar-btn-bg-color-hover: $il-main-bg;
-
-$il-mainbar-btn-color-engaged: $il-neutral-color;
-$il-mainbar-btn-bg-color-engaged: $il-main-bg;
-
-$il-mainbar-btn-icon-filter: brightness(0) invert(1);
-$il-mainbar-btn-hover-icon-filter: invert(50%);
-$il-mainbar-btn-engaged-icon-filter: invert(50%);
+$il-mainbar-btn-border-radius: $il-border-radius-base;
 
 $il-mainbar-btn-border: 1px solid $il-standard-page-border-light-color;
 $il-mainbar-btn-label-size: $il-font-size-xsmall;