[CDB] Prosilver (Dark Edition)

For style authors to post and receive feedback on 3.2.x styles still in development. Any development styles you wish to use on your live board should be installed with caution!
User avatar
Christian 2.0
Former Team Member
Posts: 4501
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

[CDB] Prosilver (Dark Edition)

Post by Christian 2.0 » Mon Oct 21, 2019 12:25 pm

Style Name: Prosilver (Dark Edition)
Author: Christian 2.0 (on behalf of PlanetStyles.net)

Style Description: It's just Prosilver. But darker :)
Style Version: 1.0.0

Requirements: Style inherits unmodified template files from Prosilver. Prosilver needs to be installed, but doesn't need to be 'activated'.

Features:
  • Dark UI
  • Adjusted padding for better usability
  • Pure CSS forum / topic icons
  • 'Pulsing' effect unread forum / topic icons
  • 8 colour schemes
    • Red
    • Orange
    • Yellow
    • Green
    • Blue (Default)
    • Purple
    • Pink
    • Grey
FAQ:
How do I change the logo?

See: [3.2][RC] Site Logo
How do I change colour scheme?

Open: /styles/prosilver_dark/template/overall_header.html

Find:

Code: Select all

<link href="{T_THEME_PATH}/colours/blue.css?assets_version={T_ASSETS_VERSION}" rel="stylesheet">
Replace blue.css with the name of the colour you want to use (eg: pink.css, green.css)
Your pure CSS forum / topics suck! How do I get the images back?

Open: /styles/prosilver_dark/theme/dark.css

Find and delete everything below this line:

Code: Select all

/* ------- Forum & Topic Icons (Pulsing) ------- */
The base colour looks kinda blue. How can I make this more grey / black?
Open: /styles/prosilver_dark/theme/dark.css

Find:

Code: Select all

/* Light bg colours */
.headerbar, .navbar, .forabg, .forumbg, li.row, .bg1, .bg2, .bg3, .tabs .activetab > a, .tabs a:hover, ul.cplist, .panel, blockquote blockquote, .dropdown .dropdown-contents, .jumpbox-cat-link, .jumpbox-sub-link {
	background: #242a36 !important;
}

/* Dark bg colours */
html, body, .wrap, .panel-container .panel, .navigation .active-subsection a, .navigation a:hover, .cp-mini, .codebox, blockquote, blockquote blockquote blockquote, .attachbox, .message-box textarea, .phpbb_alert, select {
	background-color: #171b24 !important;
}
Replace these two hex values with something darker.

As a good starting point, try #2d2d2d for the top (light) value, and #1e1e1e for the dark (bottom) value.


@Other style authors:
If you use Prosilver Dark Edition to kick-start your own styles, please do the kind thing by leaving some kind of attributable and publicly visible credit to PlanetStyles.net in the footer :)



Demo URL: See screenshots. It's just prosilver :)
Style Download: http://planetstyles.net/downloads/prosi ... _1.0.0.zip

Screenshots:
Default view
Default view
Viewforum
Viewforum
Viewtopic
Viewtopic
Desaturated version (see FAQ for instructions)
Desaturated version (see FAQ for instructions)
Red
Red
Orange
Orange
Yellow
Yellow
Green
Green
Purple
Purple
Pink
Pink
Download link: http://planetstyles.net/downloads/prosi ... _1.0.0.zip
Last edited by Christian 2.0 on Tue Oct 22, 2019 1:16 am, edited 5 times in total.

User avatar
Christian 2.0
Former Team Member
Posts: 4501
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: [DEV] Prosilver (Dark Edition)

Post by Christian 2.0 » Mon Oct 21, 2019 12:38 pm

Icons, links and form-elements will be re-coloured prior to release.

Exabot
Translator
Posts: 175
Joined: Sun Jan 18, 2015 8:21 pm
Location: Estonia

Re: [DEV] Prosilver (Dark Edition)

Post by Exabot » Mon Oct 21, 2019 1:23 pm

Looks good! ;)

