diff --git a/libs/extensions/angular/image-banner/src/image-banner.component.html b/libs/extensions/angular/image-banner/src/image-banner.component.html
index a358192ecd..4e9f5cb2bf 100644
--- a/libs/extensions/angular/image-banner/src/image-banner.component.html
+++ b/libs/extensions/angular/image-banner/src/image-banner.component.html
@@ -85,6 +85,7 @@
[attentionLevel]="backgroundBlur === 'none' ? '3' : '2'"
[showIconOnly]="true"
size="xs"
+ [attr.aria-label]="translations.get('close') + ' ' + title"
>
diff --git a/libs/extensions/angular/image-banner/src/image-banner.component.ts b/libs/extensions/angular/image-banner/src/image-banner.component.ts
index 1721aed232..7d577b77fe 100644
--- a/libs/extensions/angular/image-banner/src/image-banner.component.ts
+++ b/libs/extensions/angular/image-banner/src/image-banner.component.ts
@@ -1,12 +1,13 @@
-import { CommonModule, NgClass } from '@angular/common';
+import { CommonModule } from '@angular/common';
import { Component, EventEmitter, HostBinding, Input, Output } from '@angular/core';
import { CardModule } from '@kirbydesign/designsystem/card';
import { ButtonComponent } from '@kirbydesign/designsystem/button';
import { IconModule } from '@kirbydesign/designsystem/icon';
+import { TranslationService } from '@kirbydesign/designsystem/shared';
@Component({
selector: 'kirby-x-image-banner',
- imports: [CardModule, ButtonComponent, IconModule, NgClass, CommonModule],
+ imports: [CardModule, ButtonComponent, IconModule, CommonModule],
templateUrl: './image-banner.component.html',
styleUrl: './image-banner.component.scss',
})
@@ -53,6 +54,8 @@ export class ImageBannerComponent {
*/
@Output() dismissClick = new EventEmitter();
+ constructor(public translations: TranslationService) {}
+
public bannerClicked(event: Event) {
const eventTarget = event.target as HTMLElement;
const dismissButtonClicked = eventTarget.closest('.dismiss');