benjamin/wgenerator
1
0
Fork 0
Code Actions 1 Releases Activity

fix dark mode css
Some checks are pending
Angular Build / build (push) Waiting to run
Details

Browse Source
This commit is contained in:
benjamin
2026-04-27 23:53:51 +02:00
parent 8b3647b023
commit b330fb8141
5 changed files with 24 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/widget-modules/components/application-frame/navigation/navigation.component.html
View File

@@ -6,7 +6,7 @@
<app-link *appRole="['presenter']" [icon]="faPresentation" link="/presentation" text="Präsentation"></app-link>
<app-link [icon]="faUser" link="/user" text="Benutzer"></app-link>
</div>
<div class="actions">
<div *appRole="['user', 'presenter', 'leader']" class="actions actions-search">
<button
mat-icon-button
class="theme-toggle"
@@ -15,8 +15,6 @@
(click)="themeService.toggleTheme()">
<fa-icon [icon]="themeService.isDarkMode() ? faLightMode : faDarkMode"></fa-icon>
</button>
</div>
<div *appRole="['user', 'presenter', 'leader']" class="actions actions-search">
<app-filter></app-filter>
</div>
</nav>

1
src/app/widget-modules/components/application-frame/navigation/navigation.component.less
View File

@@ -36,6 +36,7 @@ nav {
}
.actions-search {
gap: var(--gap-s);
padding-right: 20px;
}

2
src/app/widget-modules/components/card/card.component.less
View File

@@ -36,7 +36,7 @@
top: 0;
bottom: 0;
width: unset;
z-index: 10;
z-index: 30;
}
}

4
src/app/widget-modules/components/sidebar/page-frame.component.less
View File

@@ -31,7 +31,7 @@
}
:host.collapsed .sidebar-toggle {
--icon-button-color: var(--surface);
--icon-button-color: var(--surface-persist);
--icon-button-hover-color: var(--surface-subtle);
}
@@ -131,7 +131,7 @@ aside.collapsed {
}
.title {
color: var(--surface);
color: var(--surface-persist);
font-size: 30px;
text-transform: uppercase;
text-align: right;

19
src/styles/styles.less
View File

@@ -4,6 +4,7 @@
--bg-soft: #bbd2c5;
--surface: rgba(244, 247, 245, 0.88);
--surface-persist: rgba(244, 247, 245, 0.88);
--surface-strong: rgba(255, 255, 255, 0.96);
--surface-dark: rgba(30, 36, 52, 0.72);
--surface-border: rgba(41, 46, 73, 0.16);
@@ -126,6 +127,24 @@ body.theme-dark {
--mat-menu-item-hover-state-layer-color: rgba(255, 255, 255, 0.08);
--mat-menu-item-focus-state-layer-color: rgba(255, 255, 255, 0.12);
--mat-menu-divider-color: rgba(206, 223, 229, 0.16);
--mat-checkbox-label-text-color: var(--text);
--mat-checkbox-disabled-label-color: rgba(232, 240, 244, 0.42);
--mat-checkbox-unselected-icon-color: rgba(206, 223, 229, 0.72);
--mat-checkbox-unselected-hover-icon-color: var(--text);
--mat-checkbox-unselected-focus-icon-color: var(--text);
--mat-checkbox-selected-icon-color: var(--primary-hover);
--mat-checkbox-selected-hover-icon-color: var(--primary-hover);
--mat-checkbox-selected-focus-icon-color: var(--primary-hover);
--mat-checkbox-selected-checkmark-color: #07111b;
--mat-checkbox-disabled-selected-checkmark-color: rgba(7, 17, 27, 0.72);
--mat-checkbox-disabled-selected-icon-color: rgba(206, 223, 229, 0.34);
--mat-checkbox-disabled-unselected-icon-color: rgba(206, 223, 229, 0.28);
--mat-checkbox-unselected-hover-state-layer-color: rgba(232, 240, 244, 0.12);
--mat-checkbox-unselected-focus-state-layer-color: rgba(232, 240, 244, 0.16);
--mat-checkbox-unselected-pressed-state-layer-color: rgba(167, 198, 206, 0.18);
--mat-checkbox-selected-hover-state-layer-color: rgba(167, 198, 206, 0.16);
--mat-checkbox-selected-focus-state-layer-color: rgba(167, 198, 206, 0.2);
--mat-checkbox-selected-pressed-state-layer-color: rgba(167, 198, 206, 0.22);
}
body.theme-dark .mat-mdc-text-field-wrapper {