Prosilver Dark Edition

Different color for unread notifications - Prosilver Dark Edition

Different color for unread notifications

by -CoS- » Fri Apr 17, 2020 8:46 pm

Hi, I love the theme, it should be supplied with the original phpbb package. I've detected a little problem, when you open the list of notifications, read and unread notifications have the same background color, making impossible to differentiate them.
User avatar
-CoS-
Registered User
Posts: 73
Joined: Tue Mar 20, 2007 7:59 pm

Re: Different color for unread notifications

by Pietjepoep » Mon Nov 23, 2020 6:59 pm

Hello guys. I'm facing the same problem as described above by -CoS-. In the regular prosilver theme unread notifications have a different color. In this prosilver_dark theme unread notifications have the same color, unless you hover over them. Why is this? Is it possible please to just give this the same behaviour as in the normal prosilver?

I absolutely love this theme. Especially in these times. phpBB is simply lacking a "dark mode", and this theme is the solution. Combined with the dark smilies set.
Pietjepoep
Registered User
Posts: 2
Joined: Mon Nov 23, 2020 6:56 pm

Re: Different color for unread notifications

by PlanetStyles.net » Mon Nov 23, 2020 9:35 pm

Hi there,

Thanks for your feedback and kind words regarding Prosilver dark :)
Pietjepoep wrote:Why is this?
Good question!

The answer is relatively simple: The dropdown background has the same colour as the bg2 class which is used to indicate an unread notification. The most obvious fix would be to make the dropdown background darker, so that when there's an unread notification it's clear to see.

The problem with this approach is that all of the dropdowns are designed to have the lighter background.

Okay, so why not just define a lighter background colour for the bg2 class? Well this would certainly work, but it would bring back a stript / alternating background colours to viewforum and viewtopic which I intentionally coded out when designing prosilver dark.

So, why not just use a different class other thanbg2 to highlight unread notifications? Well, that would require a template edit to notification_body.html , and prosilver dark is intentionally developed in a way to avoid any template edits at all.

So, here's a compromise. You can just target a darker dropdown on the notifications dropdown while leaving the others with their existing background colour. If you don't mind the inconsistencies, here's what you need to do:

Add this to the bottom of dark.css:

Code: Select all

#notification_list .bg2 {
	background-color: #171b24 !important;
}
User avatar
PlanetStyles.net
Former Team Member
Posts: 4809
Joined: Wed Nov 04, 2009 11:16 pm
Location: Way up in the sky close to the stars
Name: Christian

Re: Different color for unread notifications

by Pietjepoep » Tue Nov 24, 2020 9:19 am

Thank you very much for the solution, I can confirm it works!

The funny thing is I tried messing around with that exact stuff #notification_list .bg2, except for I forgot the apparently crucial "!important" part.

What exact inconsistency are you referring to?

Thanks again!
Pietjepoep
Registered User
Posts: 2
Joined: Mon Nov 23, 2020 6:56 pm

Re: Different color for unread notifications

by PlanetStyles.net » Tue Nov 24, 2020 5:34 pm

You're welcome :)
Pietjepoep wrote: What exact inconsistency are you referring to?
That the notifications drop-down will be a different colour to the other drop-downs, eg: Quick links
User avatar
PlanetStyles.net
Former Team Member
Posts: 4809
Joined: Wed Nov 04, 2009 11:16 pm
Location: Way up in the sky close to the stars
Name: Christian

Re: Different color for unread notifications

by -CoS- » Mon Feb 08, 2021 1:43 pm

Thank you!
User avatar
-CoS-
Registered User
Posts: 73
Joined: Tue Mar 20, 2007 7:59 pm

Re: Different color for unread notifications

by R3n » Tue Feb 16, 2021 9:12 pm

Pietjepoep wrote:Thank you very much for the solution, I can confirm it works!

The funny thing is I tried messing around with that exact stuff #notification_list .bg2, except for I forgot the apparently crucial "!important" part.

What exact inconsistency are you referring to?

Thanks again!
Was messing around with another theme, and didn't need the "!important" part.
User avatar
R3n
Registered User
Posts: 55
Joined: Tue Jan 12, 2021 3:08 am