Has anybody here made a custom dark theme for the forum?

[kaycz]

I'm asking since there are no dark themes in board options and I know some people like to customize website CSS with web browser extensions like Stylus, I made a quick CSS to ease on my eyes but I'm not really that good with CSS, if anyone want to try out mine (though I hope someone has one better, if not I'll update this one later in case I missed anything):

Code: Select all

html, body, .postlink:hover {
    background-color: #000;
}

h3 {
    border-bottom-color: #000;
}

li.row:hover {
    background-color: #939393;
}

li.row:hover dd {
    border-left-color: #333;
}

html, body, h3, li.row strong, time, .icon.icon-lightgray, .responsive-hide, .titlespace, .list-inner a, .footer-copyright, .footer-copyright a, .footer-link-text, .footer-row, .forumtitle, .list-inner, .postlink, ul.topiclist li, .lastsubject, .username, .action-bar a, .icon.icon-black, a:hover .icon.icon-black , .stat-block a, .forum-title a, .topictitle, .inner a, dt.author, dd.search-result-date, .postprofile dd, .postprofile strong, .searchresults-title, .searchresults-title a, .arrow-left, .posting-title a, .inner.bbcode-status:hover a {
    color: #fff;
}

ul.forums > li.row:first-child, .forabg, .forumbg {
    background-image: linear-gradient(to bottom, #626262 0%,#B3B3B3 100%);
}

ul.forums > li.row, .bg1 {
    background-color: #B3B3B3;
}

li.row, .bg1 {
    border-top-color: #333;
    border-bottom-color: #333;
}

.pagination li a {
    background: #626262;
    border-color: #86be43;
}

.pagination li a, a:hover .icon.icon-lightgray, .arrow-left:hover, .arrow-right:hover, .postlink:hover, .topic-title a, .forabg .header a:hover, h2.memberlist-title, .inner a, .ucp-title {
    color: #86be43;
}

.pagination li a:hover, .pagination li a:hover .icon, .pagination .dropdown-visible a.dropdown-trigger, .nojs .pagination .dropdown-container:hover a.dropdown-trigger {
    background: #86be43;
    color: #626262;
    border-color: #86be43;
}

.panel .bg2:hover, #postingbox.panel:hover {
    background: #86be43;
}

.search-header {
    box-shadow: 0 0 10px #86be43;
}

.bg2 {
	background-color: #626262;
}

.jumpbox-forum-link:hover {
    background-color: #626262;
}

.postlink {
    border-bottom-color: #fff;
}

.wrap {
    background-color: #000;
    border-color: #000;
}

.headerbar, .navbar, .panel, ul.forums > li.row:first-child:hover, .bg1:hover, .bg2:hover, :not(.row .big-column).bg3,.tabs .tab > a, .jumpbox-cat-link:hover, .jumpbox-sub-link:hover {
    background-color: #aaa;
}

.headerbar, .forabg, .forumbg, .badge {
    background-image: linear-gradient(to bottom, #0F0F0E 0%,#393939 2px,#757575 92px,#939393 100%);
}

.navbar a, #page-footer li, .copyright, .header-profile .username, .crumb, .rules a, .button span, .jumpbox-cat-link span, .jumpbox-sub-link span, .cp-menu a, #postingbox.panel:hover .inner a {
    color: #2b2b2b;
}

.navigation a {
    background: linear-gradient(to right, #FFF 50%,#e1e1e1 100%);
}

.navigation a:hover, .tabs .tab > a:hover {
    color: #828282;
}

.rules a {
    border-bottom-color: #2b2b2b;
}

.cookiebanner span, .cookiebanner .cookiebanner-close {
    color: #000;
}

[dave0808]

This forum uses phpBB, which has its own mechanism for modifying the page style. In fact you can go to your User Control Panel by clicking on your login name in the top corner of the web page, then go to Board Preferences, and select the style you'd like to use.

Unfortunately, at the moment, there are only 2. The standard prosilver, which comes with phpBB, plus another called 'minty', presumably created by the forum admins.

I would take a look at creating a new style, probably based on minty, but dark. I would like to think that the forum admins would be amenable to deploying a decent dark theme though I do not speak for them.

One thing though, as phpBB gets developed, so the themes get updated too. So my advice is to not go overboard by changing everything you can. Keep the changes to a minimum, so that future updates to the main theme can be merged in with any new theme as easily as possible.