Skip to content

Commit 1520fd0

Browse files
committed
fix: replace button with 'cds-icon-button' to include tooltip
Signed-off-by: Akshat Patel <akshat@live.ca>
1 parent 3638ed0 commit 1520fd0

File tree

1 file changed

+20
-8
lines changed

1 file changed

+20
-8
lines changed

src/modal/modal-header.component.ts

Lines changed: 20 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -22,14 +22,18 @@ import { I18n } from "carbon-components-angular/i18n";
2222
template: `
2323
<header class="cds--modal-header {{theme}}">
2424
<ng-content></ng-content>
25-
<button
26-
*ngIf="showCloseButton"
27-
type="button"
28-
class="cds--modal-close"
29-
(click)="onClose()">
30-
<span class="cds--assistive-text">{{ closeLabel }}</span>
31-
<svg cdsIcon="close" size="20" class="cds--modal-close__icon"></svg>
32-
</button>
25+
<div class="cds--modal-close-button">
26+
<cds-icon-button
27+
*ngIf="showCloseButton"
28+
type="button"
29+
[buttonNgClass]="buttonNgClass"
30+
[buttonAttributes]="buttonAttributes"
31+
align="left"
32+
[description]="closeLabel"
33+
(click)="onClose()">
34+
<svg cdsIcon="close" size="20" class="cds--modal-close__icon"></svg>
35+
</cds-icon-button>
36+
</div>
3337
</header>
3438
3539
`
@@ -55,6 +59,14 @@ export class ModalHeader {
5559
*/
5660
@Output() closeSelect = new EventEmitter();
5761

62+
buttonNgClass = {
63+
"cds--modal-close": true
64+
};
65+
66+
buttonAttributes = {
67+
"aria-label": this.i18n.get().MODAL.CLOSE
68+
};
69+
5870
constructor(protected i18n: I18n) {}
5971

6072
/**

0 commit comments

Comments
 (0)