Jump to content

Everybody is choosing "Night Mode" nowadays....


Recommended Posts

I'm personally mixed on your dark mode suggestion ... but not because I wouldn't want a dark mode.  In fact, on my smartphone I use a blue light filter and switch to dark mode for many apps.  I love dark mode to ease the strain on my eyes.  

Keep in mind that for all of your examples of dark mode, the developer controls one user experience for all users. 

For IPS communities, however, individual communities can develop and customize the theming to their hearts content, and that can include any variations like regular or dark mode.  

Will IPS earn major street cred for coming out with dark mode? Yes.  But is it something they need to do or should it be left up to the themers? That's a little more nuanced.  

Link to comment
Share on other sites

I think the fact that IPS is themable negates the need for a "dark mode" which is popular with apps today. Perhaps if IPS provided a dark version of the default theme...

If an application-level dark mode was implemented, then theme creators would have to support it with dark mode CSS for their themes - which raises the question - would an already dark theme go reverse in dark mode (e.g., light mode)? 😀

Link to comment
Share on other sites

17 minutes ago, Joy Rex said:

I think the fact that IPS is themable negates the need for a "dark mode" which is popular with apps today. Perhaps if IPS provided a dark version of the default theme...

If an application-level dark mode was implemented, then theme creators would have to support it with dark mode CSS for their themes - which raises the question - would an already dark theme go reverse in dark mode (e.g., light mode)? 😀

I disagree. I fully support have a native dark theme from IPS and I don't think theme devs would have to cater to creating a dark mode for there themes. If you don't want to use the IPS light or dark theme then buy a theme and upload it. I use custom themes, thank goodness @TAMAN more or less makes a light and dark version of hiis Gradient theme. Would I still use it if IPS made a native dark theme? I would at this point because its a great theme and he supports it well, but to be honest I wouldn't have went to it if IPS offered dark out of the box and if the time comes it's no longer supported I will be quite vocal for an IPS dark theme.

Link to comment
Share on other sites

19 hours ago, JustHatched said:

I disagree. I fully support have a native dark theme from IPS and I don't think theme devs would have to cater to creating a dark mode for there themes. If you don't want to use the IPS light or dark theme then buy a theme and upload it. I use custom themes, thank goodness @TAMAN more or less makes a light and dark version of hiis Gradient theme. Would I still use it if IPS made a native dark theme? I would at this point because its a great theme and he supports it well, but to be honest I wouldn't have went to it if IPS offered dark out of the box and if the time comes it's no longer supported I will be quite vocal for an IPS dark theme.

What I meant is if IPS offered a Dark Mode via an application switch, not a theme, any theme (including IPS own theme) would need to support it otherwise at best, nothing happens when the switch is toggled, and at worst the theme breaks or is rendered unreadable because of white text on a white background, etc.

I suppose a Dark Mode would really just be a theme switch anyway, but there would still need to be the requisite CSS to support it.

Link to comment
Share on other sites

40 minutes ago, Joy Rex said:

I suppose a Dark Mode would really just be a theme switch anyway, but there would still need to be the requisite CSS to support it.

I support this idea. Also, on mobile, it would be nice to increase the default font-size for pages. This would help a bunch for those with less than 20/20 vision, myself included. I hate having to zoom the page to read text comfortably since the entire width of the page no longer shows in the viewport (leading to a bunch of swiping left and right). Perhaps a Switch to Dark mode and an increase default font-size could be added to the hamburger menu to quickly control these theme settings by the user.

Link to comment
Share on other sites

On 2/26/2019 at 11:09 AM, KT Walrus said:

I support this idea. Also, on mobile, it would be nice to increase the default font-size for pages. This would help a bunch for those with less than 20/20 vision, myself included. I hate having to zoom the page to read text comfortably since the entire width of the page no longer shows in the viewport (leading to a bunch of swiping left and right). Perhaps a Switch to Dark mode and an increase default font-size could be added to the hamburger menu to quickly control these theme settings by the user.

The new thing these days is Responsive Font Sizes (the font size adjusts to the kind of display/viewport you are on) - frameworks like Bootstrap are starting to incorporate them.

Also, on your mobile device, you should be able to increase the font size globally (and I would think the browser/website would honor that as well?)...

Link to comment
Share on other sites

On 2/25/2019 at 6:11 PM, Joel R said:

For IPS communities, however, individual communities can develop and customize the theming to their hearts content, and that can include any variations like regular or dark mode.  

True, but it’s a ball ache creating a dark theme, the editor in particular. I must have started one at least 5 times and gave up as there’s so many areas and pages fearing that by time I finished 5.0 would be released.

How many customers don’t feel comfortable using web inspect and creating a custom.css file so end up using the default theme with a logo uploaded? Fair few I would imagine.

IPS are really missing a trick not bundling in a Night Mode in the package and using it as a selling point, would it take those that created the templates that long to create one? A day or two maybe, being generous allowing for coffee and toilet breaks. 

Twitter has by far the best night mode on any site, the dark blue would be a nice alternative to the default IPS white and blue theme.

Link to comment
Share on other sites

I'd agree. Personally I kinda prefer a light theme. But seriously, if its as easy as they say "just edit the css" then IPS should get an intern on that job every new release and make it in-box so we all have a template to build from. It's awful trying to do it from scratch at the moment - all the relevant colours aren't even in the theme editor. Hello, ".ipsBox" I'm looking at you!

Edited by AutoItScript
Link to comment
Share on other sites

17 hours ago, dayh said:

A day or two maybe, being generous allowing for coffee and toilet breaks. 

