Dark mode

All suggestions about TPFC should be posted here. Discussions about changes to TPFC will also be carried out here.
Message
Author
User avatar
Andrew Lee
Posts: 3094
Joined: Sat Feb 04, 2006 9:19 am
Contact:

Re: Dark mode

#31 Post by Andrew Lee »

Oh I see... forgot to mention I was testing out the scenario as pointed out by Midas i.e. click "This app rocks" on any database entry:

screenshot.png

User avatar
Midas
Posts: 6786
Joined: Mon Dec 07, 2009 7:09 am
Location: Sol3

Re: Dark mode

#32 Post by Midas »

Also, let's not forget these unsightly drop-downs (edit entry)...

Image

lwc
Posts: 284
Joined: Tue Jun 26, 2012 10:40 pm
Contact:

Re: Dark mode

#33 Post by lwc »

Please replace style with this revised one, see screenshots.
The submit was because the site used the version that also fits the forum even though it's not used in the forum, so I had to ensure it doesn't screw up forum submit buttons instead of one global submit handling.
Regarding the calendar, it was because the background is an image (and like the original logo it suits only light mode) with a light color as fallback. So my new code removes the whole background statement.

Code: Select all

<style>
@media (prefers-color-scheme: dark) {
  :not(a), input::placeholder {color: white !important; background-color: black !important;}
  a:link:not(.username-coloured) {color: deepskyblue !important;}
  a:visited:not(.username-coloured) {color: pink !important;}
  a:hover:not(.username-coloured) {color: yellow !important;}
  fieldset>input[type="submit"], fieldset>input[type="reset"] {background-image: initial !important;}
  p>input[type="submit"],div>input[type="submit"] {background-color: gray !important;}
  .ui-datepicker-calendar * {background: initial !important;}
}
</style>
Attachments
rate submit.png
dark calendar.png
Last edited by lwc on Sun Jun 02, 2024 9:39 am, edited 2 times in total.

User avatar
Andrew Lee
Posts: 3094
Joined: Sat Feb 04, 2006 9:19 am
Contact:

Re: Dark mode

#34 Post by Andrew Lee »

lwc wrote: Tue May 28, 2024 8:47 am Please replace style with this revised one, see screenshots.
Updated, and tested. Thanks!

User avatar
sl23
Posts: 84
Joined: Fri Jan 02, 2015 6:25 am

Re: Dark mode

#35 Post by sl23 »

Argh! Can someone please help me sort out the dark mode issues!
I tested some themes and like two of them: Lucid Lime and Revolution. But every time I load a page, Lucid Lime selects Light Mode and Revolution selects Dark Mode! Wtf is going on? Is there a setting in User Control Panel for default Dark Mode? I tried changing it via the button at top right of Forum, but this seems temporary.

Thanks for your help.

EDIT: Just tried resetting to the default theme and it keeps going to dark mode now! How do I reset this?
Latest X-Launcher_x64 update - Compiled with Aut2exe_x64.exe v3.3.16.1
Latest X-Launcher_x64 v1.5.4 update - Compiled with Aut2exe_x64.exe v3.2.12.1

User avatar
Midas
Posts: 6786
Joined: Mon Dec 07, 2009 7:09 am
Location: Sol3

Re: Dark mode

#36 Post by Midas »

Well, I've been using the Prosilver theme like forever and there's very little impact in changing modes with it -- only a lighter header background. Would it be suitable for you?

User avatar
sl23
Posts: 84
Joined: Fri Jan 02, 2015 6:25 am

Re: Dark mode

#37 Post by sl23 »

That's much better thanks, but I would like to use a dark mode and my fave was Lucid Lime. It just refuses to stay dark for some reason. Never mind I'll stick with this one ;)
Latest X-Launcher_x64 update - Compiled with Aut2exe_x64.exe v3.3.16.1
Latest X-Launcher_x64 v1.5.4 update - Compiled with Aut2exe_x64.exe v3.2.12.1

