Dark look for the night owls

This forum contains information about 3rd party applications which may be of use to those who run the FAH client and one place where you might be able to get help when using one of those apps.

Moderator: Site Moderators

Dark look for the night owls

Postby grom » Sat Dec 07, 2013 12:09 pm

Hello.

One of your members kindly asked me to create a dark style for this forum, and also for the EOC stats site. Many of you are supposedly "night owls", so these should come in handy.

phpbb-dark-blue-simple style for Folding Forum (use with ProBlue or ProDark theme)
EOC-dark style for EOC and kakaostats.

A user style is a user-side CSS override of website appearance. Mainly, you specify your own colors and backgrounds instead of what the website developer chose. You can also move or hide existing page elements, but can't create new elements (such as links), can't add scripts (JavaScript) nor anything like that. Easiest way to use them is through Stylish or similar browser extensions, but anything allowing user CSS will do. Firefox family of browsers can use the built in userContent.css file.

Mod Edit: Moved To Appropriate Forum - PantherX
Mod Edit: converted url's to links - P5-133XL
Author Edit: added info "with ProBlue or ProDark theme"
Last edited by grom on Mon Dec 09, 2013 4:07 pm, edited 1 time in total.
grom
 
Posts: 7
Joined: Sat Dec 07, 2013 9:54 am

Re: Dark look for the night owls

Postby PantherX » Mon Dec 09, 2013 1:55 am

Welcome to the F@H Forum grom,

Thank you very much for taking the time to create and share the userstyles :)

I do like the dark looks and am now using both of them.
ETA:
Now ↞ Very Soon ↔ Soon ↔ Soon-ish ↔ Not Soon ↠ End Of Time

Welcome To The F@H Support Forum Ӂ Chrome Folding App (Beta) Ӂ Troubleshooting "Bad WUs" Ӂ Troubleshooting Server Connectivity Issues
User avatar
PantherX
Site Moderator
 
Posts: 6321
Joined: Wed Dec 23, 2009 9:33 am

Re: Dark look for the night owls

Postby Napoleon » Mon Dec 09, 2013 3:30 am

Brilliant! Installing Stylish (and the style itself) was a breeze on my browser of choice (Opera). Definitely easier on the eyes than any of the choices provided by UCP. A "must have" for me.