User avatar
warmweer
Registered User
Posts: 2999
Joined: Fri Jul 04, 2003 6:34 am
Location: Van Allen Belt ... well actually Belgium

Re: [DEV] Prosilver (Dark Edition)

Post by warmweer » Mon Oct 21, 2019 1:34 pm

Yep, it looks good.
Although the blue and red (forum/topic titles and group colour) lack sharpness (always difficult with dark styles) and the forum (read/posted in) icons also have hazy edges.
The year is 2192. The British Prime Minister visits Brussels to ask for an extension of the Brexit deadline. No one remembers where this tradition originated, but every year it attracts many tourists from all over the world.

User avatar
Christian 2.0
Former Team Member
Posts: 4501
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: [DEV] Prosilver (Dark Edition)

Post by Christian 2.0 » Mon Oct 21, 2019 1:42 pm

warmweer wrote: ↑
Mon Oct 21, 2019 1:34 pm
Yep, it looks good.
Although the blue and red (forum/topic titles and group colour) lack sharpness (always difficult with dark styles) and the forum (read/posted in) icons also have hazy edges.
Indeed. Those are WIP screenshots, and those elements hadn't yet been recoloured.

The links will be high contrast (but not blinding, this theme needs to be nice to read at night), and I'll be offering admins a choice of 6-7 colours.

As for the icons, those are being replaced with pure CSS equivalents with a complimentary colour palette. This will negate any crispy edges or issues with the resolution :)

User avatar
warmweer
Registered User
Posts: 2999
Joined: Fri Jul 04, 2003 6:34 am
Location: Van Allen Belt ... well actually Belgium

Re: [DEV] Prosilver (Dark Edition)

Post by warmweer » Mon Oct 21, 2019 1:55 pm

Christian 2.0 wrote: ↑
Mon Oct 21, 2019 1:42 pm
...work in progress...
Looking forward to it :thumbsup:
BTW you used the word "contrast". That was the word I was looking for and it just didn't come up :oops:
The year is 2192. The British Prime Minister visits Brussels to ask for an extension of the Brexit deadline. No one remembers where this tradition originated, but every year it attracts many tourists from all over the world.

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

Re: [DEV] Prosilver (Dark Edition)

Post by EA117 » Mon Oct 21, 2019 2:28 pm

That the darkest portions remain "closer to blue" rather than "black" is subjectively fine in my opinion; not withstanding that "dark mode" in some prominent examples (Windows 10, Apple devices) are for intents and purposes "black". It's a "dark version of prosilver", and not "a black version of prosilver." 😁

For what it's worth, my eye seems like it would rather see the <body> background color the same as #wrap, so that any small or large amount of body background that becomes exposed is a continuation of "this page is dark". Rather than transitioning back to one of the lighter colors for the unknown amount of background that will become exposed in a fixed-width style, and only using the darkest color "in the middle of the page".

dark.png

Or maybe the <body> background would be what goes "full black", to nudge the overall feel slightly in that direction but sill keep prosilver's #wrap "box" visually?

black.png

Clearly you have better and more experienced opinions about all of this. Just giving my no-color-theory layperson input. 😁

Lsha
Registered User
Posts: 64
Joined: Mon Feb 25, 2019 10:38 am

Re: [DEV] Prosilver (Dark Edition)

Post by Lsha » Mon Oct 21, 2019 4:44 pm

looks good, waiting for the final release. thanks ;)

User avatar
Talk19Zehn
Registered User
Posts: 407
Joined: Tue Aug 09, 2011 1:10 pm
Contact:

Re: [DEV] Prosilver (Dark Edition)

Post by Talk19Zehn » Mon Oct 21, 2019 5:17 pm

Right EA117 and I agree, the blue outweighs the current visual notion. BTW: Calibrate monitors and adjust perfectly is one thing and who uses which graphics card yet another ..

Good idea Christian 2.0 ==> +10 ==> Designing Dark is not easy and is often underestimated.

Best regards
World Meteorological Organization (WMO) Weather - Climate - Water
phpBB Advent calendar: sought and found ..
BTW: My own works - phpBB - read more: ongray-design-de or look here: phpBB VT Theme
Style: Star Trek - StarTrekExcerpts - Fan-Board

