Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add native appearance to map element(s) #108

Merged
merged 2 commits into from
Jul 13, 2020
Merged

Add native appearance to map element(s) #108

merged 2 commits into from
Jul 13, 2020

Conversation

Malvoz
Copy link
Member

@Malvoz Malvoz commented Jul 13, 2020

  • Add default size of 300x150px to the map element(s)
  • Restore default UA outline styles for accessible sequential navigation
  • Enable author controlled background-color on the map element(s)
  • Pre-style to mitigate FOUC

The new default styles together with the pre-styling have been carefully crafted to ensure that:

  • Default styles of the map element(s) are only applied when custom elements is supported (using the :defined selector), and with a low CSS specificity such that authors can easily override to customize it (e.g. width, height, border, background-color).
  • Fallback content is only displayed when JS is disabled/custom elements not supported, otherwise they're hidden
    (caveat: <img usemap=""> must come after <map> in the DOM order to prevent FOUC).
  • No need for <layer- style="display: none"> or <map hidden> on every element to prevent FOUC.

@prushforth Please try it out locally (perhaps with added fallback content/inline layers/unsupporting browser and JS disabled to get the full experience 😅) and let me know what you think.

- Add default size of 300x150px to the map element(s)
- Restore default UA outline styles for accessible sequential navigation
- Enable author controlled background-color on the map element(s)
- Pre-style to mitigate FOUC
@Malvoz Malvoz requested a review from prushforth July 13, 2020 15:23
src/mm-mapp.js Outdated Show resolved Hide resolved
@prushforth prushforth merged commit 5f4ebde into Maps4HTML:master Jul 13, 2020
@prushforth
Copy link
Member

Robert: Looks good to me! Thanks for your help.

@Malvoz Malvoz deleted the native-appearance branch September 6, 2020 17:45
@Malvoz Malvoz added the basic styling Elements should only have basic and native-like styling (W3C TAG Components Guideline) label Oct 26, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
basic styling Elements should only have basic and native-like styling (W3C TAG Components Guideline)
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants