I made a couple of nice themes for boards.ie. Check them out!

I've been off work for the last couple of weeks and have been playing around with theming the site.. I don't like the default skin and I really dislike the dark skin. Like all web-devs, I like when people use something I've made so I'm sharing them. There are quite a lot of changes to the site overall.. Not just colours.
For now, it's just two dark modes. Dark purple and dark blue. I'll add two clear themes later this week, or you can find them in the Feedback "Skins" thread and install them yourself.


Screenshot:




The extension is Stylus. I use this extensively all over the internet as other users submit styles for all the big sites. I have dark modes for FB, the Guardian, Google etc. so even if you don't want these themes, I still highly recommend the extension.

Firefox: https://addons.mozilla.org/en-US/firefox/addon/styl-us/
Chrome: https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne?hl=en

How to install: Click the icon and click Find Styles. Look for Dark Blue / Dark Charade





They're not 100% finished yet so feedback is welcome. Bump if you like them so others will see them.

What information do you get if someone uses them?

ReginaldSmythV

ReginaldSmythV wrote: »

What information do you get if someone uses them?

Me? It's just CSS, not JS, so it's impossible for me to get anything. The extension has hundreds of thousands of installs and is recommended by Firefox. It has 350k installs on Chrome and is 4.7 / 5.

BeerWolf

I don't trust Ads by Google!

Gretas Gonna Get Ya!

What if you collect our personal details from this script... and then before we know it, we're kidnapped and we wake up drugged and lying in a warm bathtub, having our organs harvested for sale on the south american medical black market?

It does happen!

Gretas Gonna Get Ya!

Gretas Gonna Get Ya! wrote: »

What if you collect our personal details from this script... and then before we know it, we're kidnapped and we wake up drugged and lying in a warm bathtub, having our organs harvested for sale on the south american medical black market?

It does happen!

I live in South East Asia so I'll be using the Bangkok medical black market.

Hodors Appletart

excellent thank you thar black and orange halloween theme is shocking

Mr. CooL ICE

Mod: Stickied. Because this is pretty damn awesome.

begbysback

I hate ads, but the skins are cool

Mark Rippetoe

Mark Rippetoe wrote: »

Mod: Stickied. Because this is pretty damn awesome.

Thanks. I thought it might be one or two hundred lines but vBulletin is so hard to work with, it ended up being over 700 with all the comments stripped out. There aren't enough css classes added to the html compared to what I'm used to working with.

I made a few changes since I posted so anyone who started using it early, and the new post button while viewing a forum is half hidden, should do the upgrade in the options menu of the extension.

Mint Sauce

begbysback wrote: »

I hate ads, but the skins are cool

Is that a new Poster?

Can they be used on touch site, Mr Google?

Strawberry Milkshake

Strawberry Milkshake wrote: »

Can they be used on touch site, Mr Google?

Only Firefox on mobile can have extensions like Stylus. No idea why Chrome doesn't allow them. Not really worth the effort personally as I think the Touch theme is fine, and very few people would use them.

MissDisaster

Gretas Gonna Get Ya! wrote: »

What if you collect our personal details from this script... and then before we know it, we're kidnapped and we wake up drugged and lying in a warm bathtub, having our organs harvested for sale on the south american medical black market?

It does happen!

At this stage Id welcome the warm bubble bath alone.:pac:

Fr_Dougal

Deleted User wrote: »

Me? It's just CSS, not JS, so it's impossible for me to get anything. The extension has hundreds of thousands of installs and is recommended by Firefox. It has 350k installs on Chrome and is 4.7 / 5.

Any chance you could have the site and give us back the old version?

Won’t. Say. A . Word. To anyone.

arybvtcw0eolkf

Fr_Dougal wrote: »

Any chance you could have the site and give us back the old version?

Won’t. Say. A . Word. To anyone.

I hate that I can't navigate between the different forums like I used to. I'm barely using boards.ie now for that reason.

Canis Lupus

Ariella Ashy Letter wrote: »

I hate that I can't navigate between the different forums like I used to. I'm barely using boards.ie now for that reason.

