From e9f73bc96a9591fa3b5b4fbc4231a70e7f4a13bc Mon Sep 17 00:00:00 2001
From: fs <fs@breadcrumb-solutions.de>
Date: Thu, 12 Mar 2026 09:41:18 +0100
Subject: [PATCH] ui changes and role switch added

---
 pages/admin/tenants/_form.phtml             | 14 +++++++++-----
 web/css/base/variables.base.css             |  6 +++---
 web/css/base/variables.contrast.css         |  4 ++--
 web/css/base/variables.theme-dark-green.css |  2 +-
 web/css/components/app-details-titlebar.css |  2 --
 web/css/components/app-list-titlebar.css    |  2 +-
 6 files changed, 16 insertions(+), 14 deletions(-)

diff --git a/pages/admin/tenants/_form.phtml b/pages/admin/tenants/_form.phtml
index aa77a8d..0a566bf 100644
--- a/pages/admin/tenants/_form.phtml
+++ b/pages/admin/tenants/_form.phtml
@@ -244,7 +244,7 @@ $ssoSyncNeedsGraph = !empty($ssoUiState['sync_needs_graph']);
                 <fieldset data-custom-field-filterable-target data-custom-field-group="tenant-custom-field-create">
                   <legend><small><?php e(t('Filterable')); ?></small></legend>
                   <label class="app-field">
-                    <input form="tenant-custom-field-create-form" type="checkbox" name="is_filterable" value="1"
+                    <input form="tenant-custom-field-create-form" role="switch" type="checkbox" name="is_filterable" value="1"
                       data-custom-field-filterable-input
                       <?php e($disabledAttr); ?>>
                     <span><?php e(t('Filterable')); ?></span>
@@ -254,7 +254,7 @@ $ssoSyncNeedsGraph = !empty($ssoUiState['sync_needs_graph']);
                 <fieldset>
                   <legend><small><?php e(t('Active')); ?></small></legend>
                   <label class="app-field">
-                    <input form="tenant-custom-field-create-form" type="checkbox" name="active" value="1" checked
+                    <input form="tenant-custom-field-create-form" role="switch" type="checkbox" name="active" value="1" checked
                       <?php e($disabledAttr); ?>>
                     <span><?php e(t('Active')); ?></span>
                   </label>
@@ -356,7 +356,7 @@ $ssoSyncNeedsGraph = !empty($ssoUiState['sync_needs_graph']);
                 <fieldset data-custom-field-filterable-target data-custom-field-group="<?php e($typeGroupId); ?>">
                   <legend><small><?php e(t('Filterable')); ?></small></legend>
                   <label class="app-field">
-                    <input type="checkbox" form="<?php e($updateFormId); ?>" name="is_filterable" value="1"
+                    <input type="checkbox" role="switch" form="<?php e($updateFormId); ?>" name="is_filterable" value="1"
                       data-custom-field-filterable-input
                       <?php e(!empty($definition['is_filterable']) ? 'checked' : ''); ?>
                       <?php e($disabledAttr); ?>>
@@ -368,7 +368,7 @@ $ssoSyncNeedsGraph = !empty($ssoUiState['sync_needs_graph']);
                   <legend><small><?php e(t('Active')); ?></small></legend>
                   <label class="app-field">
                     <input type="hidden" form="<?php e($updateFormId); ?>" name="active" value="0">
-                    <input type="checkbox" form="<?php e($updateFormId); ?>" name="active" value="1"
+                    <input type="checkbox" role="switch" form="<?php e($updateFormId); ?>" name="active" value="1"
                       <?php e(!empty($definition['active']) ? 'checked' : ''); ?>
                       <?php e($disabledAttr); ?>>
                     <span><?php e(t('Active')); ?></span>
@@ -446,6 +446,7 @@ $ssoSyncNeedsGraph = !empty($ssoUiState['sync_needs_graph']);
           <label class="app-field">
             <input
               type="checkbox"
+              role="switch"
               name="microsoft_enabled"
               value="1"
               data-tenant-sso-enabled
@@ -469,6 +470,7 @@ $ssoSyncNeedsGraph = !empty($ssoUiState['sync_needs_graph']);
           <label class="app-field">
             <input
               type="checkbox"
+              role="switch"
               name="enforce_microsoft_login"
               value="1"
               <?php e($microsoftEnforce ? 'checked' : ''); ?>
@@ -506,6 +508,7 @@ $ssoSyncNeedsGraph = !empty($ssoUiState['sync_needs_graph']);
           <label class="app-field">
             <input
               type="checkbox"
+              role="switch"
               name="sync_profile_on_login"
               value="1"
               data-tenant-sso-sync-toggle
@@ -546,6 +549,7 @@ $ssoSyncNeedsGraph = !empty($ssoUiState['sync_needs_graph']);
             <input type="hidden" name="use_shared_app" value="0">
             <input
               type="checkbox"
+              role="switch"
               name="use_shared_app"
               value="1"
               data-tenant-sso-shared-toggle
