Merge branch 'master' into OZG-5833-Barrierefreiheit-Layoutanpassungen

alfa-client/apps/alfa/src/styles/material/_formfield.scss

@@ -26,11 +26,12 @@ ozgcloud-fixed-dialog {
 
 body.dark {
   mat-form-field {
-    --mdc-theme-error: red;
-    --mdc-filled-text-field-error-focus-label-text-color: red;
-    --mdc-outlined-text-field-error-focus-label-text-color: red;
-    --mdc-filled-text-field-error-label-text-color: red;
-    --mdc-outlined-text-field-error-label-text-color: red;
-    --mdc-filled-text-field-disabled-active-indicator-color: red;
+    --mdc-theme-error: theme('colors.error');
+    --mat-form-field-error-text-color: theme('colors.error');
+    --mdc-filled-text-field-error-focus-label-text-color: theme('colors.error');
+    --mdc-outlined-text-field-error-focus-label-text-color: theme('colors.error');
+    --mdc-filled-text-field-error-label-text-color: theme('colors.error');
+    --mdc-outlined-text-field-error-label-text-color: theme('colors.error');
+    --mdc-filled-text-field-disabled-active-indicator-color: theme('colors.error');
   }
 }

alfa-client/libs/navigation/src/lib/build-info/build-info.component.html

@@ -30,6 +30,6 @@
     <span data-test-id="build-time">{{ buildTime }}</span>
   </ng-container>
 </p>
-<p *ngIf="isNotProduction" data-test-id="not-production-text" class="test-environment">
+<p *ngIf="isNotProduction" data-test-id="not-production-text" class="test-environment text-error">
   Achtung Testumgebung
 </p>

alfa-client/libs/navigation/src/lib/build-info/build-info.component.scss

@@ -61,5 +61,4 @@ p {
   margin-right: $navigation-height + $header-height;
   letter-spacing: 0.42em;
   text-transform: uppercase;
-  color: #ff0000;
 }

alfa-client/libs/navigation/src/lib/header-container/header/header.component.html

@@ -30,7 +30,7 @@
   <div class="middle">
     <alfa-vorgang-search-container></alfa-vorgang-search-container>
   </div>
-  <div class="right">
+  <div class="flex items-center text-ozggray-800 dark:text-ozggray-300">
     <alfa-help-menu
       [apiRootStateResource]="apiRootStateResource"
       data-test-id="help-menu"

alfa-client/libs/navigation/src/lib/header-container/header/header.component.scss

@@ -53,9 +53,3 @@ header {
     min-width: 240px;
   }
 }
-
-.right {
-  color: $grey;
-  display: flex;
-  align-items: center;
-}

alfa-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/outgoing-mail/outgoing-mail-error-container/outgoing-mail-error/outgoing-mail-error.component.html

@@ -29,7 +29,7 @@
   class="mail-send-error"
 >
   <span data-test-id="mail-send-error-text">{{ message }}</span>
-  <mat-icon data-test-id="mail-send-error-icon" class="mail-send-error__icon mat-icon-error"
+  <mat-icon data-test-id="mail-send-error-icon" class="mail-send-error__icon text-error"
     >error_outline_white</mat-icon
   >
 </div>

alfa-client/libs/postfach/src/lib/postfach-mail-list-container/postfach-mail-list/postfach-mail/outgoing-mail/outgoing-mail-error-container/outgoing-mail-error/outgoing-mail-error.component.scss

@@ -25,10 +25,6 @@
 @use '@angular/material' as mat;
 @import 'variables';
 