EDIT: Apparently specific font colors, defined by the [color=#FF0000]BBCode[/color] tag won't be available... still, not switching back. 8-)
Win7 64bit, FAH v7, OC'd
2C/4T Atom330 3x667MHz - GT430 2x832.5MHz - ION iGPU 3x466.7MHz
NaCl - Core_15 - display
User avatar
Napoleon
 
Posts: 1032
Joined: Wed May 26, 2010 2:31 pm
Location: Finland

Re: Dark look for the night owls

Postby grom » Mon Dec 09, 2013 12:03 pm

Thank you for the warm welcome and kind words.

@Napoleon, yes, any user-specified text color will be shown as bright red / pink with the forum style. It was intentional since that usually marks important parts of posts, but many user-chosen colors are not easily readable against dark backgrounds. As there are over 16 million selectable colors, it would have been unfeasible to specify them all. "Red for all" seemed like a good compromise. I could add a couple more most used colors if you wish.

Other notes worth mentioning about the forum style:
- Pande group is colored bright orange for better visibility on dark backgrounds, and for easier distinguishing from regular blue links / ordinary members.
- Individual post titles (subjects) are hidden to save vertical space, as from experience they only reflect titles of their threads. They are visible again on search pages, as that is where they prove very useful.
- All images are embedded as base64 strings. Basically, they are in there as text so the styles are self-contained.

I'm glad you guys like it. If you find any issues, freely let me know and I'll try to fix them. I'm subscribed to this topic.

Have a nice day.
grom
 
Posts: 7
Joined: Sat Dec 07, 2013 9:54 am

Re: Dark look for the night owls

Postby Napoleon » Mon Dec 09, 2013 1:19 pm

grom wrote:Napoleon, yes, any user-specified text color will be shown as bright red / pink with the forum style. It was intentional since that usually marks important parts of posts, but many user-chosen colors are not easily readable against dark backgrounds. As there are over 16 million selectable colors, it would have been unfeasible to specify them all. "Red for all" seemed like a good compromise. I could add a couple more most used colors if you wish.


Testing a bit...
This text should be red.
This text should be green.
This text should be blue.
This text should be yellow.

You can click "quote" to reply/check the BBCode tags I used in this post. As for what I see in my Opera browser... bold, italics & underline works, but the color tag has no effect whatsoever (all the text is white).

EDIT: Switching to ProBlue forum theme solved the problem.
Last edited by Napoleon on Mon Dec 09, 2013 4:08 pm, edited 1 time in total.
User avatar
Napoleon
 
Posts: 1032
Joined: Wed May 26, 2010 2:31 pm
Location: Finland

Re: Dark look for the night owls

Postby grom » Mon Dec 09, 2013 2:22 pm

Napoleon wrote:As for what I see in my Opera browser... bold, italics & underline works, but the color tag has no effect whatsoever (all the text is white).

Curious. It works here in Firefox, Chrome and Opera 12.16 (latest Presto based version of Opera). I included a screenshot named "Napoleon" on the page of the forum style, that is how user colored text should appear.

Do you mind if we take this to PM?
Steps for troubleshooting:
- can you please right-click here on the "red colored text within quotes" and choose "Inspect element" from your browser's context menu;
- take a screenshot of the Inspector which just opened at the bottom of your browser, and send me a link to it in PM.

Thank you. I will add those green, blue and yellow text colors during the next update, as bright green, bright blue and yellow.
grom
 
Posts: 7
Joined: Sat Dec 07, 2013 9:54 am

Re: Dark look for the night owls

Postby Napoleon » Mon Dec 09, 2013 3:06 pm

YGPM.
User avatar
Napoleon
 
Posts: 1032
Joined: Wed May 26, 2010 2:31 pm
Location: Finland

Re: Dark look for the night owls

Postby grom » Mon Dec 09, 2013 3:59 pm

Thank you for the PM, Napoleon. Issue was the selected theme in User Control Panel.

Style works with default ProBlue (ProDark, ProSilver etc) themes. Other themes such as Subsilver and Artodia do not provide optimal experience with the forum userstyle, because they change HTML markup of pages in significant degrees.
grom
 
Posts: 7
Joined: Sat Dec 07, 2013 9:54 am

Re: Dark look for the night owls

Postby Napoleon » Mon Dec 09, 2013 4:25 pm

Works, and looks even better now that I've switched from Subsilver2 to ProBlue. 8-)

About additional user-specified colours, do you think the following specific values would be OK?
[color=#00FF00]Green[/color]
[color=#0000FF]Blue[/color]
[color=#FFFF00]Yellow[/color]
User avatar
Napoleon
 
Posts: 1032
Joined: Wed May 26, 2010 2:31 pm
Location: Finland

Re: Dark look for the night owls

Postby grom » Tue Dec 10, 2013 4:08 pm

Both styles were updated today to fix reported omissions.

Forum style:
1) Added more user-selected text colors.
#008000, #008040, #00BF00, #00BF40, #00FF00, #00FF40,
#408000, #408040, #40BF00, #40BF40, #40FF00, #40FF40,
#80FF00, #80FF40, #80FF80 now all appear as light green (#9f9).
- #0000BF, #0000FF, #0040BF, #0040FF as light blue (#acf).
- #FFFF00, #FFFF40 as yellow (#ff7).
- #FF4000, #FF4040, #FF8000, #FF8040, #FFBF00, #FFBF40 as bright orange (#fc5).

2) Images in posts are now slightly dimmed until moused-over, to prevent unexpected "blinding" from bright screenshots.

EOC style:
Top left on the EOC site, "Processing" is once again orange and "Current" is green.

Have a nice day.

PS: In order not to bump this topic too often, reports of minor issues, bugs and feature requests can be sent over PM. Thank you. Regards.
grom
 
Posts: 7
Joined: Sat Dec 07, 2013 9:54 am

Re: Dark look for the night owls

Postby grom » Tue Jan 14, 2014 6:30 pm

Hello. Just letting you guys know there has been an update to the forum style.

Due to feedback, individual post titles are shown again. Those wanting to save vertical space by hiding them, simply uncomment /*.postbody > h3,*/ near the beginning of code. "To uncomment" means to remove /* from in front and */ from behind it.

There have been small fixes to some of the arrows (Previous PM, Next PM, Return to Inbox...).
PM list and Board Preferences have received a little more attention regarding backgrounds. Right side has a different background from the left side, like regular proBlue theme.
Highlighted / selected text keeps original text color, only background changes.

Thank you all, and enjoy.

------------------------------------------

PS: one thing I noticed when posting this is that page/tab titles are a little busy for multi taskers. You already know that you are on Folding Forum, and the icon is uniquely recognizable. Here is an extremely simple user script (careful! JavaScript) which shortens titles for you. Only aimed at those who spend much time here.
Tabs before:
Image
Tabs after:
Image
Code: Select all
// ==UserScript==
// @name           Folding Forum - Shorter titles
// @include        https://foldingforum.org/*
// @run-at         document-end
// ==/UserScript==

// Remove excess words from page titles
var title = document.querySelector("title").innerHTML.replace(/Folding Forum • (View topic - |View forum - )?/,"");
document.querySelector("title").innerHTML = title;

It works on Firefox (via Greasemonkey, or Scriptish), Chrome (via Tampermonkey, or save locally and drag-n-drop), Opera (save locally and Edit Site Preferences).

Thought I'd share. License of user script is CC Public Domain.

Kind regards.

[Edit:] A year later, the user script is even simpler and more efficient.
Code: Select all
// ==UserScript==
// @name           Folding Forum - Shorter titles
// @include        https://foldingforum.org/*
// @run-at         document-end
// ==/UserScript==

// trim page titles
document.title = document.title.replace(/Folding Forum • (View topic - |View forum - )?/, "");
grom
 
Posts: 7
Joined: Sat Dec 07, 2013 9:54 am

Re: Dark look for the night owls

Postby grom » Wed Mar 04, 2015 10:01 pm

Hello again. I just wanted to take the time to let you know about upcoming update to phpBB dark user style.

Due to (upcoming) changes in phpBB's default theme, I will update the style in about a week or two. This will overwrite any edits you've made to your copy of the style, if you installed it in a way that supports automatic updates (Stylish, Greasemonkey, Tampermonkey).

If you have made edits and would like to keep them, I recommend you make a copy of the style.

If you want to take a look at what the new phpBB's theme looks like, and why I need to update this style, take a look at VideoLAN's forum with the current user style enabled. Because these changes are mostly "under the hood", without any user styles the forum looks much the same as before.

There is no big rush with backing up your edits, but please do so in a timely fashion.

I wish you well, and thank you for your time. :)
grom
 
Posts: 7
Joined: Sat Dec 07, 2013 9:54 am


Return to 3rd party contributed software

Who is online

Users browsing this forum: No registered users and 2 guests

cron