User avatar
Christian 2.0
Former Team Member
Posts: 4501
Joined: Wed Nov 04, 2009 11:16 pm
Location: UK
Name: Christian
Contact:

Re: [DEV] Prosilver (Dark Edition)

Post by Christian 2.0 » Mon Oct 21, 2019 5:41 pm

EA117 wrote: ↑
Mon Oct 21, 2019 2:28 pm
For what it's worth, my eye seems like it would rather see the <body> background color the same as #wrap, so that any small or large amount of body background that becomes exposed is a continuation of "this page is dark". Rather than transitioning back to one of the lighter colors for the unknown amount of background that will become exposed in a fixed-width style, and only using the darkest color "in the middle of the page".
Thanks for providing this perspective. I hadn't considered blending the wrapper and background until this suggestion.

I've just tried it and agree it looks much better, so it has been implemented :)

Talk19Zehn wrote: ↑
Mon Oct 21, 2019 5:17 pm
Good idea Christian 2.0 ==> +10 ==> Designing Dark is not easy and is often underestimated.
Thank you! And I agree, this started as a quick re-colour job but has turned into a 3-day project needing to adjust many intricate details. Hopefully others will find it useful when designing their own dark-based styles :)

in_so@pta
Registered User
Posts: 21
Joined: Wed Mar 07, 2018 11:45 am

Re: [DEV] Prosilver (Dark Edition)

Post by in_so@pta » Mon Oct 21, 2019 6:45 pm


User avatar
warmweer
Registered User
Posts: 2999
Joined: Fri Jul 04, 2003 6:34 am
Location: Van Allen Belt ... well actually Belgium

Re: [DEV] Prosilver (Dark Edition)

Post by warmweer » Mon Oct 21, 2019 6:56 pm

in_so@pta wrote: ↑
Mon Oct 21, 2019 6:45 pm
I think this one is much better:
How many times more are you going to post that link?
Also, if you think it's better, please state exactly why.
The year is 2192. The British Prime Minister visits Brussels to ask for an extension of the Brexit deadline. No one remembers where this tradition originated, but every year it attracts many tourists from all over the world.

in_so@pta
Registered User
Posts: 21
Joined: Wed Mar 07, 2018 11:45 am

Re: [DEV] Prosilver (Dark Edition)

Post by in_so@pta » Mon Oct 21, 2019 7:01 pm

Mate you are off topic, and btwy nobody care's about Uk πŸ˜ƒπŸ˜…

User avatar
warmweer
Registered User
Posts: 2999
Joined: Fri Jul 04, 2003 6:34 am
Location: Van Allen Belt ... well actually Belgium

Re: [DEV] Prosilver (Dark Edition)

Post by warmweer » Mon Oct 21, 2019 7:21 pm

in_so@pta wrote: ↑
Mon Oct 21, 2019 7:01 pm
Mate you are off topic, and btwy nobody care's about Uk πŸ˜ƒπŸ˜…
warmweer wrote: ↑
Mon Oct 21, 2019 6:56 pm
Also, if you think it's better, please state exactly why.
I think that's completely on topic. Saying you think another style is much better doesn't give any information as to what you think should be changed/improved. You could use the style you linked to to show the elements which (would) need improvements and that might be useful for the developer. It's what is generally called useful feedback.
The year is 2192. The British Prime Minister visits Brussels to ask for an extension of the Brexit deadline. No one remembers where this tradition originated, but every year it attracts many tourists from all over the world.

User avatar
Gumboots
Registered User
Posts: 186
Joined: Fri Oct 11, 2019 1:59 am

Re: [DEV] Prosilver (Dark Edition)

Post by Gumboots » Mon Oct 21, 2019 8:44 pm

Aha. Now this is stylish. Nice work.

Given the standard of detailing so far, I assume the default board icons are temporary. Should be one of the best when it's finished.

Locked

Return to β€œ[3.2.x] Styles in Development”