OZG-7078 Add a11y link

alfa-client/libs/api-root-shared/src/lib/api-root.model.ts

@@ -28,6 +28,7 @@ export interface ApiRoot {
   buildTime: string;
   javaVersion: string;
   production: boolean;
+  barrierefreiheitUrl: string;
 }
 
 export interface ApiRootResource extends ApiRoot, Resource {}

alfa-client/libs/api-root-shared/test/api-root.ts

@@ -34,5 +34,6 @@ export function createApiRoot(): ApiRoot {
     buildTime: '1',
     javaVersion: '1',
     production: false,
+    barrierefreiheitUrl: 'https://example.com/',
   };
 }

alfa-client/libs/common/src/lib/accessibility-button/accessibility-button.component.ts

@@ -6,7 +6,7 @@ import { AccessibilityIconComponent, LinkComponent, TooltipDirective } from '@od
   selector: 'common-accessibility-button',
   standalone: true,
   imports: [CommonModule, AccessibilityIconComponent, LinkComponent, TooltipDirective],
-  template: `<ods-link [url]="url" [linkTestId]="linkTestId" tooltip="Barrierefreiheit">
+  template: `<ods-link [url]="url" [linkTestId]="linkTestId" tooltip="Barrierefreiheit" [openInNewTab]="true">
     <ods-accessibility-icon size="large" />
   </ods-link>`,
 })

alfa-client/libs/design-system/src/lib/tooltip/tooltip.component.ts

@@ -3,7 +3,7 @@ import { Component } from '@angular/core';
 @Component({
   selector: 'ods-tooltip',
   template: `<p
-    class="fixed z-50 mt-2 -translate-x-1/2 animate-fadeIn cursor-default rounded bg-ozggray-900 px-3 py-2 text-sm text-whitetext before:absolute before:-top-2 before:left-[calc(50%-0.5rem)] before:size-0 before:border-b-8 before:border-l-8 before:border-r-8 before:border-b-ozggray-900 before:border-l-transparent before:border-r-transparent before:content-[''] dark:bg-white dark:before:border-b-white"
+    class="fixed z-[100] mt-2 -translate-x-1/2 animate-fadeIn cursor-default rounded bg-ozggray-900 px-3 py-2 text-sm text-whitetext before:absolute before:-top-2 before:left-[calc(50%-0.5rem)] before:size-0 before:border-b-8 before:border-l-8 before:border-r-8 before:border-b-ozggray-900 before:border-l-transparent before:border-r-transparent before:content-[''] dark:bg-white dark:before:border-b-white"
     [style.left]="left + 'px'"
     [style.top]="top + 'px'"
     [attr.id]="id"

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

@@ -31,7 +31,12 @@
     <alfa-vorgang-search-container></alfa-vorgang-search-container>
   </div>
   <div class="flex items-center text-ozggray-800 dark:text-ozggray-300">
-    <common-accessibility-button url="/" class="mr-3" linkTestId="accessibility-button" />
+    <common-accessibility-button
+      *ngIf="apiRootStateResource?.resource.barrierefreiheitUrl"
+      [url]="apiRootStateResource.resource.barrierefreiheitUrl"
+      class="mr-3"
+      linkTestId="accessibility-button"
+    />
     <alfa-help-menu [apiRootStateResource]="apiRootStateResource" data-test-id="help-menu"></alfa-help-menu>
     <alfa-user-settings-container data-test-id="user-settings"></alfa-user-settings-container>
     <alfa-user-profile-in-header-container data-test-id="current-user"></alfa-user-profile-in-header-container>