No, much longer. I refactored the CSS to accommodate a night theme fueled by only theme color changes (that's to say in the theme admin tabs). You have to change a ton of hard-coded calls into one of a selection of set tints/colours set in the theme admin. You also have to figure out which elements to invert and which ones should not. It was a lot of work! It would be good to have the default theme be easily switchable like that but it's not a small job. I also converted all pixel calls to rem. That was comparatively easy 🙂

Link to comment
Share on other sites

On 2/28/2019 at 8:05 AM, David T. Cole said:

ou have to change a ton of hard-coded calls into one of a selection of set tints/colours set in the theme admin. You also have to figure out which elements to invert and which ones should not. It was a lot of work! It would be good to have the default theme be easily switchable like that but it's not a small job

^ True that.

We are working on creating a "dark them" for our community. I have some members messaging me the suggested edits as I work on it. But oh my goodness is this a chore! While we will probably keep the results to ourselves, I now appreciate fully the prices that many of the themes run for in the Marketplace. In fact, I'd have been better off just buying one, lol.

Link to comment
Share on other sites

Personally, I like the idea of a "dark mode" and it's something that IPS should consider. Why? Because, like a lot of people out there, I suffer from eye strain. My eyes are sensitive to bright light so having a dark mode is much easier and more relaxing on my eyes. Many people suffer from this. But, I also think that this is something that should be offered on the front end where the end user can select the option through their user account.

Keep in mind that I don't think it should be added just because "everyone else is using it". But, only from the perspective that it would make for a more comfortable experience for the end users. Eye strain is a major problem in just about every country out there whose people surf the internet these days. I look at it more as an "accessibility" issue rather than "just because everyone else doing it".

Edited by Rheddy
Link to comment
Share on other sites

Sat down this morning, 9am UK time and thought I'm doing a night mode, it's happening.

It's now almost 8pm and I'm 98% there.

Although I must confess I took a 2hr afternoon nap.

It all comes down to this editor toolbar, the image sprite has all kinds of shading on the icons so it's not a simple whack a white layer on the top. 😫

1535805581_Screenshot2019-03-08at19_46_47.thumb.png.2d9ce85f68fe47113869e0e9e465cc81.png

Also I need to figure out how to darken the lazy loading backgrounds whilst loading in as it's bright white, and taking a few screenshots just now I'll probably change the follow button and that's it.

Possible but like I said earlier, a real ball ache.

Link to comment
Share on other sites

@dayh I overwrote the editor icon calls with CSS using FontAwesome icons like so:

.cke_button__bold:after {
background: none !important;
font-size: 1.4rem !important;
font-family: "FontAwesome";
content: "\f032";
position: relative;
top: 0rem;
left: 0rem;
}

FontAwesome 4.7 cheatsheet: https://fontawesome.com/v4.7.0/cheatsheet/

1500474691_TestingTags2Againening-TestZone-Previously.TVForums2019-03-0906-53-47.thumb.png.54fb9eac9b19119ead6e32ff2c9b55e7.png

342622769_TestingTags2Againening-TestZone-Previously.TVForums2019-03-0906-54-16.thumb.png.cbbdfdea42130d1ad77295c373e9ac29.png

Edited by David T. Cole
Link to comment
Share on other sites

7 minutes ago, David T. Cole said:

@dayh I overwrote the editor icon calls with CSS using FontAwesome icons like so:


.cke_button__bold:after {
background: none !important;
font-size: 1.4rem !important;
font-family: "FontAwesome";
content: "\f032";
position: relative;
top: 0rem;
left: 0rem;
}

FontAwesome 4.7 cheatsheet: https://fontawesome.com/v4.7.0/cheatsheet/

Nice one, will take a look at doing this, pretty much done now apart from this and embedded content. Although saying that I thought I was almost done several times then something else pops up I've missed. 

Link to comment
Share on other sites

Just now, dayh said:

Although saying that I thought I was almost done several times then something else pops up I've missed.

Ha yes, the last 2% took forever. I ended up troubleshooting by replacing all the default color calls in the theme admin to hot pink to see what I wasn't overriding.

Link to comment
Share on other sites

4 minutes ago, David T. Cole said:

Ha yes, the last 2% took forever. I ended up troubleshooting by replacing all the default color calls in the theme admin to hot pink to see what I wasn't overriding.

I've just ran an invert tool in Pixelmator on the Mac and it's actually saved me a bunch of CSS overwrites.

Uploaded the file if it's any use for anyone looking to take the challenge on.

 

icons_hidpi.thumb.png.9380fb71770540f384dfb9e5ba2ec2ca.png

Link to comment
Share on other sites

Dark mode would be quite useful, but IPS by default should have a white theme. It would be good if designers and themers would get some more flexibility when switching a theme from light to dark with a simple press of a button.

Link to comment
Share on other sites

4 minutes ago, Teddy Rogers said:

That looks good and work much better on mobile, particularly at night.

Hopefully IPS picks up on this and is willing to support a dark theme in their next release...

Ted.

I released it to the members last night, even with the few bits remaining and they all loved it.

Not being funny but if I can bodge something together in a day and half, the developers shouldn't have too many problems. 

Members comments > https://dcfcfans.uk/topic/31826-dcfc-fans-night-mode-beta/

And here's the 99.9% finished look.

Beqi0hC.png

4OHqg5c.png

O7h7Egl.png

M8uCVNO.png

Link to comment
Share on other sites

1 hour ago, dayh said:

Uploaded the file if it's any use for anyone looking to take the challenge on.

I snagged that. Thank you. The Editor Toolbar was giving me trouble. I kept trying to change the color of the icons but wasn't happy with the results. Then I tried uploading other CKEditor Skins and they weren't all that great either. My approach to the above has been to create my own CKEditor Skin and edit the CSS of those, then Import it. The icons will really help.

Link to comment
Share on other sites

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...