lwc
Posts: 284
Joined: Tue Jun 26, 2012 10:40 pm
Contact:

Re: Dark mode

#38 Post by lwc »

Midas wrote: Tue May 28, 2024 5:42 am Also, let's not forget these unsightly drop-downs (edit entry)...
While your screenshot showed just the calendar, it turns out categories/features and Runs on needed fixing to, so please replace the code with this one:

Code: Select all

<style>
@media (prefers-color-scheme: dark) {
  :not(a), input::placeholder {color: white !important; background-color: black !important;}
  a:link:not(.username-coloured) {color: deepskyblue !important;}
  a:visited:not(.username-coloured) {color: pink !important;}
  a:hover:not(.username-coloured) {color: yellow !important;}
  fieldset>input[type="submit"], fieldset>input[type="reset"] {background-image: initial !important;}
  option:checked, [role="listbox"] *:hover, p>input[type="submit"],div>input[type="submit"] {background-color: gray !important;}
  .ui-datepicker-calendar * {background: initial !important;}
}
</style>
Attachments
dark categories.png
dark categories.png (9.58 KiB) Viewed 2268 times
dark additional features.png
dark additional features.png (10.27 KiB) Viewed 2268 times
dark runs on.png
dark runs on.png (11.5 KiB) Viewed 2268 times

User avatar
Andrew Lee
Posts: 3094
Joined: Sat Feb 04, 2006 9:19 am
Contact:

Re: Dark mode

#39 Post by Andrew Lee »

lwc wrote: Sun Jun 02, 2024 9:51 am While your screenshot showed just the calendar, it turns out categories/features and Runs on needed fixing to, so please replace the code with this one...
Updated. Thanks!

-ElCoyot-
Posts: 134
Joined: Thu Sep 02, 2021 4:42 am

Re: Dark mode

#40 Post by -ElCoyot- »

How can I view the forum in light mode without authorization? Without pressing light mode. The dark style is just terrible.

User avatar
Andrew Lee
Posts: 3094
Joined: Sat Feb 04, 2006 9:19 am
Contact:

Re: Dark mode

#41 Post by Andrew Lee »

-ElCoyot- wrote: Fri Jun 14, 2024 9:58 am How can I view the forum in light mode without authorization? Without pressing light mode. The dark style is just terrible.
What do you mean by "without authorization"?

As far as I know, you can simply click on "Light mode" to switch the display:
screenshot.png

-ElCoyot-
Posts: 134
Joined: Thu Sep 02, 2021 4:42 am

Re: Dark mode

#42 Post by -ElCoyot- »

When navigating through the pages, the dark mode is turned on again. Constantly pressing the "Light mode" button gets boring.

lwc
Posts: 284
Joined: Tue Jun 26, 2012 10:40 pm
Contact:

Re: Dark mode

#43 Post by lwc »

So turns out this phpBB extension removes the cookie if you set it to light, which makes no sense. Obviously this old plugin never anticipated people using Dark Mode in their OS level, so it just assumed the default will always be light.

Admins, can you therefore add this line also to the light version?

Code: Select all

		date.setTime(date.getTime() + (365 * 24 * 60 * 60 * 1000));
The blue part is missing there, and should be just identical to the dark one.

It's darkmode.js in the extension's folder.
Attachments
light cookie.png

User avatar
Andrew Lee
Posts: 3094
Joined: Sat Feb 04, 2006 9:19 am
Contact:

Re: Dark mode

#44 Post by Andrew Lee »

@lwc: Extension updated. Thanks!

@ElCoyot: Please let us know if it works for you now.

-ElCoyot-
Posts: 134
Joined: Thu Sep 02, 2021 4:42 am

Re: Dark mode

#45 Post by -ElCoyot- »

@ElCoyot: Please let us know if it works for you now.
No. https://streamable.com/afi969

Post Reply