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.

Sign up for GitHub

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

Jump to bottom

Dark Mode support #89

Closed
jessesquires opened this issue Mar 13, 2019 · 1 comment
Closed

Dark Mode support #89

jessesquires opened this issue Mar 13, 2019 · 1 comment
Labels
enhancement infra

Comments

@jessesquires
Copy link
Owner

jessesquires commented Mar 13, 2019 •
edited
Loading

EDIT:

It looks like eventually bootstrap will support this:
twbs/bootstrap#27514

https://kevinchen.co/blog/support-macos-mojave-dark-mode-on-websites/

example:
SwiftWeekly/swiftweekly.github.io@b78a750

Will also need to address #58 as part of this.
@jessesquires jessesquires self-assigned this Mar 13, 2019
@jessesquires jessesquires changed the title Website "dark mode" css Dark Mode support Apr 6, 2020
@jessesquires jessesquires mentioned this issue Jan 8, 2021
Closed
3 tasks
@jessesquires jessesquires removed their assignment May 26, 2021
@jessesquires
Copy link
Owner Author

jessesquires commented Jun 7, 2021 •
edited
Loading

A basic proof of concept:

in the <head>

<meta name="color-scheme" content="light dark">

sass

body {
    @media (prefers-color-scheme: dark) {
        background-color: $dark;
        color: $light;
     }
}

Things that break:

  • usage of .bg-light, tables, image background and border colors, code, blockquotes

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
enhancement infra
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@jessesquires