Skip to content

Change <a role="button"> controls to <button type="button"> #473

@Malvoz

Description

@Malvoz

It's recommended to use <button> instead of <a role="button">. We should change the use of <a> in all places we've introduced them:

  • Context menu items
  • Popup navigation controls
  • Reload button
  • Remove Layer button
  • ...?

This would require a CSS reset to make buttons look seamless by default, e.g.:

.mapml-button {
  background-color: transparent;
  border: none;
  border-radius: 0;
  color: inherit;
  font: inherit;
  line-height: inherit;
  margin: 0;
  padding: 0;
  overflow: hidden;
  text-align: left;
  text-align: inline-start;
  text-transform: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

(This generic button class was originally proposed in #263 (comment).)

Info on <a> vs <button>:

This issue relates to #19 (same problem but keeping the issues separate as that one pertains to Leaflet's controls).

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions