diff --git a/alfa-client/apps/admin/src/app/app.component.html b/alfa-client/apps/admin/src/app/app.component.html index 9e3f549e41e574184c74dbba19273cf2693c4385..5c3acf252c7dafef5d6a9b31f05eff34bef86aec 100644 --- a/alfa-client/apps/admin/src/app/app.component.html +++ b/alfa-client/apps/admin/src/app/app.component.html @@ -38,7 +38,7 @@ </ng-template> </main> <section class="w-5"> - <alfa-build-info *ngIf="apiRoot" [apiRoot]="apiRoot" data-test-id="build-info" /> + <common-build-info *ngIf="apiRoot" [apiRoot]="apiRoot" data-test-id="build-info" /> </section> </div> </ng-container> diff --git a/alfa-client/apps/alfa/src/app/app.component.html b/alfa-client/apps/alfa/src/app/app.component.html index b10af37299a6874ab18519ed496e0366d18cb0bc..f679ed21931917da35363eb6253add769ac5fa21 100644 --- a/alfa-client/apps/alfa/src/app/app.component.html +++ b/alfa-client/apps/alfa/src/app/app.component.html @@ -31,7 +31,7 @@ <div class="mat-app-background relative grow"><router-outlet></router-outlet></div> <section class="mat-app-background right-nav"> - <alfa-build-info *ngIf="apiRoot.resource" [apiRoot]="apiRoot.resource" data-test-id="build-info"></alfa-build-info> + <common-build-info *ngIf="apiRoot.resource" [apiRoot]="apiRoot.resource" data-test-id="build-info"></common-build-info> </section> </div> </ozgcloud-spinner> diff --git a/alfa-client/libs/common/project.json b/alfa-client/libs/common/project.json index 75ea075f15e55a052c0cc5e7f02564ae3748e547..97f84789c26c646c01991180484cf7a3c8348b0e 100644 --- a/alfa-client/libs/common/project.json +++ b/alfa-client/libs/common/project.json @@ -2,7 +2,7 @@ "name": "common", "$schema": "../../node_modules/nx/schemas/project-schema.json", "sourceRoot": "libs/common/src", - "prefix": "lib", + "prefix": "common", "projectType": "library", "tags": [], "targets": { diff --git a/alfa-client/libs/common/src/index.ts b/alfa-client/libs/common/src/index.ts index f8f49f20b7993383fbce5faf8a3db0b1524766a0..345baa6f9a1fe6df941bbaabc626cab6066564e5 100644 --- a/alfa-client/libs/common/src/index.ts +++ b/alfa-client/libs/common/src/index.ts @@ -1 +1,2 @@ +export * from './lib/accessibility-button/accessibility-button.component'; export * from './lib/build-info/build-info.component'; diff --git a/alfa-client/libs/common/src/lib/accessibility-button/accessibility-button.component.spec.ts b/alfa-client/libs/common/src/lib/accessibility-button/accessibility-button.component.spec.ts new file mode 100644 index 0000000000000000000000000000000000000000..ad67dcf8ab0a9414481ab5db68b15534d2799751 --- /dev/null +++ b/alfa-client/libs/common/src/lib/accessibility-button/accessibility-button.component.spec.ts @@ -0,0 +1,21 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { AccessibilityButtonComponent } from './accessibility-button.component'; + +describe('AccessibilityButtonComponent', () => { + let component: AccessibilityButtonComponent; + let fixture: ComponentFixture<AccessibilityButtonComponent>; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + imports: [AccessibilityButtonComponent], + }).compileComponents(); + + fixture = TestBed.createComponent(AccessibilityButtonComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/alfa-client/libs/common/src/lib/accessibility-button/accessibility-button.component.ts b/alfa-client/libs/common/src/lib/accessibility-button/accessibility-button.component.ts new file mode 100644 index 0000000000000000000000000000000000000000..b356bd828f7b2c8515454fb92a4d09603d8f5f7d --- /dev/null +++ b/alfa-client/libs/common/src/lib/accessibility-button/accessibility-button.component.ts @@ -0,0 +1,13 @@ +import { CommonModule } from '@angular/common'; +import { Component, Input } from '@angular/core'; +import { AccessibilityIconComponent, LinkComponent } from '@ods/system'; + +@Component({ + selector: 'common-accessibility-button', + standalone: true, + imports: [CommonModule, AccessibilityIconComponent, LinkComponent], + template: `<ods-link [url]="url"><ods-accessibility-icon size="large" /></ods-link>`, +}) +export class AccessibilityButtonComponent { + @Input({ required: true }) url!: string; +} diff --git a/alfa-client/libs/common/src/lib/build-info/build-info.component.ts b/alfa-client/libs/common/src/lib/build-info/build-info.component.ts index 8d7182c2f837679916ebc9b91ee0dc7ed382ca63..e0689b36acc183305e33df8364daab78ae9ef6ca 100644 --- a/alfa-client/libs/common/src/lib/build-info/build-info.component.ts +++ b/alfa-client/libs/common/src/lib/build-info/build-info.component.ts @@ -28,7 +28,7 @@ import * as DateUtil from '@alfa-client/tech-shared'; import { CommonModule } from '@angular/common'; @Component({ - selector: 'alfa-build-info', + selector: 'common-build-info', imports: [CommonModule], standalone: true, templateUrl: './build-info.component.html', diff --git a/alfa-client/libs/design-system/src/lib/icons/accessibility-icon/accessibility-icon.component.ts b/alfa-client/libs/design-system/src/lib/icons/accessibility-icon/accessibility-icon.component.ts index a2ff1ec740fbf5e9bbc8d94b2dca69c2c3670e7f..935d840f496141a30a9d587fe6a405a5bf50f27d 100644 --- a/alfa-client/libs/design-system/src/lib/icons/accessibility-icon/accessibility-icon.component.ts +++ b/alfa-client/libs/design-system/src/lib/icons/accessibility-icon/accessibility-icon.component.ts @@ -15,11 +15,11 @@ import { iconVariants, IconVariants } from '../iconVariants'; <rect x="2" y="2" width="22" height="22" rx="11" /> <path d="M13 8.87508C12.6828 8.87508 12.3726 8.781 12.1088 8.60473C11.845 8.42846 11.6394 8.17793 11.518 7.8848C11.3966 7.59168 11.3648 7.26914 11.4267 6.95796C11.4886 6.64678 11.6414 6.36095 11.8657 6.1366C12.0901 5.91225 12.3759 5.75947 12.6871 5.69757C12.9983 5.63568 13.3208 5.66744 13.6139 5.78886C13.907 5.91027 14.1576 6.11588 14.3339 6.37969C14.5101 6.64349 14.6042 6.95364 14.6042 7.27092C14.6038 7.69623 14.4346 8.10399 14.1339 8.40473C13.8331 8.70547 13.4253 8.87463 13 8.87508Z" - fill="white" + class="fill-whitetext" /> <path d="M18.0417 8.898L18.0288 8.90144L18.0168 8.90516C17.9881 8.91318 17.9595 8.92178 17.9308 8.93066C17.3977 9.08706 14.8105 9.81638 12.9877 9.81638C11.2939 9.81638 8.94064 9.18618 8.18783 8.97219C8.1129 8.94322 8.03639 8.91855 7.95866 8.89829C7.41439 8.75506 7.04199 9.30792 7.04199 9.81323C7.04199 10.3137 7.49173 10.552 7.94577 10.723V10.731L10.6734 11.583C10.9521 11.6898 11.0266 11.799 11.063 11.8935C11.1813 12.1969 11.0868 12.7976 11.0533 13.0072L10.8871 14.2963L9.96501 19.3434C9.96215 19.3572 9.95957 19.3712 9.95728 19.3855L9.95069 19.4219C9.88423 19.8845 10.224 20.3334 10.8674 20.3334C11.4288 20.3334 11.6766 19.9458 11.784 19.4185C11.784 19.4185 12.5861 14.9047 12.9871 14.9047C13.3882 14.9047 14.2143 19.4185 14.2143 19.4185C14.3218 19.9458 14.5695 20.3334 15.131 20.3334C15.7761 20.3334 16.1158 19.8825 16.0477 19.4185C16.0417 19.3789 16.0345 19.34 16.0259 19.3022L15.0912 14.2969L14.9253 13.0078C14.8053 12.257 14.9018 12.0089 14.9345 11.9508L14.9368 11.9465C14.9677 11.8892 15.1087 11.7609 15.4375 11.6374L17.995 10.7434C18.0107 10.7392 18.0262 10.7342 18.0414 10.7285C18.4998 10.5566 18.9581 10.3188 18.9581 9.81381C18.9581 9.30878 18.586 8.75506 18.0417 8.898Z" - fill="white" + class="fill-whitetext" /> </svg>`, }) diff --git a/alfa-client/libs/design-system/src/lib/link/link.component.ts b/alfa-client/libs/design-system/src/lib/link/link.component.ts index 104c43202797efeea26483abec9968f0c8a17247..e17d50d683ebb302df52f35d74972ac3026933e6 100644 --- a/alfa-client/libs/design-system/src/lib/link/link.component.ts +++ b/alfa-client/libs/design-system/src/lib/link/link.component.ts @@ -6,7 +6,11 @@ import { twMerge } from 'tailwind-merge'; selector: 'ods-link', standalone: true, imports: [CommonModule], - template: `<a [target]="openInNewTab ? '_blank' : '_self'" [href]="url" [class]="twMerge('text-text outline-focus', class)"> + template: `<a + [target]="openInNewTab ? '_blank' : '_self'" + [href]="url" + [class]="twMerge('block rounded text-text outline-2 outline-offset-2 outline-focus focus-visible:outline', class)" + > <ng-content /> </a>`, }) diff --git a/alfa-client/libs/navigation/src/lib/header-container/header/header.component.html b/alfa-client/libs/navigation/src/lib/header-container/header/header.component.html index 100cd3141dbcb8562608433313d8cdf30c0af56b..a17357af34097e30ef038a1d9fa05226fb0d08de 100644 --- a/alfa-client/libs/navigation/src/lib/header-container/header/header.component.html +++ b/alfa-client/libs/navigation/src/lib/header-container/header/header.component.html @@ -31,13 +31,9 @@ <alfa-vorgang-search-container></alfa-vorgang-search-container> </div> <div class="flex items-center text-ozggray-800 dark:text-ozggray-300"> - <alfa-help-menu - [apiRootStateResource]="apiRootStateResource" - data-test-id="help-menu" - ></alfa-help-menu> + <common-accessibility-button url="/" class="mr-3" /> + <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> + <alfa-user-profile-in-header-container data-test-id="current-user"></alfa-user-profile-in-header-container> </div> </header> diff --git a/alfa-client/libs/navigation/src/lib/header-container/header/header.component.spec.ts b/alfa-client/libs/navigation/src/lib/header-container/header/header.component.spec.ts index 34785fb2ebc6a98efcfaa675cec5f40fe6e7b405..280fc07a04547b425e2cb4d4970e1fbe80c14852 100644 --- a/alfa-client/libs/navigation/src/lib/header-container/header/header.component.spec.ts +++ b/alfa-client/libs/navigation/src/lib/header-container/header/header.component.spec.ts @@ -21,12 +21,13 @@ * Die sprachspezifischen Genehmigungen und Beschränkungen * unter der Lizenz sind dem Lizenztext zu entnehmen. */ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { AccessibilityButtonComponent } from '@alfa-client/common'; import { UiModule } from '@alfa-client/ui'; import { HelpMenuComponent } from '@alfa-client/user-assistance'; import { UserProfileInHeaderContainerComponent } from '@alfa-client/user-profile'; import { UserSettingsContainerComponent } from '@alfa-client/user-settings'; import { VorgangSearchContainerComponent } from '@alfa-client/vorgang-shared-ui'; +import { ComponentFixture, TestBed } from '@angular/core/testing'; import { MockComponent } from 'ng-mocks'; import { HeaderLogoComponent } from './header-logo/header-logo.component'; import { HeaderComponent } from './header.component'; @@ -45,6 +46,7 @@ describe('HeaderComponent', () => { MockComponent(UserSettingsContainerComponent), MockComponent(UserProfileInHeaderContainerComponent), MockComponent(HelpMenuComponent), + MockComponent(AccessibilityButtonComponent), ], }); }); diff --git a/alfa-client/libs/navigation/src/lib/navigation.module.ts b/alfa-client/libs/navigation/src/lib/navigation.module.ts index 1622cf215a88c546c52288e1ffdda3c1d28075b2..c69266de067a959560b0241eae73719958ca4682 100644 --- a/alfa-client/libs/navigation/src/lib/navigation.module.ts +++ b/alfa-client/libs/navigation/src/lib/navigation.module.ts @@ -21,6 +21,7 @@ * Die sprachspezifischen Genehmigungen und Beschränkungen * unter der Lizenz sind dem Lizenztext zu entnehmen. */ +import { AccessibilityButtonComponent } from '@alfa-client/common'; import { UiModule } from '@alfa-client/ui'; import { UserAssistanceModule } from '@alfa-client/user-assistance'; import { UserProfileModule } from '@alfa-client/user-profile'; @@ -43,6 +44,7 @@ import { HeaderComponent } from './header-container/header/header.component'; UserProfileModule, UserSettingsModule, UserAssistanceModule, + AccessibilityButtonComponent, ], exports: [HeaderContainerComponent], })