What version are you using? I've always just used the default skin and navigation is the same as it has always been with the old school drop down menus etc. I even force it on the mobile which is more faffy but bearable.

Canis Lupus

Canis Lupus wrote: »

What version are you using? I've always just used the default skin and navigation is the same as it has always been with the old school drop down menus etc. I even force it on the mobile which is more faffy but bearable.

Old school as in you have around 15 menus along the top, or four starting with talk to.?

Canis Lupus

Deleted User wrote: »

Old school as in you have around 15 menus along the top, or four starting with talk to.?

4 starting with Talk To although I appreciate it changed a while back it's not intrinsically different. I've never bothered with mobile, touch or enhanced or whatever the names for all those different versions were/are.

Hotblack Desiato

Based on Ads by Google's work (much appreciated) I've changed the colours to get as close as possible to the really old white/beta skin (colours picked off an old screenshot.)

/* FONTS */

/* Primary Dark blue font */
.page a,
.nav-drop-menu a ,
#breadcrumb a,
#footer a,
.time,
legend {
/*  color: #3c508c aliceblue !important;*/
    /*Poster Name*/
  /*color: #3c508c !important;*/
  color: #22229c !important;
    
}

/* White Font */
.thead strong,
.thead a,
.thead,
.thead span,
.tfoot strong,
.tfoot a,
.tfoot,
.tfoot span,
.tcat a{
	color: #fff !important;
}

/* Black Font and Main Post Background */
.alt1 {
    color: #182339;
    /*background: #f8f8ff;*/
    background: #f5f5ff;
}
.alt2 {
    color: #182339;
 /*       background: #efefef;*/
    /*Left Panel & Quoted Post Background*/
    /*background: #e8e8f8;*/
    background: #e1e4f2;
}
/* BACKGROUNDS */

/* Lightest blue back */
body,
.body-override,
#nav .nav-drop-menu,
#nav .columncontainer
#nav .title,
.page,
#footer {
  background: #ffffff;
}


/* Dark blue back */
.nav-area,
#nav > li.hover > a,
.generic-wrapper-header .active {
  background: #7f98c4  !important;
  color: #fff !important;
}
#nav > li.hover {
    background: #81938e !important;
}

/* Darkest blue back */
#header,
.threads-wrapper-header,
.generic-wrapper-header,
.thead,
.tfoot {
  /*background: #5572a5 !important;*/
  background: #3e5687 !important;
}

/* BUTTONS */

.gradient_button:not(.grey),
.jumpbutton ,
#adv-search-form button span {
	background: #5572a5 !important;
	border: 1px solid #4a5c58 !important;  
}
.gradient_button:not(.grey):hover,
.jumpbutton:hover ,
#adv-search-form button span:hover {
	background: #3c508c !important;
	border: 1px solid #4a5c58 !important;
}
.gradient_button.grey {
  background: #f9f9f9;
}
#adv-search-form button {
  border: 0 !important;
}

/* BORDERS */

/* Dark blue border */
.nav-area {
  border-bottom: 1px solid #3c508c !important;
}
#nav li {
  border-left: 1px solid #3c508c !important;
}


/* MISC */

/* User / My forums dropdown */
#userlist div,
#forumlist div,
#userlist a,
#forumlist a {
  background: #7f98c4 !important;
  color: #fff !important;
}
#userlist a:hover,
#forumlist a:hover {
  background: #5572a5 !important;
}
#userlist,
#forumlist {
  margin-top: 4px !important;
  background: none !important;
}
#userlist .title,
#forumlist .title {
  border-bottom-color: #5572a5
}
/* Tabs on User Page */
.tcat {
  background: #3c508c;
}
#profile_tabs .tab_list li:hover {
  background: #3c508c !important;
}
.tborder, 
.tcat {
  border: 1px solid #3c508c !important;
  border-bottom: 1px solid #3c508c !important;
}

/* Outline of Reply Box */
.panelsurround {
    background-color: #f5f5ff;
}

