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

19449 prefers color scheme #20886

Merged
merged 22 commits into from
Oct 13, 2022
Merged

19449 prefers color scheme #20886

merged 22 commits into from
Oct 13, 2022

Conversation

bsmth
Copy link
Member

@bsmth bsmth commented Sep 19, 2022

Background:
Embedded SVGs and iframes can now use prefers-color-scheme media query to add styles that inherit (depend on) the color-scheme of the embedding element.

This PR adds details about embedded elements and how media queries can be used to control how embedded elements are styled based on embedding elements. There's an additional example that shows default functionality (browser or OS prefs) and then explicit styling based on the parent (embedding) element.

Other issues and PRs:

@bsmth bsmth requested review from a team as code owners September 19, 2022 09:51
@bsmth bsmth requested review from estelle and removed request for a team September 19, 2022 09:51
@github-actions github-actions bot added the Content:CSS Cascading Style Sheets docs label Sep 19, 2022
@github-actions
Copy link
Contributor

github-actions bot commented Sep 19, 2022

Preview URLs

(this comment was updated 2022-10-13 08:06:12.550723)

@hamishwillee
Copy link
Collaborator

I'm away until Monday. @estelle would perhaps be a better person to review CSS.

Co-authored-by: Estelle Weyl <estelle@openwebdocs.org>
@bsmth bsmth requested a review from estelle October 10, 2022 12:44
Copy link
Member

@estelle estelle left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some more feedback

@bsmth
Copy link
Member Author

bsmth commented Oct 13, 2022

Some more feedback

Thank you, incorporating the comments now.

@bsmth bsmth requested a review from estelle October 13, 2022 08:03
Copy link
Member

@estelle estelle left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

committed my one grammar change. looks good!

@estelle estelle merged commit b85094c into mdn:main Oct 13, 2022
@bsmth bsmth deleted the 19449-prefers-color-scheme branch October 14, 2022 08:09
@bsmth
Copy link
Member Author

bsmth commented Oct 14, 2022

Thanks, Estelle 🙌🏻

mfuji09 pushed a commit to mfuji09/MDN-content that referenced this pull request Oct 20, 2022
* docs(CSS): prefers-color-scheme for embedded content

* docs(CSS): minor fix for coloer-scheme

* chore(build) replace Prettier config

* docs(CSS): add example of embedded SVG for prefers-color-scheme

* docs(CSS): add xrefs for color-scheme & prefers-color-scheme

* docs(CSS): improve wording for prefers-color-scheme docs

* typo fix

* docs(CSS) add details on secure animated mode for SVGs

* Update files/en-us/web/css/@media/prefers-color-scheme/index.md

Co-authored-by: Estelle Weyl <estelle@openwebdocs.org>

* Update files/en-us/web/css/@media/prefers-color-scheme/index.md

Co-authored-by: Estelle Weyl <estelle@openwebdocs.org>

* chore(docs) Clarify embedded SVG details, links to supporting docs

* Apply suggestions from code review

Co-authored-by: Estelle Weyl <estelle@openwebdocs.org>

* docs(CSS): Link to more appropriate inline SVG example, minor copy fix

* grammar

Co-authored-by: Estelle Weyl <estelle@openwebdocs.org>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Content:CSS Cascading Style Sheets docs
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants