Diz-e's Magical Stylings - for Forums and EFUSL

[Diz-e]

Hey guys! So, a while back I wrote some CSS edits to enhance EFUSL with cool themes - applied for you client-side by a browser app called Stylish - which I'd like to repost here. But that's not all!

Using the same method, you can choose to implement the code fixes I made for the "Purple Crystal" forum theme {[/size]edit: we have since moved to newer forums so this no longer applies[/size]}. This cleans up a few minor bugs and visual issues for the nice work Arc did when we changed to VB5, including but not limited to:

   
• Making the change avatar button accessible without hacks
• Visibility of forum nicks when sending PMs

How do you make it work? Well, firstly the Stylish app/extension/add-on/plugin is only available on Firefox, Chrome, Safari, or Opera, so you'll have to be using one of those browsers. Then follow these instructions from my original post {edit: you can now get the most recent theme in just a few clicks from the Stylish official repository by following the instructions in the last post}:

Install the Stylish plugin for your respective browser:

Firefox: https://addons.mozilla.org/en-US/firefox/addon/stylish/

Chrome: https://chrome.google.com/webstore/d...fgmeleoegfcffe

Then, download the attachment to this post that applies to your browser (e.g. underdark1-1_ffox.txt OR underdark1_chrome.txt) and follow the instructions below:

Firefox:

1. Go to Add-ons (Firefox button>Add-ons OR Tools>Add-ons)

2. Select "User Styles" on the left.

3. Click "Write new style".

4. In the new window that comes up, give it a name ("EFUSLUnderdark", "EFU Forum Fixes", or whatever you like).

4. Open up the attachment .txt file and copy all text.

5. Back in the New style window, click on line 1 in the big box and paste what you've copied.

6. Click Save.


Chrome:

1. You should have a little icon in the top right of the browser that sports a capital "S". Click on that, and select "Manage Styles". If you don't see the icon, go to the Chrome menu>More tools>Extensions, look for Stylish, and click on "Options".

2. Click "Write new style".

3. Give it a name ("EFUSLUnderdark", "EFU Forum Fixes", or whatever you like). Make sure you check the box just below that says "Enable".

4. Open up the attached .txt file and copy all text.

5. Back in Chrome's Add Style tab, click in the big "Code" box and paste what you've copied.

6. Beneath the Code box, click on the button that says "Specify".

7. Click the drop-down that says "URL" and select "URLs starting with".

8. Just to the right of that, enter http://efusl.efupw.com/ (for EFUSL) or http://www.efupw.com/forums/ (for forum fixes)

9. Click Save on the left.

Now you're ready to go! Whenever you visit EFUSL (or forums, for the fixes) the styles should be automatically applied. EFUSL will look something like the below:

If it was not clear, please note that you will have to create a new, separate style entry for each EFUSL theme (if you have more than one, only have one enabled at a time!), and also a separate one for the forum fixes.

The attachments are below with file names to suggest what's what (Underdark1 and Underdark2 essentially the same, but 1 is dark lake blue and 2 is forum purple - I recommend #2). I will add the code and instructions for Safari and Opera when I can. If you have any questions/suggestions, feel free to PM me... and as before, I welcome others skilled in CSS to create and share their own EFUSL themes!

[Diz-e]

Here are the files for the old Wyrm Watchers theme, updated and restored. Enjoy!

 

[Diz-e]

New theme: Ysinode1

[Diz-e]

I have added the latest theme to the official Stylish directory. Now you can install the Stylish plugin and EFUSL Ysinode theme with a couple of clicks....

1. Install the Stylish plugin for your respective browser:

Firefox: https://addons.mozilla.org/en-US/firefox/addon/stylish/

Chrome: https://chrome.google.com/webstore/d...fgmeleoegfcffe

Safari: http://sobolev.us/stylish/

Opera: https://addons.opera.com/en/extensions/details/stylish/

2. Once you have Stylish installed, go to the theme's directory page and click the "Install Style" button:

https://userstyles.org/styles/143786/efusl-ysinode1

3. Return to gaze upon your EFUSL page, and be inspired.

(If its not showing, make sure the style is activated from within the Stylish plugin/add-on/extension settings.)

Enjoy! I may add the other themes to the official directory later...

[Diz-e]

Unfortunately, the Stylish plugin, having changed ownership, was removed by Google and Mozilla for violating privacy policies.


Thankfully, the community responded by creating an open-source clone of the app which does not violate these policies, called  Stylus. You can find it here for Google Chrome, and here for Firefox.


Stylus is completely compatible with userstyles.org, so you can follow the same steps in Reply #3 above to have the Ysinode theme in just a few clicks!


Enjoy...