/* Message Box */
#vB_Editor_QR,
#vB_Editor_QR_iframe,
#vB_Editor_001,
#vB_Editor_001_iframe {
  border: 1px solid #3c508c !important;
}

/* Search Results */
.results-wrapper,
.facet_wrapper {
	background: #fff;
	border: 1px solid #81938e;
}
.results-wrapper a,
.facet_wrapper a {
	color: #3f4d4a !important;
}

/* Recolour Items */
/* #ddd */
.arrow-disable {
  filter: brightness(0) saturate(100%) invert(100%) sepia(2%) saturate(2381%) 
hue-rotate(291deg) brightness(91%) contrast(90%);
}

/* QOL Fix Min Width of page */
body, .holder, #header {
  min-width: 500px !important;
}
/* Hide share buttons to save pagination when screen gets small */
@media only screen and (max-width:1000px) {
  .social_share_bar {
    display: none !important;
  }
}
/* Fix submit button */
@media only screen and (max-width:900px) {
  #vB_Editor_QR_formbuttons {
    display: inline
  }
}

/* Fewer ads */
.top_adslot_wrapper,
.sponsored-content,
#top_adslot_main,
iframe[title="3rd party ad content"] {
  display: none;
}

Install Stylus, click on it, click on 'write style for boards.ie', paste in the above and save.

Enjoy!

seligehgit

Hotblack Desiato wrote: »

Based on Ads by Google's work (much appreciated) I've changed the colours to get as close as possible to the really old white/beta skin (colours picked off an old screenshot.)

/* FONTS */

/* Primary Dark blue font */
.page a,
.nav-drop-menu a ,
#breadcrumb a,
#footer a,
.time,
legend {
/*  color: #3c508c aliceblue !important;*/
    /*Poster Name*/
  /*color: #3c508c !important;*/
  color: #22229c !important;
    
}

/* White Font */
.thead strong,
.thead a,
.thead,
.thead span,
.tfoot strong,
.tfoot a,
.tfoot,
.tfoot span,
.tcat a{
	color: #fff !important;
}

/* Black Font and Main Post Background */
.alt1 {
    color: #182339;
    /*background: #f8f8ff;*/
    background: #f5f5ff;
}
.alt2 {
    color: #182339;
 /*       background: #efefef;*/
    /*Left Panel & Quoted Post Background*/
    /*background: #e8e8f8;*/
    background: #e1e4f2;
}
/* BACKGROUNDS */

/* Lightest blue back */
body,
.body-override,
#nav .nav-drop-menu,
#nav .columncontainer
#nav .title,
.page,
#footer {
  background: #ffffff;
}


/* Dark blue back */
.nav-area,
#nav > li.hover > a,
.generic-wrapper-header .active {
  background: #7f98c4  !important;
  color: #fff !important;
}
#nav > li.hover {
    background: #81938e !important;
}

/* Darkest blue back */
#header,
.threads-wrapper-header,
.generic-wrapper-header,
.thead,
.tfoot {
  /*background: #5572a5 !important;*/
  background: #3e5687 !important;
}

/* BUTTONS */

.gradient_button:not(.grey),
.jumpbutton ,
#adv-search-form button span {
	background: #5572a5 !important;
	border: 1px solid #4a5c58 !important;  
}
.gradient_button:not(.grey):hover,
.jumpbutton:hover ,
#adv-search-form button span:hover {
	background: #3c508c !important;
	border: 1px solid #4a5c58 !important;
}
.gradient_button.grey {
  background: #f9f9f9;
}
#adv-search-form button {
  border: 0 !important;
}

/* BORDERS */

/* Dark blue border */
.nav-area {
  border-bottom: 1px solid #3c508c !important;
}
#nav li {
  border-left: 1px solid #3c508c !important;
}


/* MISC */

