[GUIDE] Easily Re-Color ProSilver 3.2 v1.5 (colour.css Generator)

For support and discussion related to templates, themes, and imagesets in phpBB 3.2.
WWu777
Registered User
Posts: 802
Joined: Tue Aug 14, 2007 12:40 pm
Contact:

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by WWu777 »

Ok I get it now. You select the primary color and then the rest will be automatically adjusted to it right? It seems that way. How do you lighten the background though? Which variable in the block do you change below?

Code: Select all

// EDIT THESE COLORS (Main Color Scheme) 
$color-primary: hsl(200, 85%, 50%) !default;
$color-accent: adjust-hue($color-primary, 145%) !default;
$color-secondary: adjust-hue($color-primary, 10%) !default;
$color-ui: desaturate(adjust-hue($color-primary, 20%), 65%) !default;
Also, the colours.css file only has 1100+ lines. So when you replace them, there will be more lines up to 1399 lines right? So the replacement will increase the lines that were there?

Update:

Ok I followed the instructions and applied them to my forum. It worked. However, there is an extra white border around my forum. Do you know why? How do I remove it? Here's what I mean, see here:

http://www.happierabroad.com/forum/index.php

As you can see, my forum has an extra white border around it. How do I get rid of it? Why is that there?

Also, the background within the posts and forum lists is too gray. I'd like to lighten it to dirty white or very light gray. How do I do that? Thanks.
User avatar
Hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 1065
Joined: Wed Dec 30, 2009 8:14 am
Name: Michael Miday
Contact:

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by Hanakin »

yes everything is auto calculated from those 4 color values (That is the definition of a color scheme! again please just google it) in the entire theme for the 9th time... This is meant for 3.2.1 it generates a new colors.css file if you follow the instructions. It works just trust it! All the instructions are there if you can not figure it out from there then you probably should not be attempting any of this
WWu777
Registered User
Posts: 802
Joined: Tue Aug 14, 2007 12:40 pm
Contact:

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by WWu777 »

Hanakin wrote: Fri Nov 24, 2017 12:06 am yes everything is auto calculated from those 4 color values (That is the definition of a color scheme! again please just google it) in the entire theme for the 9th time... This is meant for 3.2.1 it generates a new colors.css file if you follow the instructions. It works just trust it! All the instructions are there if you can not figure it out from there then you probably should not be attempting any of this
Ok thanks. But this thing created an extra border around my forum. How do I get rid of it?

Also, another bigger problem is that it caused all the quoted block of text in posts to fill up with tons of black quote signs, so that you can't even see the quoted text anymore. What happened? You can't even see the quoted text now. See attached screenshot. Wtf? How do you fix that?
Untitled.jpg
I believe it is connected with this block of code from colours.css below. How do I fix it? It appears that the quote.gif image is the one that repeats.

Code: Select all

/* BB Code styles
----------------------------------------*/
/* Quote block */
blockquote {
  background-color: #f4f1d7;
  background-image: url("./images/quote.gif");
  border-color: #f1efda;
}

.rtl blockquote {
  background-image: url("./images/quote_rtl.gif");
}

blockquote blockquote {
  /* nested quotes */
  background-color: #f7f4d4;
}

blockquote blockquote blockquote {
  /* nested quotes */
  background-color: #f4f1d7;
}

/* code block */
.codebox {
  background-color: #ffffff;
  border-color: #cbcbcb;
}

.codebox p {
  border-bottom-color: #dedede;
}

.codebox code {
  color: #4db355;
}

/* #DEPRECATED
.syntaxbg		{ color: #ffffff; }
.syntaxcomment	{ color: #FF8000; }
.syntaxdefault	{ color: #0000BB; }
.syntaxhtml		{ color: #000000; }
.syntaxkeyword	{ color: #007700; }
.syntaxstring	{ color: #DD0000; }
*/
User avatar
Hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 1065
Joined: Wed Dec 30, 2009 8:14 am
Name: Michael Miday
Contact:

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by Hanakin »

it appears the link on the first page was for the wrong version try it again
User avatar
david63
Registered User
Posts: 20646
Joined: Thu Dec 19, 2002 8:08 am

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by david63 »

WWu777 wrote: Fri Nov 24, 2017 12:51 am Also, another bigger problem is that it caused all the quoted block of text in posts to fill up with tons of black quote signs, so that you can't even see the quoted text anymore. What happened? You can't even see the quoted text now. See attached screenshot. Wtf? How do you fix that?
Hard refresh your browser.

There are dozens of posts about this problem and how to solve it if you had taken the trouble to search for the problem.
David
Remember: You only know what you know and - you don't know what you don't know!

I now no longer support any of my extensions but they will start to become available here
WWu777
Registered User
Posts: 802
Joined: Tue Aug 14, 2007 12:40 pm
Contact:

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by WWu777 »

david63 wrote: Fri Nov 24, 2017 6:42 am
WWu777 wrote: Fri Nov 24, 2017 12:51 am Also, another bigger problem is that it caused all the quoted block of text in posts to fill up with tons of black quote signs, so that you can't even see the quoted text anymore. What happened? You can't even see the quoted text now. See attached screenshot. Wtf? How do you fix that?
Hard refresh your browser.

