[3.2][DEV] Dark Mode

A place for Extension Authors to post and receive feedback on Extensions still in development. No Extensions within this forum should be used within a live environment!
Suggested Hosts
Forum rules
READ: phpBB.com Board-Wide Rules and Regulations

IMPORTANT: Extensions Development rules

IMPORTANT FOR NEEDED EVENTS!!!
If you need an event for your extension please read this for the steps to follow to request the event(s)
User avatar
MedCo
Registered User
Posts: 79
Joined: Tue Jul 14, 2015 4:09 pm
Contact:

Re: [DEV] [3.2] Dark Mode

Post by MedCo » Tue Apr 09, 2019 11:19 am

Too bad there is no more support.

User avatar
HiFiKabin
Community Team Member
Community Team Member
Posts: 3999
Joined: Wed May 14, 2014 9:10 am
Location: Swearing at the PC, UK
Name: James
Contact:

Re: [DEV] [3.2] Dark Mode

Post by HiFiKabin » Tue Apr 09, 2019 12:07 pm

MedCo wrote:
Tue Apr 09, 2019 11:19 am
Too bad there is no more support.
The OP last logged in 2 days ago. By asking your support question they will respond as soon as they are able to. Remember, all team members and community members here are volunteers, so we ask you to be patient.

Remember, the more detail you are able to give for your question the more likely you are to get a solution.

User avatar
Aurelienazerty
Registered User
Posts: 158
Joined: Sat Jan 08, 2005 8:21 pm
Contact:

Re: [DEV] [3.2] Dark Mode

Post by Aurelienazerty » Tue Apr 09, 2019 3:14 pm

MedCo wrote:
Fri Mar 29, 2019 1:29 am
I use prosilver. The background is a photo. This should remain unchanged when using the extension.
Indeed, but you make too much personalisation for prosilver. My extension is for general case, I'll not make support for all exotic case.

