VladPolskiy/leaflet
1
0
Fork 0
mirror of https://github.com/Leaflet/Leaflet.git synced 2025-08-20 14:34:38 +00:00
Code Issues Packages Projects Releases 1 Wiki Activity

Accessibility popup close button (#7794)

Browse Source 
* Change color of close button #7539

* Add role=button and aria-label #7399

* Add aria-hidden to `times` / `x` #7472

* remove bold on close button

Co-authored-by: Vladimir Agafonkin <agafonkin@gmail.com>
This commit is contained in:
Falke Design
2021-11-25 18:50:18 +01:00
committed by GitHub
parent c6c82f07c5
commit 1180e7e8c2
2 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
dist/leaflet.css vendored
View File

@ -526,13 +526,12 @@ svg.leaflet-image-layer.leaflet-interactive path {
width: 18px;
height: 14px;
font: 16px/14px Tahoma, Verdana, sans-serif;
color: #c3c3c3;
color: #757575;
text-decoration: none;
font-weight: bold;
background: transparent;
}
.leaflet-container a.leaflet-popup-close-button:hover {
color: #999;
color: #585858;
}
.leaflet-popup-scrolled {
overflow: auto;

4
src/layer/Popup.js
View File

@ -190,8 +190,10 @@ export var Popup = DivOverlay.extend({
if (this.options.closeButton) {
var closeButton = this._closeButton = DomUtil.create('a', prefix + '-close-button', container);
closeButton.setAttribute('role', 'button'); // overrides the implicit role=link of <a> elements #7399
closeButton.setAttribute('aria-label', 'Close popup');
closeButton.href = '#close';
closeButton.innerHTML = '&#215;';
closeButton.innerHTML = '<span aria-hidden="true">&#215;</span>';
DomEvent.on(closeButton, 'click', this._close, this);
}