/* User / My forums dropdown */
#userlist div,
#forumlist div,
#userlist a,
#forumlist a {
  background: #7f98c4 !important;
  color: #fff !important;
}
#userlist a:hover,
#forumlist a:hover {
  background: #5572a5 !important;
}
#userlist,
#forumlist {
  margin-top: 4px !important;
  background: none !important;
}
#userlist .title,
#forumlist .title {
  border-bottom-color: #5572a5
}
/* Tabs on User Page */
.tcat {
  background: #3c508c;
}
#profile_tabs .tab_list li:hover {
  background: #3c508c !important;
}
.tborder, 
.tcat {
  border: 1px solid #3c508c !important;
  border-bottom: 1px solid #3c508c !important;
}

/* Outline of Reply Box */
.panelsurround {
    background-color: #f5f5ff;
}

/* Message Box */
#vB_Editor_QR,
#vB_Editor_QR_iframe,
#vB_Editor_001,
#vB_Editor_001_iframe {
  border: 1px solid #3c508c !important;
}

/* Search Results */
.results-wrapper,
.facet_wrapper {
	background: #fff;
	border: 1px solid #81938e;
}
.results-wrapper a,
.facet_wrapper a {
	color: #3f4d4a !important;
}

/* Recolour Items */
/* #ddd */
.arrow-disable {
  filter: brightness(0) saturate(100%) invert(100%) sepia(2%) saturate(2381%) 
hue-rotate(291deg) brightness(91%) contrast(90%);
}

/* QOL Fix Min Width of page */
body, .holder, #header {
  min-width: 500px !important;
}
/* Hide share buttons to save pagination when screen gets small */
@media only screen and (max-width:1000px) {
  .social_share_bar {
    display: none !important;
  }
}
/* Fix submit button */
@media only screen and (max-width:900px) {
  #vB_Editor_QR_formbuttons {
    display: inline
  }
}

/* Fewer ads */
.top_adslot_wrapper,
.sponsored-content,
#top_adslot_main,
iframe[title="3rd party ad content"] {
  display: none;
}

Install Stylus, click on it, click on 'write style for boards.ie', paste in the above and save.

Enjoy!

Thanks so much to both you guys.

Love Hotblack Desiato's old style theme!!Now installed.

@media

And old green which was the theme I previously used all the time.

[HTML]/* FONTS */

/* Primary Dark green font */
.page a,
.nav-drop-menu a ,
#breadcrumb a,
#footer a,
.time,
legend {
color: #1c2321 !important;
}

/* White Font */
.thead strong,
.thead a,
.thead,
.thead span,
.tfoot strong,
.tfoot a,
.tfoot,
.tfoot span,
.tcat a{
color: #fff !important;
}

/* Black Font */
.alt1, .alt2 {
color: #000;
}

/* BACKGROUNDS */

/* Lightest green back */
body,
.body-override,
#nav .nav-drop-menu,
#nav .columncontainer,
#nav .title,
.page,
#footer {
background: #e7eeee !important;
}


/* Dark green back */
.nav-area,
#nav > li.hover > a,
.generic-wrapper-header .active {
background: #81938e !important;
color: #fff !important;
}
#nav > li.hover {
background: #81938e !important;
}

/* Darkest green back */
#header,
.threads-wrapper-header,
.generic-wrapper-header,
.thead,
.tfoot {
background: #667b76 !important;
}

/* BUTTONS */

.gradient_button:not(.grey),
.jumpbutton ,
#adv-search-form button span {
background: #667b76 !important;
border: 1px solid #4a5c58 !important;
}
.gradient_button:not(.grey):hover,
.jumpbutton:hover ,
#adv-search-form button span:hover {
background: #4e645f !important;
border: 1px solid #4a5c58 !important;
}
.gradient_button.grey {
background: #f9f9f9;
}
#adv-search-form button {
border: 0 !important;
}

/* BORDERS */

/* Dark green border */
.nav-area {
border-bottom: 1px solid #4e645f !important;
}
#nav li {
border-left: 1px solid #4e645f !important;
}


/* MISC */

