Fix Inconsistencies towards Material Style
All checks were successful
Quality Check / Linting (push) Successful in 22s

This commit is contained in:
Dominik Säume 2024-12-19 15:31:53 +01:00
parent c846650556
commit 9289e486b1
2 changed files with 15 additions and 16 deletions

View file

@ -1,5 +1,3 @@
@use '@angular/material' as mat;
.header { .header {
position: sticky; position: sticky;
top: 0; top: 0;
@ -7,7 +5,7 @@
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
z-index: 100; z-index: 100;
height: fit-content; height: fit-content;
background-color: var(--mat-sys-primary-fixed); background-color: var(--mat-sys-primary-container);
nav { nav {
display: flex; display: flex;
@ -19,11 +17,13 @@
gap: 0.25rem; gap: 0.25rem;
} }
a, button { a,
color: var(--mat-sys-on-primary-fixed-variant); button {
color: var(--mat-sys-primary);
&:hover, &.active { &:hover,
background-color: color-mix(in srgb, var(--mat-sys-primary) 50%, transparent) &.active {
background-color: var(--mat-sys-primary-overlay)
} }
} }

View file

@ -3,15 +3,14 @@
html { html {
color-scheme: light dark; color-scheme: light dark;
@include mat.theme(( @include mat.theme((color: mat.$azure-palette,
color: mat.$azure-palette,
typography: Roboto, typography: Roboto,
density: 0 density: 0));
)); --mat-sys-primary-overlay: color-mix(in srgb, var(--mat-sys-primary) 10%, transparent);
} }
html,
html, body { body {
height: 100%; height: 100%;
} }