site Search:


 
    All Forums Hot Topics Gallery






how-to block ads


 
Search Topic:
Uniqs:
1215
Share Topic
Posting?
Post a:
Post a:
Links: ·Site FAQ ·Broadband FAQ ·All Faqs ·HOWTO post
AuthorAll Replies

OZO
Premium
join:2003-01-17
kudos:2

Tuning default BBR theme


Default theme

Links have better contrast

Modified theme
As you know there is lot of themes that you may choose to use in BBR Forum. I checked many of them and have not found a theme better then "default". What I was looking for is - better contrast for my main Favorite Forums page and better contrast for multiple Forum lists of links to particular threads (e.g. General Questions page or any other on that level).

Bright blue color of all links (all topic titles) is hard to read and I feel tired in a while... Just look at the first picture above (or go to this page to see huge list of blue links). After checking again and again all offered themes I've decided to make my own move and make change that will increase contrast locally. Second picture shows how bright blue color of all links is changed to more contrast dark blue color which is better readable on white background. On the third picture I've changed lot of bright green colored bars to light gray color. And now I'm enjoying to work with BBR pages with this new look.

I'd like to share with you the way how to make it on your computer too. Instructions here are for IE users, but I'm sure with other browsers you may do the same. It's simple as these two steps:

    •Create local MyStyles.css file (see its content below)
    •Assign it in your browser. For IE users instructions are here: BBC - My Web My Way - Windows - Using your own style sheets in Internet Explorer