/* User / My forums dropdown */
#userlist div,
#forumlist div,
#userlist a,
#forumlist a {
background: #81938e !important;
color: #fff !important;
}
#userlist a:hover,
#forumlist a:hover {
background: #667b76 !important;
}
#userlist,
#forumlist {
margin-top: 4px !important;
background: none !important;
}
#userlist .title,
#forumlist .title {
border-bottom-color: #667b76
}
/* Tabs on User Page */
.tcat {
background: #485854;
}
#profile_tabs .tab_list li:hover {
background: #4e645f !important;
}
.tborder,
.tcat {
border: 1px solid #4e645f !important;
border-bottom: 1px solid #485854 !important;
}

/* Message Box */
#vB_Editor_QR,
#vB_Editor_QR_iframe,
#vB_Editor_001,
#vB_Editor_001_iframe {
border: 1px solid #4e645f !important;
}

/* Search Results */

.results-wrapper,
.facet_wrapper {
background: #fff;
border: 1px solid #81938e;
}
.results-wrapper a,
.facet_wrapper a {
color: #3f4d4a !important;
}

/* Recolour Items */
/* #ddd */
.arrow-disable {
filter: brightness(0) saturate(100%) invert(100%) sepia(2%) saturate(2381%) hue-rotate(291deg) brightness(91%) contrast(90%);
}

/* QOL Fix Min Width of page */
body, .holder, #header {
min-width: 500px !important;
}
/* Hide share buttons to save pagination when screen gets small */
@media only screen and (max-width:1000px) {
.social_share_bar {
display: none !important;
}
}
/* Fix submit button */
@media only screen and (max-width:900px) {
#vB_Editor_QR_formbuttons {
display: inline
}
}

/* Fewer ads */
.top_adslot_wrapper,
.sponsored-content,
#top_adslot_main,
iframe[title="3rd party ad content"] {
display: none;
}[/HTML]

I'm not adding these directly to the extension as they're not really fully done and I'm working on something new at the moment.

