Ye Olde Rocket Forum

Go Back   Ye Olde Rocket Forum > Weather-Cocked > FreeForAll
User Name
Password
Auctions Register FAQ Members List Calendar Today's Posts Search Mark Forums Read


Reply
 
Thread Tools Search this Thread Display Modes
  #1  
Old 01-12-2016, 03:03 PM
neil_w's Avatar
neil_w neil_w is offline
Mr. Cut-by-hand
 
Join Date: Nov 2015
Location: Northern New Jersey
Posts: 439
Default An alternative dark-on-light stylesheet for this forum

I find the white-on-blue theme of this forum to be hard on eyes. So I flung together a new stylesheet and use the Stylish extension to apply it to the forum. I find the result to be more pleasing to my eyeballs, while still being clearly recognizable as YORF.

I put it here in case anyone else finds it useful. It doesn't redefine everything, just the areas where there's lots of text to read.

It looks like the attachment below.

Here's the stylesheet (I should probably upload it to userstyles.org, but too lazy):
Code:
.alt1, .alt1Active, textarea { background-color: #E4F2F6; color: black; font-weight: normal; } textarea { font-size: 12px; } .alt2, .alt2Active, .bginput { background-color: #B5D8E3; color: black; } .time, .bigusername:visited, .bigusername:link { color: #FFF; } a:visited, a:link { color: #313; } .alt1 a:hover, .alt1Active a:hover, .alt2 a:hover, .alt2Active a:hover { background-color: white; } .alt1 .time, .alt1Active .time { color: #313; font-weight: bold; }
Attached Thumbnails
Click image for larger version

Name:  yorf_theme.png
Views: 93
Size:  294.5 KB  
Reply With Quote
  #2  
Old 01-12-2016, 04:36 PM
BEC's Avatar
BEC BEC is offline
Master Modeler
 
Join Date: Feb 2009
Location: Auburn, Washington
Posts: 3,643
Default

I like it!
__________________
Bernard Cawley
NAR 89040 L1 - Life Member
SAM 0061
AMA 42160
KG7AIE
Reply With Quote
  #3  
Old 01-12-2016, 05:02 PM
sandman's Avatar
sandman sandman is offline
Custom Cone, Kit & Decal Maker
 
Join Date: Mar 2005
Location: Way North of Detroit
Posts: 5,048
Default

I hate change!
__________________
"I'm a sandman. I've never killed anyone. I terminate runners when their time is up." Logan from "Logan's Run"

http://sandmandecals.com/
Reply With Quote
  #4  
Old 01-12-2016, 05:42 PM
Rich Holmes's Avatar
Rich Holmes Rich Holmes is offline
Born Late Rocketeer
 
Join Date: Jul 2013
Location: Syracuse, NY
Posts: 568
Default

Does need some work, there are places that remain white on blue, or black on blue. Nice start though. I agree white on blue is not a very friendly style.
__________________
Rich Holmes
Camillus, NY
Secretary / newsletter editor
Syracuse Rocket Club

http://richsrockets.wordpress.com
Reply With Quote
  #5  
Old 01-12-2016, 07:38 PM
astronwolf's Avatar
astronwolf astronwolf is offline
Lost his Drifter
 
Join Date: Mar 2013
Location: Northeast Ohio
Posts: 1,277
Default

Simple black on white is harder than white on blue for me. Using white on blue for presentations has been used for a long time. Problem here IMHO is that the blue is too light, which does make it harder on the eyes. Not enough contrast.

I'll tell you what needs a facelift: http://plans.rocketshoppe.com/ I think the plans website is absolutely horrid.
__________________
-Wolfram v. Kiparski
NAR 28643 - TRA 15520
MTMA Section #606 President
Reply With Quote
  #6  
Old 01-12-2016, 09:02 PM
Rich Holmes's Avatar
Rich Holmes Rich Holmes is offline
Born Late Rocketeer
 
Join Date: Jul 2013
Location: Syracuse, NY
Posts: 568
Default

I decided I liked it better if I got rid of both shades of light blue and just made it black text on white (almost) everywhere. Just my preference.
Code:
.alt1, .alt1Active, textarea { background-color: white; color: black; font-weight: normal; } textarea { font-size: 12px; } .alt2, .alt2Active, .bginput { background-color: white; color: black; font-weight: normal; } .time, .bigusername:visited, .bigusername:link { color: black; } a:visited, a:link { color: #313; } .alt1 a:hover, .alt1Active a:hover, .alt2 a:hover, .alt2Active a:hover { background-color: white; } .alt1 .time, .alt1Active .time { color: #313; font-weight: bold; }


__________________
Rich Holmes
Camillus, NY
Secretary / newsletter editor
Syracuse Rocket Club

http://richsrockets.wordpress.com
Reply With Quote
  #7  
Old 01-12-2016, 09:16 PM
Rich Holmes's Avatar
Rich Holmes Rich Holmes is offline
Born Late Rocketeer
 
Join Date: Jul 2013
Location: Syracuse, NY
Posts: 568
Default

Quote:
Originally Posted by astronwolf
I'll tell you what needs a facelift: http://plans.rocketshoppe.com/ I think the plans website is absolutely horrid.

No argument from me on that. Not sure if Stylish can do much about that: the plans pages apparently don't use CSS styles at all.


The spacemodeling.org/jimz plans pages are if anything even horrider (when they work at all). Of course their content is invaluable, which is the important thing.
__________________
Rich Holmes
Camillus, NY
Secretary / newsletter editor
Syracuse Rocket Club

http://richsrockets.wordpress.com
Reply With Quote
  #8  
Old 01-13-2016, 08:38 AM
Rocketflyer's Avatar
Rocketflyer Rocketflyer is offline
Member in Good Standing!
 
Join Date: Sep 2006
Posts: 1,209
Default

Quote:
Originally Posted by Rich Holmes
Does need some work, there are places that remain white on blue, or black on blue. Nice start though. I agree white on blue is not a very friendly style.


+1!
__________________
Enjoy life, it has an expiration date.
Reply With Quote
  #9  
Old 01-13-2016, 11:25 AM
neil_w's Avatar
neil_w neil_w is offline
Mr. Cut-by-hand
 
Join Date: Nov 2015
Location: Northern New Jersey
Posts: 439
Default

Quote:
Originally Posted by Rich Holmes
I decided I liked it better if I got rid of both shades of light blue and just made it black text on white (almost) everywhere. Just my preference.

Hey, it's all preference.

I tried yours and decided that I agree with most of it. White is better for the primary background, but I still think a different shade is useful to distinguish title bars and quoted text. And so I made those very light blue.

Quote:
Does need some work, there are places that remain white on blue, or black on blue.

Yes indeed, so I fixed all that (everything I could find, at least), added comments and beautified, and ended up with this. There are still some things that could be tweaked, but overall I am very happy with this now. See what you think.
Code:
/* default link colors for dark areas */ a:visited, a:link { color: white; } /* A little highlight for hovering. Shows an unwanted background color on "post reply" buttons but I can't figure out how to eliminate that without breaking other things */ a:hover { background-color: #BBB; } /* special handling for image links */ a:hover img { background-color: #10375D; } #controlbar a:hover img { background-color: #C2BDA3; } .alt1 a:hover img, .alt1Active a:hover img { background-color: white; } /* Link colors inside light areas */ .alt1 a:visited, .alt1 a:link, .alt1Active a:visited, .alt1Active a:link, .alt2 a:visited, .alt2 a:link, .alt2Active a:visited, .alt2Active a:link, td.controlbar a:visited, td.controlbar a:link { color: #313; } /* Main content areas */ .alt1, .alt1Active, textarea { background-color: white; color: black; font-weight: normal; } /* Post title bar and some other areas */ .alt2, .alt2Active, .bginput { background-color: #EDF5F8; color: black; font-weight: normal; } /* User name at the top of each post */ .bigusername:visited, .bigusername:link { color: black; } /* Without boldface, slightly larger font is a bit easier on the eyes */ textarea { font-size: 12px; } /* This is the background for the reply areas at the bottom of a page, made a little darker to be clearly distinguishable from the main content areas. It's just dark enough that the white legends still look good, but black text is also adequately contrasty and readable */ .panelsurround, .panel { background-color: #98C2CD; } /* No need for time to be a different color than other text, but we'll make it bold to stand out a bit */ .time { color: inherit; font-weight: bold; } /* replace the horrible background image on a couple of headers */ .tcat { background: rgba(231,241,245,1); background: -moz-linear-gradient(top, rgba(231,241,245,1) 0%, rgba(196,205,207,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(231,241,245,1)), color-stop(100%, rgba(196,205,207,1))); background: -webkit-linear-gradient(top, rgba(231,241,245,1) 0%, rgba(196,205,207,1) 100%); background: -o-linear-gradient(top, rgba(231,241,245,1) 0%, rgba(196,205,207,1) 100%); background: -ms-linear-gradient(top, rgba(231,241,245,1) 0%, rgba(196,205,207,1) 100%); background: linear-gradient(to bottom, rgba(231,241,245,1) 0%, rgba(196,205,207,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e7f1f5', endColorstr='#c4cdcf', GradientType=0 ); }
Attached Thumbnails
Click image for larger version

Name:  yorf_theme2.png
Views: 28
Size:  218.7 KB  

Last edited by neil_w : 01-13-2016 at 12:14 PM. Reason: Improved image button background hover behavior
Reply With Quote
  #10  
Old 01-13-2016, 11:35 AM
neil_w's Avatar
neil_w neil_w is offline
Mr. Cut-by-hand
 
Join Date: Nov 2015
Location: Northern New Jersey
Posts: 439
Default

Quote:
Originally Posted by Rich Holmes
Quote:
Originally Posted by astronwolf
I'll tell you what needs a facelift: http://plans.rocketshoppe.com/ I think the plans website is absolutely horrid.

No argument from me on that. Not sure if Stylish can do much about that: the plans pages apparently don't use CSS styles at all.

Yikes.

Quote:
The spacemodeling.org/jimz plans pages are if anything even horrider (when they work at all). Of course their content is invaluable, which is the important thing.

Yikes^2.

These are obviously some old pages. I can think of 3 ways to fix them (as you say they do not use CSS, nor is the HTML notated in any reasonable way with classes, so there's almost no way to apply CSS after-the-fact):
  1. Just redo the pages. Unfortunately, the page owner is the only one who can do that, and if they had the inclination we probably wouldn't be talking about it.
  2. Use something like a TamperMonkey plugin to basically rewrite the pages in-place
  3. Put up a new page somewhere that scrapes those sites and reformats the content. Probably wouldn't do that without the site owners' consent though.

Option #1 is best but probably not gonna happen; option #2 is doable but a bit of work; option #3 is probably not worth it.
Reply With Quote
Reply


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump



All times are GMT -5. The time now is 02:44 AM.


Powered by: vBulletin Version 3.0.7
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Ye Olde Rocket Shoppe © 1998-2024