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

Automatic dark/light colorschemes #234

Merged
merged 2 commits into from Nov 21, 2019

Conversation

@thesmiley1
Copy link
Contributor

thesmiley1 commented Nov 7, 2019

Prerequisites

Put an x into the box(es) that apply:

  • This pull request fixes a bug.
  • This pull request adds a feature.
  • This pull request introduces breaking change.

Description

A new colorscheme option is added with the capability to be always dark,
always light, or automatic based on the user's browser setting. This
makes the inverted option superfluous, and therefore deprecated.
Nomenclature of files, variables, etc are changed from inverted to
dark to reflect this change.

Issues Resolved

Resolves #226.

Checklist

Put an x into the box(es) that apply:

General

  • Describe what changes are being made
  • Explain why and how the changes were necessary and implemented respectively
  • Reference issue with #<ISSUE_NO> if applicable

Resources

  • If you have changed any SCSS code, run make release to regenerate all CSS files

I did so, but there is no change to generated css files. It seems the reason for that is because dark (and rtl) options are not enabled in the demo config, so they get excluded in baseof.html. Is this intentional?

Contributors

  • Add yourself to CONTRIBUTORS.md if you aren't on it already
@thesmiley1

This comment has been minimized.

Copy link
Contributor Author

thesmiley1 commented Nov 7, 2019

There are a few things worth noting:

Adding a dark option makes the inverted option superfluous and it wasn't clear to me what the compatibility expectation would be. I chose to leave the inverted option functioning as is, but marked as deprecated.

I was unable to find a way to completely avoid duplicating styles. If I understand correctly, it is not possible because it is not possible to combine selectors and media queries. Sass mixins keep the source dry, but some styles are repeated in the final output.

I touched more than I had originally intended to in the spirit of embracing "dark" over "inverted", by changing file/variable/style names from "inverted" to "dark".

@luizdepra

This comment has been minimized.

Copy link
Owner

luizdepra commented Nov 11, 2019

Hey! Thank you for the PR.
I'm kinda busy right now, but I'll try to take a look at this PR late this week.

@luizdepra

This comment has been minimized.

Copy link
Owner

luizdepra commented Nov 20, 2019

Ok, @thesmiley1. This PR looks fine.
About the inverted config, do you mind removing it in this PR?
There is no problem if you can't do it right now. I can merge this PR and remove this config later.

@thesmiley1

This comment has been minimized.

Copy link
Contributor Author

thesmiley1 commented Nov 20, 2019

Sure, I will put something together soon.

thesmiley1 added 2 commits Nov 7, 2019
A new `colorscheme` option is added with the capability to be always dark,
always light, or automatic based on the user's browser setting.  This
makes the `inverted` option superfluous, and therefore deprecated.
Nomenclature of files, variables, etc are changed from `inverted` to
`dark` to reflect this change.

Closes #226.
The `inverted` option is now not just deprecated, but removed
completely.
@thesmiley1 thesmiley1 force-pushed the thesmiley1:auto-dark branch from 0606e67 to 6cd8908 Nov 21, 2019
@thesmiley1

This comment has been minimized.

Copy link
Contributor Author

thesmiley1 commented Nov 21, 2019

I pushed another commit to remove the inverted option completely and rebased to fix the merge conflict in CONTRIBUTORS.md.

Copy link
Owner

luizdepra left a comment

Nice. Thank you.