(Other web devs - Please don't judge. I start well and as it drags on, I get sloppy with my CSS.)

Hotblack Desiato

seligehgit wrote: »

Love Hotblack Desiato's old style theme!!Now installed.

All I did was tweak some of the colour values. I wouldn't have a clue about the rest of it.

Hodors Appletart

I see the lines of code but I have no idea what to do with them to get my boards to looks like what they are making it look like

I have stylus and I'm using Dark Blue theme but i'm interested in the green

Hodors Appletart

Hodors Appletart wrote: »

I see the lines of code but I have no idea what to do with them to get my boards to looks like what they are making it look like

I have stylus and I'm using Dark Blue theme but i'm interested in the green

When you click the icon, the dropdown has

Write style for:
www.boards.iethis URL

Click the boards.ie part and paste in the code above. Then disable the dark blue one.

Hodors Appletart

thanks for that

do I need to be on the lighter native theme for that to work correctly

Hodors Appletart

just answered that myself, and the answer is yes

Hodors Appletart

the green theme is pretty close to the old school green thats amazing thanks you should win a prize or something

arybvtcw0eolkf

Canis Lupus wrote: »

What version are you using? I've always just used the default skin and navigation is the same as it has always been with the old school drop down menus etc. I even force it on the mobile which is more faffy but bearable.

Dunno which it was but it was easier to navigate that whatever I was put onto last week. I used to have handy drop down menu's, but they're all gone now.

The one I'm on now is dreadful and very difficult to get to the forum I'd normally use so now I'm putting a keyword into the search and taking the long way to a forum.

I'd normally use AH (like most), motorbikes and some of the sports forum ie cycling, running & athletics & swimming.

I'm hardly using any of them now.

Hotblack Desiato

Ariella Ashy Letter wrote: »

I hate that I can't navigate between the different forums like I used to. I'm barely using boards.ie now for that reason.

Follow the forums you use the most, then go to your Control Panel, links to your followed forums will be below your unread followed threads. I haven't used the top menu for years.

d51984

Been using the Black one the last week, really liking it. Thanks and Well done OP.

BlaktainPicard

Nice one, ill check some of these out!

andekwarhola

Excellent, thanks!!!

Sir Oxman

Deleted User wrote: »

I've been off work for the last couple of weeks and have been playing around with theming the site.. I don't like the default skin and I really dislike the dark skin. Like all web-devs, I like when people use something I've made so I'm sharing them. There are quite a lot of changes to the site overall.. Not just colours.
For now, it's just two dark modes. Dark purple and dark blue. I'll add two clear themes later this week, or you can find them in the Feedback "Skins" thread and install them yourself.

Thanks very much for this.

kenmm

Gretas Gonna Get Ya! wrote: »

What if you collect our personal details from this script... and then before we know it, we're kidnapped and we wake up drugged and lying in a warm bathtub, having our organs harvested for sale on the south american medical black market?

It does happen!

Jesus. I definitely couldn't go through that again. Once was enough after getting those 6 'free' CDs in '97

Bump for all who haven't seen this.

Mr. CooL ICE

It's stickied. Why are you trying to bump it?

Mr. CooL ICE

Mr. CooL ICE wrote: »

It's stickied. Why are you trying to bump it?

Bored and saw the link in my signature. No posts in two months. Not particularly excessive.

WillieBradny

WillieBradny wrote: »

alright not bad

Hope you got paid well for your new design?

Why would I get paid for that. It's not for them.

dudeeile

ReginaldSmythV wrote: »

What information do you get if someone uses them?

The extension is the problem, full tracking across all your browsing.

Hotblack Desiato

dudeeile wrote: »

The extension is the problem, full tracking across all your browsing.

Stylus is a Stylish fork without analytics

And here's their privacy policy

https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne

Privacy Policy

Unlike other similar extensions, we don't find you to be all that interesting. Your questionable browsing history should remain between you and the NSA. Stylus collects nothing. Period.

Quantum Erasure

We can unsticky this thread...

Scotty #

https://boards.ie/discussion/comment/117611594#Comment_117611594

This thread is more important than ever what with the new horrendous CSS styling on Boards, on desktop anyway.

Scotty #

First thing you need to add is...

.postbit-posttools, .postbit-userinfo {
  max-width: 195px;
  overflow: hidden;
}

https://boards.ie/discussion/comment/117611594#Comment_117611594

A lot of users who forget to disable my theme are going to have a bad time. When applied to the new site, it breaks loads of buttons. Although not that many people used this anyways I don't think.

I might redo it for the new site but can't do anything until boards.ie are finished with their theming.

MEGA BRO WOLF 5000

https://boards.ie/discussion/comment/112430173#Comment_112430173

At that point youd be dead so i wouldn't worry about it.

mistersifter

https://boards.ie/discussion/comment/117613007#Comment_117613007

had no idea about this and never disabled the theme! Is this why the new site isnt working? Which buttons does it affect?

Hopefully the dark theme can be brought back at some stage anyway cos Im struggling to look at the site now.

game4it70

https://boards.ie/discussion/comment/117628702#Comment_117628702

I'm in the same boat.

Esel

Check if your browser has a dark mode. I use it on Firefox, works on nearly all sites.

Scotty #

Anyone still using Stylebot, adding the following will tidy things up a little on desktop. It get's rid of the ad column on the right and stretches the post over to fill the space and also narrows the user column on the left.

.postbit-postdetails .postbit-postbody {
    margin-left: 198px;
}

.Panel.Panel-main {
    display: none;
}

.Content.MainContent {
    width: 100%;
}

Scotty #

A few more upgrades...

It now also makes the whole header 'sticky' including the breadcrumbs. Twitter and Facebook icons removed also.

Note: these changes are liable to stop working at any time if Boards/Vanilla make changes.

.postbit-postdetails .postbit-postbody {
    margin-left: 220px;
}


.Panel.Panel-main {
    display: none;
}


.Content.MainContent {
    width: 100%;
}


/*Remove Twitter/Facebook buttons */
.ReactSprite {
    display: none;
}

/* Make whole header sticky  */
.BreadcrumbsBox { 
  position: fixed;
  top: 47px;
}


.Breadcrumbs {
  margin-bottom: 0;
  margin-top: 25px;
}


.vanilla-1tbhbgw-titleBar-container {
position: fixed;
height:auto;
}


.Frame-content {
    margin-top: 90px;
}