diff --git a/alfa-client/apps/admin/src/app/app.component.html b/alfa-client/apps/admin/src/app/app.component.html
index 1b2bd35e596444d853a343d38b0c1b104efea01d..dbf35b4267a3086cc9a3fec2c6ecf4aefbe2b976 100644
--- a/alfa-client/apps/admin/src/app/app.component.html
+++ b/alfa-client/apps/admin/src/app/app.component.html
@@ -63,7 +63,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-e2e/docker-compose.yml b/alfa-client/apps/alfa-e2e/docker-compose.yml
index d2e8f6ca6948d1f86df81332193895193876d4dd..063d8cb97462ede9360da3f320316be256a55c58 100644
--- a/alfa-client/apps/alfa-e2e/docker-compose.yml
+++ b/alfa-client/apps/alfa-e2e/docker-compose.yml
@@ -111,6 +111,7 @@ services:
- OZGCLOUD_VORGANG_BESCHEID_0_FORM_ENGINE_NAME=FormSolutions
- OZGCLOUD_VORGANG_BESCHEID_0_FORM_ID=KFAS_STAGE_KI_10_Haltverbot_LANDESHACKATHON
- OZGCLOUD_FEATURE_COLLABORATION_ENABLED=true
+ - OZGCLOUD_BARRIEREFREIHEIT_URL=http://bam.de
ports:
- 8080:8080
- 5000:5000
@@ -140,11 +141,7 @@ services:
soft: 65536
hard: 65536
healthcheck:
- test:
- [
- 'CMD-SHELL',
- "curl -s 'http://localhost:9200/_cat/health?h=status' | egrep -q '(green|yellow)'",
- ]
+ test: ['CMD-SHELL', "curl -s 'http://localhost:9200/_cat/health?h=status' | egrep -q '(green|yellow)'"]
interval: 10s
timeout: 10s
retries: 5
diff --git a/alfa-client/apps/alfa-e2e/src/e2e/main-tests/accessibility/vorgang-list.cy.ts b/alfa-client/apps/alfa-e2e/src/e2e/main-tests/accessibility/vorgang-list.cy.ts
index ae463361daccda5d5061bd3e0568d5f9b8ad9e67..f3438210e69af79071e0ef8f9568cb17e336cbb3 100644
--- a/alfa-client/apps/alfa-e2e/src/e2e/main-tests/accessibility/vorgang-list.cy.ts
+++ b/alfa-client/apps/alfa-e2e/src/e2e/main-tests/accessibility/vorgang-list.cy.ts
@@ -29,7 +29,7 @@ import { HeaderE2EComponent } from 'apps/alfa-e2e/src/page-objects/header.po';
import { MainPage, waitForSpinnerToDisappear } from 'apps/alfa-e2e/src/page-objects/main.po';
import { isKeyboardFocused, isOdsFocused } from 'apps/alfa-e2e/src/support/angular.util';
import { dropCollections, pressTab } from 'apps/alfa-e2e/src/support/cypress-helper';
-import { exist, haveFocus } from 'apps/alfa-e2e/src/support/cypress.util';
+import { exist, haveFocus, shouldHaveAttribute } from 'apps/alfa-e2e/src/support/cypress.util';
import { initUsermanagerUsers, loginAsSabine } from 'apps/alfa-e2e/src/support/user-util';
describe('VorgangList Page', () => {
@@ -42,6 +42,9 @@ describe('VorgangList Page', () => {
const navigation: NavigationE2EComponent = mainPage.getNavigation();
+ const accTooltip: string = 'Barrierefreiheit';
+ const accLink: string = 'http://bam.de';
+
before(() => {
initUsermanagerUsers();
@@ -77,6 +80,17 @@ describe('VorgangList Page', () => {
haveFocus(vorgangSearch.getInput());
});
+ it('should focus accessibility icon', () => {
+ pressTab();
+
+ isOdsFocused(header.getAccessibilityIcon());
+ });
+
+ it('should contain tooltip and link for Barrierefreiheit', () => {
+ shouldHaveAttribute(header.getAccessibilityIcon().parent(), 'tooltip', accTooltip);
+ shouldHaveAttribute(header.getAccessibilityIcon(), 'href', accLink);
+ });
+
it('should focus help menu icon', () => {
pressTab();
diff --git a/alfa-client/apps/alfa-e2e/src/page-objects/header.po.ts b/alfa-client/apps/alfa-e2e/src/page-objects/header.po.ts
index eeebdc1c02956de31e6aea06ff4a72206d8b4f4c..09092b789839b63e7161e868bd7f923ef57dc5be 100644
--- a/alfa-client/apps/alfa-e2e/src/page-objects/header.po.ts
+++ b/alfa-client/apps/alfa-e2e/src/page-objects/header.po.ts
@@ -29,11 +29,11 @@ import { VorgangSearchE2EComponent } from '../components/vorgang/vorgang-search.
export class HeaderE2EComponent {
private readonly locatorLogo: string = 'alfa-logo';
private readonly locatorRoot: string = 'header';
+ private readonly accessibilityIcon: string = 'accessibility-button';
private readonly helpMenu: HelpMenuE2EComponent = new HelpMenuE2EComponent();
private readonly userSettings: UserSettingsE2EComponent = new UserSettingsE2EComponent();
- private readonly currentUserProfile: CurrentUserProfileE2EComponent =
- new CurrentUserProfileE2EComponent();
+ private readonly currentUserProfile: CurrentUserProfileE2EComponent = new CurrentUserProfileE2EComponent();
private readonly vorgangSearch: VorgangSearchE2EComponent = new VorgangSearchE2EComponent();
public getRoot() {
@@ -59,4 +59,8 @@ export class HeaderE2EComponent {
public getCurrentUserProfile(): CurrentUserProfileE2EComponent {
return this.currentUserProfile;
}
+
+ public getAccessibilityIcon(): Cypress.Chainable<JQuery<HTMLElement>> {
+ return cy.getTestElement(this.accessibilityIcon);
+ }
}
diff --git a/alfa-client/apps/alfa/src/app/app.component.html b/alfa-client/apps/alfa/src/app/app.component.html
index 5c09ee049b294c61ec0445eca7521d2dec849130..db1bfcb9fd820d9d2dbacafe0771e0d2f7249619 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/api-root-shared/src/lib/api-root.model.ts b/alfa-client/libs/api-root-shared/src/lib/api-root.model.ts
index 4e1a886f60685a95d6de0efa8f79684fce399d95..0786840d01e7e6c4f0ae6e57e107a77efdc2fade 100644
--- a/alfa-client/libs/api-root-shared/src/lib/api-root.model.ts
+++ b/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 {}
diff --git a/alfa-client/libs/api-root-shared/test/api-root.ts b/alfa-client/libs/api-root-shared/test/api-root.ts
index 84bfe6accf66c1f771d0765c7373b6dee6347eca..f0f8b4a7f3f717cc71c13609c159ce85d09f56c9 100644
--- a/alfa-client/libs/api-root-shared/test/api-root.ts
+++ b/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/',
};
}
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 01e1247282d52e5e70d9f510b9d3f994d57bf7ed..a980d329db61ca922fbb96ff3c4fb10ac56942ad 100644
--- a/alfa-client/libs/common/src/index.ts
+++ b/alfa-client/libs/common/src/index.ts
@@ -21,4 +21,5 @@
* Die sprachspezifischen Genehmigungen und Beschränkungen
* unter der Lizenz sind dem Lizenztext zu entnehmen.
*/
+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..edc5070fabc7f95bfb5f860bba434affff9ada6d
--- /dev/null
+++ b/alfa-client/libs/common/src/lib/accessibility-button/accessibility-button.component.ts
@@ -0,0 +1,16 @@
+import { CommonModule } from '@angular/common';
+import { Component, Input } from '@angular/core';
+import { AccessibilityIconComponent, LinkComponent, TooltipDirective } from '@ods/system';
+
+@Component({
+ selector: 'common-accessibility-button',
+ standalone: true,
+ imports: [CommonModule, AccessibilityIconComponent, LinkComponent, TooltipDirective],
+ template: `<ods-link [url]="url" [linkTestId]="linkTestId" tooltip="Barrierefreiheit" [openInNewTab]="true">
+ <ods-accessibility-icon size="large" />
+ </ods-link>`,
+})
+export class AccessibilityButtonComponent {
+ @Input({ required: true }) url!: string;
+ @Input() linkTestId: string | null = null;
+}
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 04018e18d0b1bf7082902d7ff1ec2c650936b46f..fce6638a63cdd178551bf641450a730e9277f179 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/index.ts b/alfa-client/libs/design-system/src/index.ts
index f7ba4181d830312706ee8e9574de09a3f20ba5ed..7c6f233e2472e76ada1b86ccda93d1d50b5e2be0 100644
--- a/alfa-client/libs/design-system/src/index.ts
+++ b/alfa-client/libs/design-system/src/index.ts
@@ -38,6 +38,7 @@ export * from './lib/form/file-upload-button/file-upload-button.component';
export * from './lib/form/radio-button-card/radio-button-card.component';
export * from './lib/form/text-input/text-input.component';
export * from './lib/form/textarea/textarea.component';
+export * from './lib/icons/accessibility-icon/accessibility-icon.component';
export * from './lib/icons/admin-logo-icon/admin-logo-icon.component';
export * from './lib/icons/attachment-icon/attachment-icon.component';
export * from './lib/icons/bescheid-generate-icon/bescheid-generate-icon.component';
@@ -65,6 +66,7 @@ export * from './lib/icons/user-icon/user-icon.component';
export * from './lib/icons/users-icon/users-icon.component';
export * from './lib/instant-search/instant-search/instant-search.component';
export * from './lib/instant-search/instant-search/instant-search.model';
+export * from './lib/link/link.component';
export * from './lib/list/list-item/list-item.component';
export * from './lib/list/list.component';
export * from './lib/navbar/nav-item/nav-item.component';
diff --git a/alfa-client/libs/design-system/src/lib/icons/accessibility-icon/accessibility-icon.component.spec.ts b/alfa-client/libs/design-system/src/lib/icons/accessibility-icon/accessibility-icon.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..8a1735897ec6ab66b4e3514bd91bbfe52c28a8e7
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/icons/accessibility-icon/accessibility-icon.component.spec.ts
@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { AccessibilityIconComponent } from './accessibility-icon.component';
+
+describe('AccessibilityIconComponent', () => {
+ let component: AccessibilityIconComponent;
+ let fixture: ComponentFixture<AccessibilityIconComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [AccessibilityIconComponent],
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(AccessibilityIconComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
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
new file mode 100644
index 0000000000000000000000000000000000000000..04a9f704dac2d4a0c93dd9a8794376f21dfa7b65
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/icons/accessibility-icon/accessibility-icon.component.ts
@@ -0,0 +1,32 @@
+import { CommonModule } from '@angular/common';
+import { Component, Input } from '@angular/core';
+import { twMerge } from 'tailwind-merge';
+import { iconVariants, IconVariants } from '../iconVariants';
+
+@Component({
+ selector: 'ods-accessibility-icon',
+ standalone: true,
+ imports: [CommonModule],
+ template: `<svg
+ viewBox="0 0 26 26"
+ [ngClass]="[twMerge(iconVariants({ size }), 'fill-neutral-500 dark:fill-neutral-400', class)]"
+ xmlns="http://www.w3.org/2000/svg"
+ >
+ <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"
+ 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"
+ class="fill-whitetext"
+ />
+ </svg>`,
+})
+export class AccessibilityIconComponent {
+ @Input() size: IconVariants['size'] = 'medium';
+ @Input() class: string = '';
+
+ readonly iconVariants = iconVariants;
+ readonly twMerge = twMerge;
+}
diff --git a/alfa-client/libs/design-system/src/lib/icons/accessibility-icon/accessibility-icon.stories.ts b/alfa-client/libs/design-system/src/lib/icons/accessibility-icon/accessibility-icon.stories.ts
new file mode 100644
index 0000000000000000000000000000000000000000..58485f498389eb413f4dafaccfa4a10ad55cea2e
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/icons/accessibility-icon/accessibility-icon.stories.ts
@@ -0,0 +1,27 @@
+import type { Meta, StoryObj } from '@storybook/angular';
+
+import { AccessibilityIconComponent } from './accessibility-icon.component';
+
+const meta: Meta<AccessibilityIconComponent> = {
+ title: 'Icons/Accessibility icon',
+ component: AccessibilityIconComponent,
+ excludeStories: /.*Data$/,
+ tags: ['autodocs'],
+};
+
+export default meta;
+type Story = StoryObj<AccessibilityIconComponent>;
+
+export const Default: Story = {
+ args: { size: 'large' },
+ argTypes: {
+ size: {
+ control: 'select',
+ options: ['small', 'medium', 'large', 'extra-large', 'full'],
+ description: 'Size of icon. Property "full" means 100%',
+ table: {
+ defaultValue: { summary: 'medium' },
+ },
+ },
+ },
+};
diff --git a/alfa-client/libs/design-system/src/lib/icons/settings-icon/settings-icon.component.ts b/alfa-client/libs/design-system/src/lib/icons/settings-icon/settings-icon.component.ts
index 75d67b66d9161dc85cce12d6c0c4cd61873b9d8a..d3d122cc205fad369224ed74bee88aeef3ecfd8b 100644
--- a/alfa-client/libs/design-system/src/lib/icons/settings-icon/settings-icon.component.ts
+++ b/alfa-client/libs/design-system/src/lib/icons/settings-icon/settings-icon.component.ts
@@ -34,7 +34,7 @@ import { twMerge } from 'tailwind-merge';
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
- [ngClass]="twMerge(iconVariants({ size }), 'fill-neutral-500', class)"
+ [ngClass]="twMerge(iconVariants({ size }), 'fill-neutral-500 dark:fill-neutral-400', class)"
>
<path
d="M 10.490234 2 C 10.011234 2 9.6017656 2.3385938 9.5097656 2.8085938 L 9.1757812 4.5234375 C 8.3550224 4.8338012 7.5961042 5.2674041 6.9296875 5.8144531 L 5.2851562 5.2480469 C 4.8321563 5.0920469 4.33375 5.2793594 4.09375 5.6933594 L 2.5859375 8.3066406 C 2.3469375 8.7216406 2.4339219 9.2485 2.7949219 9.5625 L 4.1132812 10.708984 C 4.0447181 11.130337 4 11.559284 4 12 C 4 12.440716 4.0447181 12.869663 4.1132812 13.291016 L 2.7949219 14.4375 C 2.4339219 14.7515 2.3469375 15.278359 2.5859375 15.693359 L 4.09375 18.306641 C 4.33275 18.721641 4.8321562 18.908906 5.2851562 18.753906 L 6.9296875 18.1875 C 7.5958842 18.734206 8.3553934 19.166339 9.1757812 19.476562 L 9.5097656 21.191406 C 9.6017656 21.661406 10.011234 22 10.490234 22 L 13.509766 22 C 13.988766 22 14.398234 21.661406 14.490234 21.191406 L 14.824219 19.476562 C 15.644978 19.166199 16.403896 18.732596 17.070312 18.185547 L 18.714844 18.751953 C 19.167844 18.907953 19.66625 18.721641 19.90625 18.306641 L 21.414062 15.691406 C 21.653063 15.276406 21.566078 14.7515 21.205078 14.4375 L 19.886719 13.291016 C 19.955282 12.869663 20 12.440716 20 12 C 20 11.559284 19.955282 11.130337 19.886719 10.708984 L 21.205078 9.5625 C 21.566078 9.2485 21.653063 8.7216406 21.414062 8.3066406 L 19.90625 5.6933594 C 19.66725 5.2783594 19.167844 5.0910937 18.714844 5.2460938 L 17.070312 5.8125 C 16.404116 5.2657937 15.644607 4.8336609 14.824219 4.5234375 L 14.490234 2.8085938 C 14.398234 2.3385937 13.988766 2 13.509766 2 L 10.490234 2 z M 12 8 C 14.209 8 16 9.791 16 12 C 16 14.209 14.209 16 12 16 C 9.791 16 8 14.209 8 12 C 8 9.791 9.791 8 12 8 z"
diff --git a/alfa-client/libs/design-system/src/lib/link/link.component.spec.ts b/alfa-client/libs/design-system/src/lib/link/link.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..431c89518a427b7dc43111fa1ff4ffeb00213082
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/link/link.component.spec.ts
@@ -0,0 +1,49 @@
+import { getElementFromFixture } from '@alfa-client/test-utils';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { getDataTestIdOf } from 'libs/tech-shared/test/data-test';
+import { LinkComponent } from './link.component';
+
+describe('LinkComponent', () => {
+ let component: LinkComponent;
+ let fixture: ComponentFixture<LinkComponent>;
+
+ const linkElementSelector: string = getDataTestIdOf('testLink');
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [LinkComponent],
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(LinkComponent);
+ component = fixture.componentInstance;
+ component.linkTestId = 'testLink';
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+
+ describe('component', () => {
+ describe('isFocused', () => {
+ it('should be set to true on focus', () => {
+ const linkElement: HTMLLinkElement = getElementFromFixture(fixture, linkElementSelector);
+
+ linkElement.focus();
+ fixture.detectChanges();
+
+ expect(component.isFocused).toBe(true);
+ });
+
+ it('should be set to false on blue', () => {
+ component.isFocused = true;
+ const linkElement: HTMLLinkElement = getElementFromFixture(fixture, linkElementSelector);
+
+ linkElement.dispatchEvent(new Event('blur'));
+ fixture.detectChanges();
+
+ expect(component.isFocused).toBe(false);
+ });
+ });
+ });
+});
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
new file mode 100644
index 0000000000000000000000000000000000000000..1d11015962993c60b5c4eea6b5687f6500a76d81
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/link/link.component.ts
@@ -0,0 +1,29 @@
+import { CommonModule } from '@angular/common';
+import { Component, Input } from '@angular/core';
+import { twMerge } from 'tailwind-merge';
+
+@Component({
+ selector: 'ods-link',
+ standalone: true,
+ imports: [CommonModule],
+ 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)"
+ [attr.data-test-id]="linkTestId"
+ (focus)="isFocused = true"
+ (blur)="isFocused = false"
+ [class.ods-focused]="isFocused"
+ >
+ <ng-content />
+ </a>`,
+})
+export class LinkComponent {
+ @Input({ required: true }) url!: string;
+ @Input() openInNewTab: boolean = false;
+ @Input() class: string = '';
+ @Input() linkTestId: string | null = null;
+
+ public isFocused: boolean = false;
+ readonly twMerge = twMerge;
+}
diff --git a/alfa-client/libs/design-system/src/lib/link/link.stories.ts b/alfa-client/libs/design-system/src/lib/link/link.stories.ts
new file mode 100644
index 0000000000000000000000000000000000000000..f4cad5258e5bc811593066f13a2fa7b844dbcd58
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/link/link.stories.ts
@@ -0,0 +1,50 @@
+import { argsToTemplate, moduleMetadata, type Meta, type StoryObj } from '@storybook/angular';
+
+import { AccessibilityIconComponent } from '../icons/accessibility-icon/accessibility-icon.component';
+import { LinkComponent } from './link.component';
+
+const meta: Meta<LinkComponent> = {
+ title: 'Link',
+ component: LinkComponent,
+ decorators: [
+ moduleMetadata({
+ imports: [LinkComponent, AccessibilityIconComponent],
+ }),
+ ],
+ excludeStories: /.*Data$/,
+ tags: ['autodocs'],
+};
+
+export default meta;
+type Story = StoryObj<LinkComponent>;
+
+export const Default: Story = {
+ args: {
+ url: 'https://www.bundestag.de/',
+ openInNewTab: true,
+ },
+ argTypes: {
+ url: { description: 'Link to external url' },
+ openInNewTab: { description: 'Should the link be opened in new tab' },
+ class: { description: 'CSS/Tailwind class' },
+ },
+ render: (args) => ({
+ props: args,
+ template: `<ods-link ${argsToTemplate(args)}>
+ Link with text
+ </ods-link>`,
+ }),
+};
+
+export const WithIcon: Story = {
+ args: {
+ url: 'https://www.bmas.de/DE/Service/Gesetze-und-Gesetzesvorhaben/barrierefreiheitsstaerkungsgesetz.html',
+ openInNewTab: true,
+ },
+ render: (args) => ({
+ props: args,
+ template: `<ods-link ${argsToTemplate(args)}>
+ <ods-accessibility-icon size="large" />
+ </ods-link>`,
+ }),
+};
diff --git a/alfa-client/libs/design-system/src/lib/tooltip/tooltip.component.ts b/alfa-client/libs/design-system/src/lib/tooltip/tooltip.component.ts
index 947b039d1e21e4d2d0a5c41bf68fc2042a3c95ec..51b46d897d0ff01414a77fc37792fb24c1edd1b8 100644
--- a/alfa-client/libs/design-system/src/lib/tooltip/tooltip.component.ts
+++ b/alfa-client/libs/design-system/src/lib/tooltip/tooltip.component.ts
@@ -26,11 +26,12 @@ 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-[0.5rem] before:border-l-[0.5rem] before:border-r-[0.5rem] 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"
role="tooltip"
+ aria-hidden="true"
>
{{ text }}
</p>`,
diff --git a/alfa-client/libs/design-system/src/lib/tooltip/tooltip.directive.ts b/alfa-client/libs/design-system/src/lib/tooltip/tooltip.directive.ts
index 22643613c45d09267392c961658e3fd461b6b5ed..f624d583427930c3a5fbb8cf5c42d85c1c43f0bb 100644
--- a/alfa-client/libs/design-system/src/lib/tooltip/tooltip.directive.ts
+++ b/alfa-client/libs/design-system/src/lib/tooltip/tooltip.directive.ts
@@ -77,6 +77,7 @@ export class TooltipDirective implements OnDestroy {
@HostListener('mouseleave')
@HostListener('window:scroll')
@HostListener('focusout')
+ @HostListener('window:resize')
destroyTooltip(): void {
this.destroy();
}
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 5e2f083bef5e59874e068cad231ad1fb4442c4a2..d242083a8ace00b985014ed7514aa0b02bcb2172 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,14 @@
<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
+ *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>
+ <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 3104729ce9c207c103bb8f0e3b564e78ac61742a..34bfb94cc20aad98d03a09e66c82578fb694ea97 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 47b591f4b4081fb634faf651cb911f9150ba3b90..67cd2f216c40a0e850204b31089771c3912fffda 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],
})
diff --git a/alfa-client/libs/user-settings/src/lib/user-settings-container/user-settings/user-settings.component.html b/alfa-client/libs/user-settings/src/lib/user-settings-container/user-settings/user-settings.component.html
index 1e2b929053267f0ed4d11c2d4748867ffc2a699d..3874b48bac2927977e4c2b4fed7f4cf00f983cdd 100644
--- a/alfa-client/libs/user-settings/src/lib/user-settings-container/user-settings/user-settings.component.html
+++ b/alfa-client/libs/user-settings/src/lib/user-settings-container/user-settings/user-settings.component.html
@@ -24,7 +24,7 @@
-->
<ods-dropdown-menu
- buttonClass="p-2 rounded-full focus:outline-none focus:bg-zinc-200 hover:bg-zinc-100"
+ buttonClass="p-2 rounded-full focus:outline-none focus:bg-neutral-200 hover:bg-neutral-100 dark:focus:bg-neutral-600 dark:hover:bg-neutral-700"
buttonTestId="user-settings-button"
>
<ods-settings-icon button-content />
diff --git a/alfa-service/src/main/java/de/ozgcloud/alfa/Root.java b/alfa-service/src/main/java/de/ozgcloud/alfa/Root.java
index 70e3fe283ff28e4bbc8dabe9b74030c8ea684811..297a9b071ea87d278e7d1070d0d3485351d11180 100644
--- a/alfa-service/src/main/java/de/ozgcloud/alfa/Root.java
+++ b/alfa-service/src/main/java/de/ozgcloud/alfa/Root.java
@@ -30,6 +30,7 @@ import org.springframework.boot.info.BuildProperties;
import lombok.AllArgsConstructor;
import lombok.Builder;
+import lombok.Getter;
@Builder
@AllArgsConstructor
@@ -37,6 +38,8 @@ public class Root {
private BuildProperties buildProperties;
private boolean production;
+ @Getter
+ private String barrierefreiheitUrl;
public String getVersion() {
return Objects.isNull(buildProperties) ? "--" : buildProperties.getVersion();
@@ -53,4 +56,5 @@ public class Root {
public boolean getProduction() {
return production;
}
+
}
diff --git a/alfa-service/src/main/java/de/ozgcloud/alfa/RootController.java b/alfa-service/src/main/java/de/ozgcloud/alfa/RootController.java
index 008356febad31e71c81508130fa6831621d61dde..a748d74394fca5db9c12005a0736d1df44ca0113 100644
--- a/alfa-service/src/main/java/de/ozgcloud/alfa/RootController.java
+++ b/alfa-service/src/main/java/de/ozgcloud/alfa/RootController.java
@@ -44,6 +44,8 @@ public class RootController {
private BuildProperties buildProperties;
@Value("${ozgcloud.stage.production:#{true}}")
private boolean production = true;
+ @Autowired
+ private RootProperties rootProperties;
@GetMapping
public EntityModel<Root> getRoot() {
@@ -51,6 +53,10 @@ public class RootController {
}
private Root buildRoot() {
- return new Root(buildProperties, production);
+ return Root.builder()
+ .buildProperties(buildProperties)
+ .production(production)
+ .barrierefreiheitUrl(rootProperties.getBarrierefreiheitUrl())
+ .build();
}
}
\ No newline at end of file
diff --git a/alfa-service/src/main/java/de/ozgcloud/alfa/RootProperties.java b/alfa-service/src/main/java/de/ozgcloud/alfa/RootProperties.java
new file mode 100644
index 0000000000000000000000000000000000000000..f7ee39c56bf930751ee50c5dbce7244f6c00da03
--- /dev/null
+++ b/alfa-service/src/main/java/de/ozgcloud/alfa/RootProperties.java
@@ -0,0 +1,20 @@
+package de.ozgcloud.alfa;
+
+import org.springframework.boot.context.properties.ConfigurationProperties;
+import org.springframework.context.annotation.Configuration;
+
+import lombok.Getter;
+import lombok.Setter;
+
+@Setter
+@Getter
+@Configuration
+@ConfigurationProperties(prefix = "ozgcloud")
+class RootProperties {
+
+ /**
+ * URL pointing to the site with information about accessibility (Barrierefreiheit).
+ */
+ private String barrierefreiheitUrl;
+
+}
diff --git a/alfa-service/src/test/java/de/ozgcloud/alfa/RootControllerTest.java b/alfa-service/src/test/java/de/ozgcloud/alfa/RootControllerTest.java
index 26dfe365c2757821039da7bfba8e2b0f3acb7c94..d5a33f093432974751ff02c0b0803b5e6cec00dd 100644
--- a/alfa-service/src/test/java/de/ozgcloud/alfa/RootControllerTest.java
+++ b/alfa-service/src/test/java/de/ozgcloud/alfa/RootControllerTest.java
@@ -44,6 +44,8 @@ import org.springframework.test.web.servlet.MockMvc;
import org.springframework.test.web.servlet.ResultActions;
import org.springframework.test.web.servlet.setup.MockMvcBuilders;
+import lombok.SneakyThrows;
+
class RootControllerTest {
@Spy
@@ -53,6 +55,8 @@ class RootControllerTest {
private BuildProperties properties;
@Mock
private RootModelAssembler modelAssembler;
+ @Mock
+ private RootProperties rootProperties;
private MockMvc mockMvc;
@@ -61,36 +65,47 @@ class RootControllerTest {
mockMvc = MockMvcBuilders.standaloneSetup(controller).build();
when(modelAssembler.toModel(any())).thenAnswer(i -> EntityModel.of(i.getArguments()[0]));
+ when(rootProperties.getBarrierefreiheitUrl()).thenReturn(RootTestFactory.BARRIEREFREIHEIT_URL);
}
@DisplayName("Root")
@Nested
class TestRoot {
+ @SneakyThrows
@Test
- void shouldHaveJavaVersion() throws Exception {
+ void shouldHaveJavaVersion() {
doRequest().andExpect(jsonPath("$.javaVersion").exists());
}
+ @SneakyThrows
@Test
- void shouldHaveVersion() throws Exception {
+ void shouldHaveVersion() {
when(properties.getVersion()).thenReturn("42");
doRequest().andExpect(jsonPath("$.version").value("42"));
}
+ @SneakyThrows
@Test
- void shouldHaveBuildTime() throws Exception {
+ void shouldHaveBuildTime() {
when(properties.getTime()).thenReturn(LocalDateTime.parse("2021-04-01T10:30").toInstant(ZoneOffset.UTC));
doRequest().andExpect(jsonPath("$.buildTime").exists());
}
+ @SneakyThrows
@Test
- void shouldHavelProduction() throws Exception {
+ void shouldHaveProduction() {
doRequest().andExpect(jsonPath("$.production").exists());
}
+ @SneakyThrows
+ @Test
+ void shouldHaveBarrierefreiheitUrl() {
+ doRequest().andExpect(jsonPath("$.barrierefreiheitUrl").value(RootTestFactory.BARRIEREFREIHEIT_URL));
+ }
+
private ResultActions doRequest() throws Exception {
return mockMvc.perform(get(RootController.PATH)).andExpect(status().isOk());
}
diff --git a/alfa-service/src/test/java/de/ozgcloud/alfa/RootTestFactory.java b/alfa-service/src/test/java/de/ozgcloud/alfa/RootTestFactory.java
index aaf74c0a6e8dcb38abc29443568c1faf88fcf0bb..858aa28e9cbf3cf9991ee5e687eec0a0caef9d39 100644
--- a/alfa-service/src/test/java/de/ozgcloud/alfa/RootTestFactory.java
+++ b/alfa-service/src/test/java/de/ozgcloud/alfa/RootTestFactory.java
@@ -25,11 +25,13 @@ package de.ozgcloud.alfa;
public class RootTestFactory {
+ public static final String BARRIEREFREIHEIT_URL = "https://barrierefreiheit.de/";
+
public static Root create() {
return createBuilder().build();
}
public static Root.RootBuilder createBuilder() {
- return Root.builder();
+ return Root.builder().barrierefreiheitUrl(BARRIEREFREIHEIT_URL);
}
}
diff --git a/src/main/helm/templates/deployment.yaml b/src/main/helm/templates/deployment.yaml
index 19508dd28a03b2ea0be60fe4e12bd93b3aa6538c..6a6605eec6fa1436022ef090c6bb235b1b4d7c49 100644
--- a/src/main/helm/templates/deployment.yaml
+++ b/src/main/helm/templates/deployment.yaml
@@ -121,6 +121,10 @@ spec:
- name: ozgcloud_feature_collaborationEnabled
value: {{ ((.Values.ozgcloud).feature).collaborationEnabled | quote }}
{{- end }}
+ {{- if (.Values.ozgcloud).barrierefreiheitUrl }}
+ - name: ozgcloud_barrierefreiheitUrl
+ value: {{ (.Values.ozgcloud).barrierefreiheitUrl }}
+ {{- end }}
image: "{{ .Values.image.repo }}/{{ .Values.image.name }}:{{ coalesce (.Values.image).tag "latest" }}"
imagePullPolicy: Always
diff --git a/src/test/helm/deployment_collaboration_env_test.yaml b/src/test/helm/deployment_collaboration_env_test.yaml
index b8f58a1902c8a18ffe9ff1dbe3e05849f4dc6eeb..aa8eef87179703713d05b570b31285c099510bc0 100644
--- a/src/test/helm/deployment_collaboration_env_test.yaml
+++ b/src/test/helm/deployment_collaboration_env_test.yaml
@@ -87,4 +87,14 @@ tests:
path: spec.template.spec.containers[0].env
content:
name: grpc_client_zufi-manager_negotiationType
- value: TLS
\ No newline at end of file
+ value: TLS
+ - it: should have barrierefreiheitUrl
+ set:
+ ozgcloud:
+ barrierefreiheitUrl: http://barrierefreiheit.url
+ asserts:
+ - contains:
+ path: spec.template.spec.containers[0].env
+ content:
+ name: ozgcloud_barrierefreiheitUrl
+ value: http://barrierefreiheit.url
\ No newline at end of file