@@ -599,7 +603,7 @@ $ssoSyncNeedsGraph = !empty($ssoUiState['sync_needs_graph']);
           </legend>
           <label class="app-field">
             <input type="hidden" name="primary_color_use_default" value="0">
-            <input type="checkbox" name="primary_color_use_default" value="1"
+            <input type="checkbox" role="switch" name="primary_color_use_default" value="1"
               data-color-default-toggle
               data-color-target="#primary_color"
               data-color-default="<?php e($defaultPrimaryColor); ?>"
diff --git a/web/css/base/variables.base.css b/web/css/base/variables.base.css
index 8d10d5b..e4d36c8 100644
--- a/web/css/base/variables.base.css
+++ b/web/css/base/variables.base.css
@@ -125,7 +125,7 @@
 [data-theme="light"] {
   color-scheme: light;
   --app-background-color: #fff;
-  --app-sidebar-background-color: rgb(247 250 252);
+  --app-sidebar-background-color: var(--app-background-color);
   --app-color: #373c44;
   --app-text-selection-color: rgba(2, 154, 232, 0.25);
   --app-muted-color: #646b79;
@@ -365,7 +365,7 @@
   :root:not([data-theme]) {
     color-scheme: dark;
     --app-background-color: rgb(19, 22.5, 30.5);
-    --app-sidebar-background-color: rgb(18 20 27);
+    --app-sidebar-background-color: var(--app-background-color);
     --app-color: #c2c7d0;
     --app-text-selection-color: rgba(1, 170, 255, 0.1875);
     --app-muted-color: #7b8495;
@@ -589,7 +589,7 @@
 [data-theme^="dark"] {
   color-scheme: dark;
   --app-background-color: rgb(19, 22.5, 30.5);
-  --app-sidebar-background-color: rgb(18 20 27);
+  --app-sidebar-background-color: var(--app-background-color);
   --app-color: #c2c7d0;
   --app-text-selection-color: rgba(1, 170, 255, 0.1875);
   --app-muted-color: #7b8495;
diff --git a/web/css/base/variables.contrast.css b/web/css/base/variables.contrast.css
index 8928070..5f5d2ab 100644
--- a/web/css/base/variables.contrast.css
+++ b/web/css/base/variables.contrast.css
@@ -5,7 +5,7 @@
 html[data-contrast="high"][data-theme="light"],
 [data-contrast="high"][data-theme="light"] {
   --app-background-color: #fff;
-  --app-sidebar-background-color: #fff;
+  --app-sidebar-background-color: var(--app-background-color);
   --app-color: #0f172a;
   --app-muted-color: #1f2937;
   --app-muted-border-color: #64748b;
@@ -26,7 +26,7 @@ html[data-contrast="high"][data-theme="light"],
 html[data-contrast="high"][data-theme^="dark"],
 [data-contrast="high"][data-theme^="dark"] {
   --app-background-color: #000;
-  --app-sidebar-background-color: #000;
+  --app-sidebar-background-color: var(--app-background-color);
   --app-color: #f8fafc;
   --app-muted-color: #cbd5e1;
   --app-muted-border-color: #64748b;
diff --git a/web/css/base/variables.theme-dark-green.css b/web/css/base/variables.theme-dark-green.css
index 79986ee..713a86d 100644
--- a/web/css/base/variables.theme-dark-green.css
+++ b/web/css/base/variables.theme-dark-green.css
@@ -3,7 +3,7 @@
 @layer tokens {
 [data-theme="dark-green"] {
   --app-background-color: #0f1713;
-  --app-sidebar-background-color: #0d1511;
+  --app-sidebar-background-color: var(--app-background-color);
   --app-color: #cfe0d6;
   --app-text-selection-color: rgba(64, 170, 118, 0.25);
   --app-muted-color: #8a9b91;
diff --git a/web/css/components/app-details-titlebar.css b/web/css/components/app-details-titlebar.css
index 0afcfaa..1ba2c50 100644
--- a/web/css/components/app-details-titlebar.css
+++ b/web/css/components/app-details-titlebar.css
@@ -5,8 +5,6 @@
     justify-content: space-between;
     flex-wrap: wrap;
     gap: 10px;
-    border-bottom: 1px solid var(--app-border);
-    padding-block-end: var(--app-spacing);
     margin-bottom: calc(var(--app-spacing) * 2);
   }
 
diff --git a/web/css/components/app-list-titlebar.css b/web/css/components/app-list-titlebar.css
index 0bb0439..76e2b16 100644
--- a/web/css/components/app-list-titlebar.css
+++ b/web/css/components/app-list-titlebar.css
@@ -5,7 +5,7 @@
     justify-content: space-between;
     flex-wrap: wrap;
     gap: 10px;
-    margin-bottom: calc(var(--app-spacing) * 1);
+    margin-bottom: calc(var(--app-spacing) * 2);
   }
 
   .app-list-titlebar h1,