There are dozens of posts about this problem and how to solve it if you had taken the trouble to search for the problem.
Where? I already tried. I searched "quotation marks repeating" but nothing came up. How do i even describe this problem? Its hard to explain. Where are there dozens of posts on this problem?

Of course i hard refreshed my browser. It goes without saying. Other forum members noticed it too.
Hanakin wrote: Fri Nov 24, 2017 6:06 am it appears the link on the first page was for the wrong version try it again
You mean if i redo it the problem of repeating quotation marks will be no more?

If it was the wrong version then how come others didnt report the same problem with the repeating quotation marks? I feel like I'm in the twilight zone again.
WWu777
Registered User
Posts: 802
Joined: Tue Aug 14, 2007 12:40 pm
Contact:

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by WWu777 »

Hanakin wrote: Sat Mar 11, 2017 9:13 pm Copy Lines 1 - 1399 from the CSS Editor at the top of that window (everything after line 1399 is not needed for prosilver)
Dear developer, thanks for updating the link with the correct one. However, do you still copy line 1 to 1399 from the css output code? Because line 1399 is in the middle of a code and would make it incomplete. Or do you copy the code up until the badge block again? If so, then the last line is 1017. So do we copy line 1 to 1017? If so, then you should edit the instructions right?

Should the badge code be at the end? I mean this one:

Code: Select all

.badge {
  background-color: #862d34;
  color: #ffffff;
}
User avatar
Hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 1065
Joined: Wed Dec 30, 2009 8:14 am
Name: Michael Miday
Contact:

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by Hanakin »

copy everything up to where it says

Code: Select all

/************************************************************************\
/* DELETE EVERYTHING PAST HERE
/************************************************************************/

the quote problem is a caching issue from 3.2.0 to 3.2.1 as mentioned above. The other issues were related to the wrong link. They are small issues and probably went unnoticed.
User avatar
thecoalman
Community Team Member
Community Team Member
Posts: 5871
Joined: Wed Dec 22, 2004 3:52 am
Location: Pennsylvania, U.S.A.
Contact:

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by thecoalman »

WWu777 wrote: Fri Nov 24, 2017 12:51 am
Ok thanks. But this thing created an extra border around my forum. How do I get rid of it?
Dedending on the browser you are using directions may vary but you can use the developer tools to find what rules are used for the CSS. In Firefox you simply right click what you want to view and select "inspect element". Om the right hand side it will list the CSS rules for that element, it will even tell you what file and what line.
“Results! Why, man, I have gotten a lot of results! I have found several thousand things that won’t work.”

Attributed - Thomas Edison
JohnnyBigSpuds
Registered User
Posts: 126
Joined: Tue Apr 22, 2014 5:49 pm

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by JohnnyBigSpuds »

Could this be used to recolour other styles?
I have phpbb 3.2 and am running the prosilver based 3.2 compatiable forumbook style, im wanting to make it a more dark style.
Would this tool aid with it or is it specifically just for pro silver?
Thanks
User avatar
Hanakin
Front-End Dev Team Lead
Front-End Dev Team Lead
Posts: 1065
Joined: Wed Dec 30, 2009 8:14 am
Name: Michael Miday
Contact:

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by Hanakin »

probably not
JohnnyBigSpuds
Registered User
Posts: 126
Joined: Tue Apr 22, 2014 5:49 pm

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by JohnnyBigSpuds »

thank you for the quick reply hanakin
Luchtzak
Registered User
Posts: 273
Joined: Sat Jul 20, 2002 7:13 pm
Contact:

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by Luchtzak »

I am a total and complete nitwit in selecting colours for my template. I want to create a template like this web site but I just can't succeed.

www.malinwaforum.be

All help welcome!
User avatar
Jodi-86
Registered User
Posts: 100
Joined: Thu Nov 30, 2017 10:04 pm

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by Jodi-86 »

Luchtzak wrote: Sat Jan 13, 2018 4:11 pm I am a total and complete nitwit in selecting colours for my template. I want to create a template like this web site but I just can't succeed.

www.malinwaforum.be

All help welcome!
That forum is subsilver, If you are running the later phpbb version an ideal style to work with would be https://www.phpbb.com/customise/db/styl ... subsilver/
Luchtzak
Registered User
Posts: 273
Joined: Sat Jul 20, 2002 7:13 pm
Contact:

Re: [GUIDE] Easily Re-Color ProSilver 3.2 (colour.css Generator)

Post by Luchtzak »

Jodi-86 wrote: Sat Jan 13, 2018 5:25 pm
Luchtzak wrote: Sat Jan 13, 2018 4:11 pm I am a total and complete nitwit in selecting colours for my template. I want to create a template like this web site but I just can't succeed.

www.malinwaforum.be

All help welcome!
That forum is subsilver, If you are running the later phpbb version an ideal style to work with would be https://www.phpbb.com/customise/db/styl ... subsilver/
Thank you, but I want to have it in the same colours as the old site. And the problems is that I can't get the colours right ...
Post Reply

Return to “[3.2.x] Styles Support & Discussion”