Here is content of MyStyles.css file that I use now:
/* Fixing color of links in BBR default theme: */
body center center table table table a:link    { color: #008 !important; }
body center center table table table a:visited { color: #00C !important; }
body center center table table table a:active  { color: #D00 !important; }
body center center table table table a:hover   { color: #000 !important; }
 
/* Fixing color of title bars in BBR default theme: */
body center center table table table td {background-color: #F4F4F4; !important; }
 
/* Fixing BBR blockquote style: */
body center center table table table div.bquote {
  color:      black !important;
/*  background: white !important;    */
/*  border-style: dotted !important; */
}
 

Here is some of additional points:
•You may change color values if you like a different color. E.g. you may use black color (#000;) in links.
•If you want to change blockquote blocks from yellowish background color back to white color and add side borders - uncomment two lines in the bottom of the file.
•You may add/remove styles from this file. E.g. if you want to keep new blockquotes using gray font on yellowish background - remove the last style from the file.
•If you want to keep green title bars in Favorite Forums page - remove style for TD element from the file provided.
•As you may noticed, there is a bug in BBR HTML code. Topic title bar still use a light green color. It's because of inconsistency in coding technique that IMHO may be easily fixed. Even without the fix - for me the theme is looking better now (making less stress on my eyes).
•Of cause it'd be better if some day developers of the site will offer such theme to all of us or offer more flexible approach in choosing color schemes here at BBR.

To follow these instructions and make the changes may be important for those who feel a need to make Forum pages more readable. I do not expect to fall into discussion about what color is better, more suitable and why. I just want to share with you the way how to make it happen on your computer, if you concern about it...


P.S. When you copy/paste code - please make sure that your file actually contains multiple lines, not just one line. Proper formatting is important here.

--
Keep it simple, it'll become complex by itself...

OZO
Premium
join:2003-01-17
kudos:2

1 edit


Modified theme
Here is probably a better shot of modified theme. In this case I've not resized IE to fit into a small picture.
--
Keep it simple, it'll become complex by itself...


Subaru
1-3-2-4
Premium
join:2001-05-31
Greenwich, CT

reply to OZO
I've been using the dark theme for about 4 years now



Mats
Here kitty and the chimp. Smash
Premium
join:2002-03-16
kudos:1

reply to OZO
I cant really tell the difference between any of the pics..

Cant stand the default theme.. Anything else is better..


OZO
Premium
join:2003-01-17
kudos:2

As I've said the difference is in color of the links. Default theme has light blue links on white background (see 1st picture), while in modified theme the links are dark (you can make them black easy if you wish) on the same white background.

Dark (or black) font is easier to read on white background then light blue.
--
Keep it simple, it'll become complex by itself...



Pacrat
Old and Cranky
Premium,MVM
join:2001-03-10
Cortland, OH

reply to OZO
The links have better contrast... I'll give you that, but it's more difficult to tell the dark blue from the black.
--
"You can't rollerskate in a buffalo herd... but you can be happy if you've a mind to!"


OZO
Premium
join:2003-01-17
kudos:2

1 edit

reply to OZO
There are several ways to use this approach with Firefox browser - check them here.
Thank you - Mele20 See Profile and DracoFelis See Profile for sharing your solutions with us.
--
Keep it simple, it'll become complex by itself...


OZO
Premium
join:2003-01-17
kudos:2

1 edit

reply to OZO
Recently I've discovered that links within a forum list (e.g. in Software forum) become having light blue color again. It has happened because the structure of tables within those pages was changed (simplified a bit).

Here is a view of light blue links (default color theme):


Light blue links


And here is view with fixed CSS scheme providing better contrast:

Dark blue links


For those of you who needs a better contrast for the links and uses my CSS local file published in this thread earlier I may recommend to change its content. It restores dark blue links back:
/* Fixing color of links in BBR default theme: */
body center center table table a:link    { color: #008 !important; }
body center center table table a:visited { color: #00C !important; }
body center center table table a:active  { color: #D00 !important; }
body center center table table a:hover   { color: #000 !important; }
 
/* Fixing color of title bars in BBR default theme: */
body center center table table table td {background-color: #F4F4F4; !important; }
body center center table table table#titlebarA1 td {background-color: transparent; !important; }
 
/* Fixing BBR blockquote style: */
body center center table table div.bquote {
  color:      black !important;
/*  background: white !important;    */
/*  border-style: dotted !important; */
}
 

Of cause the best and right way to adjust color scheme would be to use classes here. But it totally depends on the developer of the site. So far I still use the current fix.

I'll keep you updated if something will be changed again.

--
Keep it simple, it'll become complex by itself...

Mele20
Premium
join:2001-06-05
Hilo, HI
kudos:4

1 edit

Do you happen to know why the default theme does not honor the user's link colors? It used to. I haven't used it in years though. But with the recent changes and the garish, very hard on the eyes, way too much red color (a little is fine more is not OK) of the Candian theme I have used for years, I decided to try the default theme again as I always liked it and there is not another theme that I can stand. I think all the themes are really ugly except Canadian (until these changes) and default.

But when I tried default yesterday, it would not honor my link colors in Fx and would only do so in IE if I lost all frames here. How would I get the default theme to honor my chosen link colors? (I don't want any blue. I use green and purple as my link colors and those are honored in all browsers using the Canadian theme).

BTW, I can't see any difference at all in the link blue color that you show in your screenshots. They are very light, almost impossible to read and in fuzzy font, not true font, on both your screenshots.
--
"The same ferocity that our founders devoted to protect the freedom and independence of the press is now appropriate for our defense of the freedom of the internet. The stakes are the same: the survival of our Republic". Al Gore, The Assault on Reason



Grail Knight
Who Dares Wins
Premium
join:2003-05-31
Valhalla
kudos:5
Reviews:
·Time Warner Cable

1 edit

Using Fx myself and my link colors are being used.

Do not know what your Fx issue is but you can always put some .css code in your userContent.css file and all sites will use the link colors you specify.

Edit* In case yo udo not feel like looking for the .css here is mine. Change the colors to to suit your needs.

Remember userContent.css file.
----------------------------------------------------------

* Have the color of visited links=Red, not visited links=Blue & hover=green.
*/
a[href]:visited { color: red !important; }
a[href]:link { color: dark blue !important; }
a[href]:hover {
background-color: rgb(255,255,128) !important;
}


OZO
Premium
join:2003-01-17
kudos:2

reply to OZO
Today [2007-08-24] structure of forum pages was slightly changed (we've experienced a small "earthquake" here). And as I've promissed earlier - I'm posting new content for local style sheet file that restore default thmeme colors with a better contrast:

/* Fixing color of links in BBR default theme. Favs page: */
body table table table a:link    { color: #008 !important; }
body table table table a:visited { color: #00C !important; }
body table table table a:active  { color: #D00 !important; }
body table table table a:hover   { color: #000 !important; }
 
/* Fixing color of links in BBR default theme. Forum page: */
body table div table a:link    { color: #008 !important; }
body table div table a:visited { color: #00C !important; }
body table div table a:active  { color: #D00 !important; }
body table div table a:hover   { color: #000 !important; }
 
/* Fixing color of title bars in BBR default theme: */
body table table table td {background-color: #F4F4F4; !important; }
body table table table#titlebarA1 td {background-color: transparent; !important; }
 
/* Fixing BBR blockquote style: */
body center center table table div.bquote {
  color:      black !important;
/*  background: white !important;    */
/*  border-style: dotted !important; */
}
 
So far it's working for me well...

--
Keep it simple, it'll become complex by itself...

Tuesday, 07-Feb 23:04:23 Terms of Use & Privacy | feedback | contact | Hosting by nac.net - DSL,Hosting & Co-lo
over 12.5 years online! © 1999-2012 dslreports.com.
Most commented news this week
Hot Topics