Dark theme for Suprbay (Easy setup)

[techtac]

Let me start by saying that I'm not a pro at styling/CSS. This is something i put together because recently i started spending a lot of time on Suprbay and I'm a night owl. So the bright screen kind of start to burn my eyes within a few hours. This is just a simple solution i made for myself and thought of sharing it with everyone. The theme is built only with CSS so it's pretty much weightless.



Remember this is not a finalized version. There could be a lot of bugs. All the CSS pros are welcome to develop this further. To install this all you have to do is get the Stylish (Userstyles) extension for your browser and install the "Suprbay Dark" theme from the library or by visiting the theme URL.

Stylish for Chrome - https://chrome.google.com/webstore/detai...cffe?hl=en

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

An alternative for Safari users - https://sobolev.us/stylish/

Suprbay Dark theme - https://userstyles.org/styles/156808/suprbay-dark

For anybody who likes to take a peek here's the source. If you like you can just copy this source and import into Stylish. If there's any confusion in installing and managing the theme, just Follow this video guide.

Code:

@-moz-document url-prefix("https://pirates-forum.org") {
table,
body,
textarea {
   color: #d3d3d3 !important;
}
.tborder,
#footer,
body {
   background: #1d1d1d !important;
}
.post.classic .post_author {
   border: 1px solid #1d1d1d !important;
}
.post .post_author,
blockquote,
.post_controls,
#panel .lower,
#footer .upper.tpb_links,
#footer .upper.sb_links,
#footer .upper.contact,
textarea {
   background: #2f2f2f !important;
}
.post .post_author div.author_avatar img {
   padding: 0px !important;
   margin: 5px !important;
   box-shadow: 0 0 12px rgb(255, 255, 255) !important;
   background: none !important;
}
.reputation_positive {
   color: #06b506 !important;
}
.post_body a:link,
.post_body a:visited {
   color: #03A9F4 !important;
}
#content {
   background: #1d1d1d !important;
   color: #d3d3d3 !important;
   box-shadow: 0 0 8px rgb(255, 255, 255) !important;
}
a:link,
a:visited,
a:hover,
a:active {
   color: #d3d3d3 !important;
}
.navigation .active,
.pagination .pagination_current,
blockquote cite > span,
#container {
   color: #fff !important;
}
.pagination a {
   background: #3e3e3e !important;
}
.post .post_author div.author_statistics {
   color: #c7c7c7 !important;
}
.postbit_buttons > a:link {
   background: none !important;
}
.tfoot {
   border-top: 1px solid #5d5d5d !important;
   background: #1d1d1d !important;
}
.trow1,
.trow2 {
   background: #2f2f2f !important;
   border-color: #7b7b7b !important;
}
#site_status,
#team_no_pm {
   background: #272727 !important;
}
*::-webkit-scrollbar {
   width: 10px !important;
   height: 10px !important;
   background: #1e1e1e !important;
   border: 1px solid #252525 !important;
}
*::-webkit-scrollbar-button {
   display: none !important;
}
*::-webkit-scrollbar-thumb,
*::-webkit-scrollbar-track {
   border: 0 !important;
   box-shadow: none !important;
}
*::-webkit-scrollbar-thumb {
   min-height: 28px !important;
   background: #333 !important;
}
*::-webkit-scrollbar-corner,
*::-webkit-scrollbar-track {
   background: #1e1e1e !important;
}
}

Hope you enjoy this and contribute to develop this further. 

[dueda]

Nice addition, congratz!

[techtac]

Nice addition, congratz!

Thank you.

[contrail]

This looks interesting. Maybe it could be useful enough at some point to be implemented here.

[techtac]

This looks interesting. Maybe it could be useful enough at some point to be implemented here.

I agree. But still it needs a lot more work to be stable.

[Aralexus]

No Stylish for Opera?

[PiX]

It would be convenient if the dark mode theme was default and could be selected-changed in the account preferences.

[Slow Mo]

Well, it did not happen all the 4 years, unlikely to happen now...

[funkybass]

Very nice theme, but I'm wondering if we can optimize this process. See, you have to install Stylish, and I'm wondering if it'll be more efficient to convert it to a userscript that embeds CSS. Weird preference I know, but I reckon more users would have greasemonkey installed than they do Stylish.

[lustrous]

Oh, thanks! My eyes can finally rest for once. It feels as if the spirit of the French Revolution has manifested in the form of Dark Mode, granting respite to my weary eyes. At last, visual tranquility is within reach!