@luizdepra luizdepra merged commit b00b750 into luizdepra:master Nov 21, 2019
5 checks passed
5 checks passed
Header rules No header rules processed
Details
Pages changed 41 new files uploaded
Details
Redirect rules No redirect rules processed
Details
Mixed content No mixed content detected
Details
deploy/netlify Deploy preview ready!
Details
joshuous added a commit to joshuous/hugo-coder that referenced this pull request Nov 26, 2019
* coder/master:
  Add \\( and \\[ as mathjax delimiters (luizdepra#239)
  adding swedish i18n file and adding target for social icons (luizdepra#238)
  Automatic dark/light colorschemes (luizdepra#234)
  Update fontawesome to v5.11.2 in default layout. (luizdepra#236)
  Make LaTeX compatible with MathJax version 3 (luizdepra#230)
  Add Japanese translation (luizdepra#228)
  Adjust dark mode colorscheme (luizdepra#225)
  Italian Translation (luizdepra#221)
  Russian translation (luizdepra#220)
  Turkish translation (luizdepra#218)
  Use updated mathjax provided by jsdelivr. (luizdepra#215)
  Add Stackbit Integration (luizdepra#208)
  fix typo in french translation (luizdepra#213)
  Translate to French (luizdepra#207)
  add support for utteranc.es (luizdepra#205)
  main link does not switch back to default language if in another language (luizdepra#202)
  disqus: fixed issue luizdepra#199 (luizdepra#200)
  Check if commentoUrl is set before using it. (luizdepra#198)
  Commento (luizdepra#196)
  Home rel link (luizdepra#195)
  Translate to Spanish (luizdepra#193)
  Translate to German (luizdepra#192)
  Create zh-cn.toml (luizdepra#189)
  Add .html to partials (luizdepra#188)
  Change relLangURL to safeURL in the header (luizdepra#183)
  Add custom_js site param for enabling custom js (luizdepra#182)
  use safeHTML in footer (luizdepra#181)
  fix taxonomy & multilingual typo (luizdepra#177)
  replace .URL with .RelPermalink (luizdepra#176)
  update normalize version (luizdepra#175)
  updated fontawesome version (luizdepra#174)
  Replace deprecated .Hugo with hugo. (luizdepra#171)
  Fix HTML lang attribute (luizdepra#169)
  Add KaTeX support (luizdepra#164)
  don't show empty See also for series (luizdepra#166)
  Fix empty hrefs in 404 page (luizdepra#162)
  Add see also section to posts footer (luizdepra#152)
  Fix links (luizdepra#154)
  Fix external link on pages list (luizdepra#153)
  Fix HTML5 validation for Google Fonts (luizdepra#151)
  Fix HTML syntax for aria-hidden attribute (luizdepra#148)
  Fix <link/> tag for RSS feeds (luizdepra#149)
  Add OpenGraph to each page (luizdepra#147)
  Remove hugow (luizdepra#146)
  Add missing built css files
  Fix pagination style (luizdepra#145)
  Add pt-br i18n (luizdepra#144)
  Add external link feature for posts (luizdepra#141)
  Fix hidden nav button on inverted (luizdepra#140)
  Easy customize (luizdepra#138)
  Add simple figure style for content class (luizdepra#130)
  Add Twitter Cards to each page (luizdepra#133)
  Fix multilingual home page avatar (luizdepra#134)
  Fix homepage main content section vertical align (luizdepra#118)
  Add missing pages
  Add HUGO_BIN into Makefile
  bug(base-url): change from site url to page url (luizdepra#131)
  Improve icons accessibility (luizdepra#127)
  Upgrade Hugo to v0.52/extended (luizdepra#124)
  Update PR template (luizdepra#125)
  Fix code indent (luizdepra#123)
  Revert flex on body
  Change copyright year to be current (luizdepra#121)
  Update deprecated device-width media queries (luizdepra#120)
  Add trailing slash to remove redirects. (luizdepra#112)
  Accept boolean as well as string (luizdepra#119)
  Add inverted variables option (luizdepra#110)
  Add pull request template (luizdepra#115)
  Remove flexbox on body (luizdepra#114)
  Correct instructions in README.md (luizdepra#111)
  Add CONTRIBUTORS file (luizdepra#101)
  Taxonomy initial commit, tags and categories (luizdepra#90)
  Fixed reference to old variable name (luizdepra#103)
  Enhance post header (luizdepra#100)
  Upgrade Hugo to v0.49.2 (luizdepra#102)
  Adding the ability to have git commit hash in the footer (luizdepra#78)
  Crossorigin=Anonymous on theme css  (luizdepra#97)
  Added link to Hugo project website (luizdepra#92)
  Fix missing Netlify configuration
  Enhance Makefile and Netlify deployment (luizdepra#91)
  Refactor Makefile
  Post refactor to hold everything its own (luizdepra#88)
  Upgrade hugo to 0.49/extended (luizdepra#89)
  Fix social icons
  Improve README
  Update FontAwesome (luizdepra#83)
  Fix assets permalinks
  Add resources folder
  Add dateformat config
  Update images
  Style refactor (luizdepra#77)
  Updated favicon to support alternative file names and paths (luizdepra#81)
  Use hugo-wrapper for demo target of exampleSite (luizdepra#74)
  Fix demo for theme site
  Fix navigation (luizdepra#73)
  Enable RTL layout by providing 'rtl = true' in the config (luizdepra#72)
  Add social icons
  Remove resources folder
  Improve README.
  Add SCSS via Asset Pipeline (luizdepra#65)
  Add style enhancements for AsciiDoc (luizdepra#67)
  Update logos and screenshots
  Mobile menu (luizdepra#63)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
2 participants
You can’t perform that action at this time.