The way to have what you want should be :
  1. Make a folder named prosilver, and subdirectories theme
  2. Copy the /ext/Aurelienazerty/darkMode/styles/all/theme/darkmode.css in /ext/Aurelienazerty/darkMode/styles/prosilver/theme/darkmode.css (the directory et sub directory you made)
  3. Edit the darkmode.css
  4. Line 5, replace .darkmode img, .darkmode iframe, .darkmode video { by .darkmode img, .darkmode iframe, .darkmode video, .darkmode .headerbar {
  5. Line 25, replace img, iframe, video { by img, iframe, video, .headerbar {
HiFiKabin wrote:
Tue Apr 09, 2019 12:07 pm
MedCo wrote:
Tue Apr 09, 2019 11:19 am
Too bad there is no more support.
The OP last logged in 2 days ago. By asking your support question they will respond as soon as they are able to. Remember, all team members and community members here are volunteers, so we ask you to be patient.

Remember, the more detail you are able to give for your question the more likely you are to get a solution.
👏 Indeed, I'm a volunteers. I share for all a feature I made for me.

User avatar
MedCo
Registered User
Posts: 79
Joined: Tue Jul 14, 2015 4:09 pm
Contact:

Re: [DEV] [3.2] Dark Mode

Post by MedCo » Wed Apr 10, 2019 4:57 pm

Hello, I didn't mean to be a nuisance.
I made the changes. Unfortunately no effect.
I just wanted the background to remain unchanged.
Thanks.

http://colombia.bplaced.net/index.php

User avatar
EA117
Registered User
Posts: 755
Joined: Wed Aug 15, 2018 3:23 am
Contact:

Re: [DEV] [3.2] Dark Mode

Post by EA117 » Wed Apr 10, 2019 5:36 pm

MedCo wrote:
Wed Apr 10, 2019 4:57 pm
Aurelienazerty wrote:
Tue Apr 09, 2019 3:14 pm
  • Line 5, replace .darkmode img, .darkmode iframe, .darkmode video { by .darkmode img, .darkmode iframe, .darkmode video, .darkmode .headerbar {
  • Line 25, replace img, iframe, video { by img, iframe, video, .headerbar {
I made the changes. Unfortunately no effect.
The image he is looking to "exclude from dark mode" is the background property attached to <body>, not .headerbar.

I'm guessing the background image will first need to be moved onto it's own unique <div>, in order to single it out for exclusion. And then cite the path of that new <div> in the changes that were proposed, instead of citing .headerbar.

Unless there is still some trick to exclude the <body> element, without causing the effect to be lost for "everything."

Agreed this is all very personalized customization. For the general case, it actually is appropriate that the background should be affected by dark mode, same as everything else. Whether it was an image, solid color, gradient, etc.

fagbutlil
I've Been Banned!
Posts: 77
Joined: Wed Mar 07, 2018 10:56 pm

Re: [DEV] [3.2] Dark Mode

Post by fagbutlil » Fri Apr 12, 2019 7:37 am

My version off this that was made before the OP posted this version is way better than this one :lol: no edits needed for other styles :lol:

User avatar
Aurelienazerty
Registered User
Posts: 158
Joined: Sat Jan 08, 2005 8:21 pm
Contact:

Re: [DEV] [3.2] Dark Mode

Post by Aurelienazerty » Fri Apr 12, 2019 12:15 pm

fagbutlil wrote:
Fri Apr 12, 2019 7:37 am
My version off this that was made before the OP posted this version is way better than this one :lol: no edits needed for other styles :lol:
Fantastic

andreask
Registered User
Posts: 527
Joined: Fri Feb 27, 2009 6:13 pm
Name: Andreas

Re: [DEV] [3.2] Dark Mode

Post by andreask » Sat Apr 13, 2019 12:06 am

Subscribed and waiting for beta to give it a go!
this is a long waiting function from my members!
Thank you very much for your time and effort!
Here is what I am working on right now...
Inactive User Manager for phpBB
Give it a try...
If you would like to buy me a bier ;) for my work I will drink it on a hot summer day and thank you!!!

andreask
Registered User
Posts: 527
Joined: Fri Feb 27, 2009 6:13 pm
Name: Andreas

Re: [DEV] [3.2] Dark Mode

Post by andreask » Sat Apr 13, 2019 5:05 pm

OK update... (sorry for the double post)

I've installed it on one of my test drives...
And it messes up with the ads.
I use both "Adsense & Ads" AND "Advertisement Management"!
Here is an example...
Image
Sorry for the "ads"!
Same goes for all the ads that are on the board.
It would be nice if it was possible to darken them, because some are quite colorful or bright...
But I don't know if that breaks any of the "google rules".

Oh it also messes up the banner/logo, it does the same thing as with ads.
I use "Site logo (3.2)" to have a custom logo/banner.
Here is what I am working on right now...
Inactive User Manager for phpBB
Give it a try...
If you would like to buy me a bier ;) for my work I will drink it on a hot summer day and thank you!!!

User avatar
paulie
Registered User
Posts: 90
Joined: Thu Mar 30, 2017 3:41 pm
Location: Hull, East Yorkshire.

Re: [DEV] [3.2] Dark Mode

Post by paulie » Sat Apr 13, 2019 7:45 pm

fagbutlil wrote:
Fri Apr 12, 2019 7:37 am
My version off this that was made before the OP posted this version is way better than this one :lol: no edits needed for other styles :lol:
So where is your 'version' then please?
'Life in the Air Age isn't all the brochures say ...'

User avatar
Aurelienazerty
Registered User
Posts: 158
Joined: Sat Jan 08, 2005 8:21 pm
Contact:

Re: [DEV] [3.2] Dark Mode

Post by Aurelienazerty » Mon Apr 15, 2019 7:35 am

andreask wrote:
Sat Apr 13, 2019 5:05 pm
OK update... (sorry for the double post)

I've installed it on one of my test drives...
And it messes up with the ads.
I use both "Adsense & Ads" AND "Advertisement Management"!
Here is an example...

Sorry for the "ads"!
Same goes for all the ads that are on the board.
It would be nice if it was possible to darken them, because some are quite colorful or bright...
But I don't know if that breaks any of the "google rules".

Oh it also messes up the banner/logo, it does the same thing as with ads.
I use "Site logo (3.2)" to have a custom logo/banner.
The good way is to make an CSS exeption for this ads. Is the contener have a class or unique identification ?

User avatar
Aurelienazerty
Registered User
Posts: 158
Joined: Sat Jan 08, 2005 8:21 pm
Contact:

Re: [3.2][DEV] Dark Mode

Post by Aurelienazerty » Sun Apr 28, 2019 8:26 am

A made some change for ads

andreask
Registered User
Posts: 527
Joined: Fri Feb 27, 2009 6:13 pm
Name: Andreas

Re: [3.2][DEV] Dark Mode

Post by andreask » Sun Aug 11, 2019 9:57 pm

Hello,

Here to report some issues from me and my users.

This has happened so far in chrome and firefox.

1. Dark mode for some reasons persist. Meaning that it is on dark mode while it's not been selected to be on dark mode.
This makes the browser some times laggy to scroll up/down.
Deleting cache in browser does not help. Deleting cache in forum does not help. Incognito/private mode in browser also does not help.

2. Some times going from dark mode to light mode breaks the images.
See avatars bellow to see what I mean.
Image

Thanks for your time and effort.
Here is what I am working on right now...
Inactive User Manager for phpBB
Give it a try...
If you would like to buy me a bier ;) for my work I will drink it on a hot summer day and thank you!!!

User avatar
Aurelienazerty
Registered User
Posts: 158
Joined: Sat Jan 08, 2005 8:21 pm
Contact:

Re: [3.2][DEV] Dark Mode

Post by Aurelienazerty » Mon Aug 12, 2019 8:24 pm

Hello,

Try to delete line 17 to 37 in darkMode/styles/all/theme/darkmode.css :

Code: Select all

/** La suite est un copier coller sans le .darkmode */
@media (prefers-color-scheme: dark) {

  html {
    filter: invert(1) hue-rotate(.5turn);
  }

  img, iframe, video, .adsbygoogle {
    filter: invert(1) hue-rotate(.5turn);
  }

  img:not(:hover) {
    opacity: .7;
    transition: opacity .25s ease-in-out;
  }
  
  .headerbar {
		background-image: none;
  }
}

User avatar
3Di
Former Team Member
Posts: 13921
Joined: Mon Apr 04, 2005 11:09 pm
Location: Milan (IT) Frankfurt (DE)
Name: Marco
Contact:

Re: [3.2][DEV] Dark Mode

Post by 3Di » Mon Aug 12, 2019 9:23 pm

Is there a "purge cache" in action when the CSS changes?
Please PM me only to request paid works. Thx.
Want to compensate me for my interest? Donate
My development's activity º PhpStorm's proud user
Extensions, Scripts, MOD porting, Update/Upgrades
👨‍🏫 | Take a tour to | The Studio | 👨‍🏫

Post Reply

Return to “Extensions in Development”