-.mat-icon-error {
-  color: mat.get-color-from-palette($warnPalette);
-}
-
 .mail-send-error {
   display: flex;
   align-items: center;

alfa-client/libs/ui/src/lib/assets/update.svg

-<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368"><path d="M480-120q-75 0-140.5-28.5t-114-77q-48.5-48.5-77-114T120-480q0-75 28.5-140.5t77-114q48.5-48.5 114-77T480-840q82 0 155.5 35T760-706v-94h80v240H600v-80h110q-41-56-101-88t-129-32q-117 0-198.5 81.5T200-480q0 117 81.5 198.5T480-200q105 0 183.5-68T756-440h82q-15 137-117.5 228.5T480-120Zm112-192L440-464v-216h80v184l128 128-56 56Z"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="inherit">
+  <path
+    d="M480-120q-75 0-140.5-28.5t-114-77q-48.5-48.5-77-114T120-480q0-75 28.5-140.5t77-114q48.5-48.5 114-77T480-840q82 0 155.5 35T760-706v-94h80v240H600v-80h110q-41-56-101-88t-129-32q-117 0-198.5 81.5T200-480q0 117 81.5 198.5T480-200q105 0 183.5-68T756-440h82q-15 137-117.5 228.5T480-120Zm112-192L440-464v-216h80v184l128 128-56 56Z" />
+</svg>
\ No newline at end of file

alfa-client/libs/user-assistance/src/lib/help-menu/help-menu.component.html

@@ -5,9 +5,9 @@
   [matMenuTriggerFor]="helpMenu.matMenu"
   data-test-id="help-menu-button"
 >
-  <div class="help-menu">
-    <ozgcloud-icon icon="help_outline"></ozgcloud-icon>
-    <div class="text">Hilfe</div>
+  <div class="flex items-center text-ozggray-800 dark:text-ozggray-300">
+    <ozgcloud-icon class="mr-1" icon="help_outline"></ozgcloud-icon>
+    <div>Hilfe</div>
   </div>
 </button>
 <ozgcloud-menu #helpMenu>

alfa-client/libs/user-assistance/src/lib/help-menu/help-menu.component.scss

-@import 'variables';
-
-.help-menu {
-  display: flex;
-  align-items: center;
-  color: $grey;
-}
-
-ozgcloud-icon {
-  margin-right: 4px;
-}

alfa-client/libs/user-assistance/src/lib/help-menu/help-menu.component.ts

-import { Component, Input } from '@angular/core';
 import { ApiRootLinkRel, ApiRootResource } from '@alfa-client/api-root-shared';
 import { StateResource } from '@alfa-client/tech-shared';
+import { Component, Input } from '@angular/core';
 import { hasLink } from '@ngxp/rest';
 
 @Component({
   selector: 'alfa-help-menu',
   templateUrl: './help-menu.component.html',
-  styleUrls: ['./help-menu.component.scss'],
 })
 export class HelpMenuComponent {
   @Input() apiRootStateResource: StateResource<ApiRootResource>;

alfa-client/libs/vorgang-shared-ui/src/lib/wiedervorlage-icon/wiedervorlage-icon.component.html

-<div [class.red]="isOverdue" data-test-class="wiedervorlage-icon">
+<div
+  [ngClass]="{ 'text-error': isOverdue, 'text-text': !isOverdue }"
+  data-test-class="wiedervorlage-icon"
+>
   <ng-container *ngIf="isOverdue; else defaultFrist">
     <ozgcloud-svgicon
       svgIcon="resubmission_expired"

alfa-client/libs/vorgang-shared-ui/src/lib/wiedervorlage-icon/wiedervorlage-icon.component.scss

@@ -6,11 +6,3 @@
   margin-right: 6px;
   height: $iconHeight;
 }
-
-.red {
-  color: mat.get-color-from-palette($warnPalette, darker);
-}
-
-body.dark :host .red {
-  color: red;
-}

alfa-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-next-frist-button/vorgang-next-frist-button.component.html

@@ -31,7 +31,11 @@
   (mouseleave)="showWiedervorlagen = false"
   (focusout)="showWiedervorlagen = false"
 >
-  <div class="date" [class.red]="isOverdue" data-test-class="wiedervorlage-next-frist">
+  <div
+    class="date"
+    [ngClass]="{ 'text-error': isOverdue, 'text-text': !isOverdue }"
+    data-test-class="wiedervorlage-next-frist"
+  >
     <alfa-wiedervorlage-icon [isOverdue]="isOverdue"></alfa-wiedervorlage-icon>
     <span>{{ vorgang.nextFrist | formatToPrettyDate }}</span>
   </div>

alfa-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-next-frist-button/vorgang-next-frist-button.component.scss

@@ -29,7 +29,6 @@
   background-color: inherit;
   border: 0;
   padding: 0;
-  color: inherit;
   position: relative;
 }
 
@@ -38,11 +37,3 @@
   align-items: center;
   white-space: nowrap;
 }
-
-.red {
-  color: mat.get-color-from-palette($warnPalette, darker);
-}
-
-body.dark :host .red {
-  color: red;
-}