Jump to content
Sign in to follow this  
Kingsley1997

Dark Forum Theme

Recommended Posts

I've made a very rough theme for this forum since I can't stand the ugly box shadows and dark grey on white... I've tried to resemble Windows 10 in its dark look. It's very rough at the moment as I've only spent like 30 minutes on it but if you want to improve it please post back here with the CSS.

 

nRXPP2W.jpg

 

I'm using Styler to load the CSS (Chrome app).

 

CSS:

.maintitle {
    border: 1px solid rgba(57, 145, 255, 0.25) !important;
    box-shadow: none !important;
    background: #272727 !important;
    color: #FFF !important;
}
 
.table_wrap {
    box-shadow: none !important;
    border: 1px solid rgba(57, 145, 255, 0.25) !important;
    border-width: 0 1px 1px 1px !important;
    padding: 0 !important;
}
 
table.ipb_table {
    background: #1B1B1B;
}
 
body {
    background-color: #232323;
  color:#999;
}
 
.maintitle a {
    color: inherit !important;
}
 
a {
    color: #FFF;
}
 
#page-header-wrapper {
    background: #1B1B1B;
    box-shadow: none !important;
}
 
#page-header-wrapper .navbar-nav>li {
    border: none !important;
}
 
#page-header-wrapper .navbar-brand {
    background: url("/public/style_images/bohemia/logo_white.png") no-repeat center center #232323 !important;
}
 
#page-header-wrapper .nav>li>.btn:hover {
    background-color: #232323;
    transition: all .15s ease;
    color: #A0A0A0;
}
 
.ipsHeaderMenu {
    background-color: #171717;
    box-shadow: none !important;
  margin-top: -1px !important;
  ;
}
 
.ipsHeaderMenu .ipsType_sectiontitle {
    color: #AAA !important;
}
 
#user_notifications_link_menucontent.ipsHeaderMenu a, #user_inbox_link_menucontent.ipsHeaderMenu a {
    color: #AAA !important;
}
 
#page-header-wrapper .nav.navbar-right>li {
    border: none !important;   
    background-color: #1B1B1B;
}
 
#user_link.menu_active, #notify_link.menu_active, #inbox_link.menu_active {
    background: #171717 !important;
}
 
#community_app_menu>li>a {
    background-color: #1B1B1B;
    color: #FFF;
    border: none !important;
}
 
#community_app_menu>li.active>a {
    background-color: #1B1B1B;
}
 
#search_wrap {
    background: #1B1B1B;
    box-shadow: none !important;
}
 
#search .submit_input {
    border: none !important;
}
 
#adv_search {
    border: none !important;
    background: url(/public/style_images/bohemia/advanced_search.png) no-repeat center 50% #080808;
    height: 32px;
    width: 32px;
}
 
#main_search {
    color: #FFF !important;
}
 
#board_stats .value {
    background: #1B1B1B;
    box-shadow: none !important;
}
 
.desc, .desc.blend_links a, p.posted_info {
    color: #999;
}
 
table.ipb_table td {
    border-bottom: 1px solid #232323;
}
 
.ipsSideBlock {
    background: #1B1B1B !important;
    box-shadow: none !important;
}
 
.ipsSideBlock h3 {
    color: #FFF !important;
    background-color: #191919 !important;
    border-bottom: 1px solid #232323 !important;
}
 
.ipsType_pagetitle, .ipsType_subtitle {
    color: #FFF !important;
}
 
.topic_buttons li.important a, .post_controls li.important a, .topic_buttons li.important span, .post_controls li.important span, .ipsButton .important, .topic_buttons li a, .post_controls li a, .topic_buttons li span, .ipsButton, .__like a {
    box-shadow: none !important;
}
 
.ipsButton_extra {
}
 
.post_block h3 {
    background: #272727 !important;
    border: 1px solid rgba(57, 145, 255, 0.25) !important;
    border-width: 1px 0px 1px 0px !important;
}
 
.ipsBox, .ipsPad {
    padding: 0 !important;
}
 
.topic {
    margin-top: 10px !important;
}
 
.post_block {
    background-color: #272727;
    box-shadow: none !important;
}
 
.post_body .post {
    color: #FFF;
}
 
.post_wrap {
    border: 1px solid rgba(57, 145, 255, 0.25) !important;
    border-width: 0px 1px 1px 1px !important;
}
 
.post_block.hentry {
    margin-top: 10px !important;
}
 
.post_body {
    border-left: 1px solid #313131;
}
 
.edit {
    color: #999;
}
 
ul.post_controls a {
    min-height: 30px;
    line-height: 30px !important;
}
 
ul.post_controls a:hover {
    color: #FFF;
}
 
.signature {
    border-top: 1px solid #313131;
    color: #999;
}
 
* {
    box-shadow: none !important;
}
 
.breadcrumb a {
    color: #999;
}
 
p.citation {
    background: #232323 !important;
    border: none !important;
    border-bottom: 1px solid #272727;
}
 
blockquote.ipsBlockquote.built {
    background: #232323 !important;
    border: none !important;
}
 
.message.unspecific {
    background-color: #272727;
    color: #FFF;
    border: none !important;
}
 
.input_submit {
    background-color: #3991FF;
    border: none !important;
    color: #FFF !important;
}
 
.statistics {
    border-top: 1px solid #272727;
    margin-top: 15px !important;
}
 
#footer_utilities {
    border-top: 1px solid #272727 !important;
}
 
html.wf-myriadpro-i3-active.wf-myriadpro-i4-active.wf-myriadpro-i6-active.wf-myriadpro-i7-active.wf-myriadpro-n3-active.wf-myriadpro-n4-active.wf-myriadpro-n6-active.wf-myriadpro-n7-active.wf-active {
    border-color: transparent !important;
}
div.bbc_spoiler_content {
    background-color: #232323 !important;
    border: 1px solid #313131 !important;
}
  • Like 6

Share this post


Link to post
Share on other sites

Wow...my eyes thank you for this.

 

Let's hope BIS integrates something like this soon.

Share this post


Link to post
Share on other sites

Good job, Kingsley.

 

Although the CODE blocks aren't styled yet. For instance, the block you used in your post to share your style is now fully white, both background and text.

Share this post


Link to post
Share on other sites

Good job, Kingsley.

 

Although the CODE blocks aren't styled yet. For instance, the block you used in your post to share your style is now fully white, both background and text.

Thanks, I've updated the CSS in my post.

Share this post


Link to post
Share on other sites

Glad to help.

 

Also, user names in the Latest Visitors (in your Profile) are white on white.

 

EDIT:

 

Also, for some reason the Forums image at the top left is missing for me.

 

Note that I use Stylish instead of Styler, as I'm on Firefox.

Share this post


Link to post
Share on other sites

Glad to help.

 

Also, user names in the Latest Visitors (in your Profile) are white on white.

Yeah I haven't even looked at the profile yet. When I get some time I'll add to it as I go :)

  • Like 1

Share this post


Link to post
Share on other sites

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
Sign in to follow this  

×