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

support dark/night mode #466

Open
hawkeye116477 opened this issue Sep 9, 2018 · 7 comments
Open

support dark/night mode #466

hawkeye116477 opened this issue Sep 9, 2018 · 7 comments
Labels
ui

Comments

@hawkeye116477
Copy link
Contributor

@hawkeye116477 hawkeye116477 commented Sep 9, 2018

Feature Request

Can you make dark version of page and add switch for dark/light version of page?
Value should be saved somewhere (local storage/cookies) when user switch to dark/light mode of course.

@collinbarrett

This comment has been minimized.

Copy link
Owner

@collinbarrett collinbarrett commented Sep 9, 2018

lol. Probably super low priority, but could be cool. I love dark modes of apps. Not sure I would personally spend any time implementing in the near future, but if any css guru wants to submit a PR, it would definitely be welcomed.

@collinbarrett collinbarrett changed the title Dark version of page support dark/night mode Sep 9, 2018
@hawkeye116477

This comment has been minimized.

Copy link
Contributor Author

@hawkeye116477 hawkeye116477 commented Sep 10, 2018

@collinbarrett I don't know where it should go, but maybe something like this.
screenshot_20180909_231646

FilterListsDark.css

setDarkLightMode.js

and example css for switcher button:

#switcher {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

#switcher li {
    float: left;
    width: 30px;
    height: 30px;
    margin: 0 15px 15px 0;
    border-radius: 30px;
    border: 3px solid black;
    background: black;
}

and example html:

<ul id="switcher">
    <li id="darkLightButton" title="Dark / light mode"></li>
</ul>

Almost the same thing I done on https://polishannoyancefilters.netlify.com/ 😄 .

@collinbarrett

This comment has been minimized.

Copy link
Owner

@collinbarrett collinbarrett commented Sep 10, 2018

Ah, ok, very cool. I'll play around with that.

@elypter

This comment has been minimized.

Copy link

@elypter elypter commented Sep 11, 2018

i wished browsers had a way to tell websites that they want to operate in darkmode

hawkeye116477 pushed a commit to hawkeye116477/FilterLists that referenced this issue Sep 17, 2018
hawkeye116477 pushed a commit to hawkeye116477/FilterLists that referenced this issue Sep 17, 2018
Hoping to fix collinbarrett#466
@collinbarrett

This comment has been minimized.

Copy link
Owner

@collinbarrett collinbarrett commented Oct 11, 2018

Here's a generic tool to enable this on any site if anyone wants it: https://darkreader.org/

Still may add to FilterLists natively at some point, but super low priority. If somebody wants to submit a PR, I'd happily accept it, though.

@hawkeye116477

This comment has been minimized.

Copy link
Contributor Author

@hawkeye116477 hawkeye116477 commented Oct 11, 2018

I recently also uploaded my style to https://userstyles.org/styles/164059/filterlist-s-dark-mode, so it can be used with Stylus 😄.

hawkeye116477 pushed a commit to hawkeye116477/FilterLists that referenced this issue Feb 4, 2019
hawkeye116477 pushed a commit to hawkeye116477/FilterLists that referenced this issue Feb 4, 2019
@collinbarrett

This comment has been minimized.

Copy link
Owner

@collinbarrett collinbarrett commented Sep 4, 2019

https://hub.filterlists.com/t/dark-mode-for-filterlists/51

Definitely would be great to get this built right into the site... I'll look into that when I can.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
3 participants
You can’t perform that action at this time.