[PHPBB3] Blue vs Black

Theme Name : Blue vs Black
Forum Version : PHPBB3
Main Colors : Blue and Black
Template Usage : N/A
Javascript Usage : N/A
Difficulty to Install : Easy
Time taken to create : Don't know.
Custom Images : Yes
New: http://hitskin.com/themes/18/09/33/i_folder_new.png
No new: http://hitskin.com/themes/18/09/33/i_folder.png
Subject - Hot & New : http://hitskin.com/themes/18/09/33/i_folder_new_hot.png
Subject - Hot : http://hitskin.com/themes/18/09/33/i_folder_hot.png
Announcement : http://hitskin.com/themes/18/09/33/i_folder_announce.png
Announcement - New : http://hitskin.com/themes/18/09/33/i_folder_announce_new.png
Global announcement : http://hitskin.com/themes/18/09/33/i_folder_announce.png
Global Announcement - New : http://hitskin.com/themes/18/09/33/i_folder_announce_new.png
Sticky : http://hitskin.com/themes/18/09/33/i_folder_sticky.png
Sticky - New : http://hitskin.com/themes/18/09/33/i_folder_sticky_new.png

Theme Description : Pretty well designed dark theme , for some awsome forums.
Theme Author : Edited by Akkii , Original by Matti_7
Preview Theme :

Spoiler:

Install the Skin here with PhpBB3: http://en.hitskin.com/?afolder=theme&id=182870

Change original CSS with this:

Code:


form#quick_reply #textarea_content textarea#text_editor_textarea {
height: 50px;
width: 100%!important;
-htm-transition-duration: 1s;
-moz-transition-duration: 1s;
-o-transition-duration: 5ms;
-webkit-transition-duration: 1s;
transition-duration: 1s;
background: #2C2C2C;
border: 1px dashed black;
}

form#quick_reply:hover #textarea_content textarea#text_editor_textarea:hover  {
height: 155px;
width: 100%!important;
background: #2C2C2C;
border: 1px solid teal;
position: relative;
}
/*Do not touch - Base*/
#chatbox_members a[href="/u1"],  #onlinechat a[href="/u1"] {
            display: none;
        }
dl.icon dd.dterm, dl.icon dt {
    background-position: 90% 100%;
}
/* tipsy
----------------------------------------------- */
.tipsy { padding: 5px; font-size: 10px; position: absolute; z-index: 999; }
  .tipsy-inner { padding: 5px 8px 4px 8px; background-color: black; color: white; max-width: 250px; text-align: center; }
  .tipsy-inner { border-radius: 3px; -moz-border-radius:3px; -webkit-border-radius:3px; }
  .tipsy-arrow { position: absolute; background: url('http://onehackoranother.com/projects/jquery/tipsy/stylesheets/../images/tipsy.gif') no-repeat top left; width: 9px; height: 5px; }
  .tipsy-n .tipsy-arrow { top: 0; left: 50%; margin-left: -4px; }
    .tipsy-nw .tipsy-arrow { top: 0; left: 10px; }
    .tipsy-ne .tipsy-arrow { top: 0; right: 10px; }
  .tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -4px; background-position: bottom left; }
    .tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; background-position: bottom left; }
    .tipsy-se .tipsy-arrow { bottom: 0; right: 10px; background-position: bottom left; }
  .tipsy-e .tipsy-arrow { top: 50%; margin-top: -4px; right: 0; width: 5px; height: 9px; background-position: top right; }
  .tipsy-w .tipsy-arrow { top: 50%; margin-top: -4px; left: 0; width: 5px; height: 9px; }

#backtotop {   
background: url("http://i43.servimg.com/u/f43/14/73/12/96/icon_t10.png") no-repeat scroll 0 0
transparent;
bottom: 50px;
cursor: pointer;
display: none;
position: fixed;
right: 50px;
text-indent: -9999px;
width: 40px;
height: 40px;
opacity: 0.4;
z-index: 1;
}

#backtotop:hover {
opacity: 0.7;
}
 
ul#picture_legend, ul#privmsgs-menu {
    display: none;
    padding: 3px 0;
    text-align: center;
}
body {
  background:#000 url(http://i43.servimg.com/u/f43/14/73/12/96/bodyba10.png);
  background-color: #282828;
  font-family: Verdana,Arial,Helvetica,sans-serif;
  color: #848484;
  font-size: 10px;
  height: auto;
  padding: 10px 0px;
}

.headerbar {
    background-color: #282828;
    background-image: url(http://www.dodaj.rs/f/3u/123/tj15hHE/test.png);
    background-repeat: repeat-x;
    margin-bottom: 4px;
    padding-bottom: 0;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 0;
    height: 163px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #363636;
}

#wrap {
    background:#2b2b2b url(http://i43.servimg.com/u/f43/14/73/12/96/stripe10.png);
    margin: 0px auto;
    padding: 5px;
    max-width: 1400px;
    min-width: 970px;
    width: 85%;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    border: 1px solid #363636;
    box-shadow: 0 0 8px black;
}

.forabg {
    background-color: #131313;
    background-image: url("http://i45.servimg.com/u/f45/14/65/46/14/cat10.png");
    background-position: 0 0;
    background-repeat: repeat-x;
    border-top: solid 1px #131313;
    clear: both;
    margin-bottom: 8px;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    padding-top: 0;
    border-radius: 3px 3px 0px 0px;
    margin-top: 5px;
    border: 1px solid #454545;
}

.forumbg {
    background-color: #131313;
    background-image: url("http://i45.servimg.com/u/f45/14/65/46/14/cat10.png");
    background-position: 0 0;
    background-repeat: repeat-x;
    border-top: solid 1px #131313;
    clear: both;
    margin-bottom: 8px;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
    padding-top: 0;
    border-radius: 3px 3px 0px 0px;
    margin-top: 5px;
    border: 1px solid #454545;
}

li.header dd, li.header dt {
    color: #FFFFFF;
    font-family: Arial,Helvetica,sans-serif,Verdana,Arial,Helvetica,sans-serif;
    font-size: 1em;
    line-height: 16px;
    margin-bottom: 4px;
    margin-left: 5px;
    margin-right: 0;
    margin-top: 2px;
    padding-bottom: 2px;
    padding-top: 2px;
}

li.row {
    background-color: #2C2C2C;
    border-bottom: 1px solid #111;
    border-top: 1px solid #363636;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4) inset;
}

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

ul.topiclist dd {
   border-left: 0px solid #990099;
   display: block;
   float: left;
   padding: 4px 0;
   }

ul.topiclist {
    color: #848484;
    list-style-type: none;
    margin: 0;
    text-shadow: 1px 1px 0 #000000;
    font-family: verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;
    font-size: 11px;
    font-weight: normal;
    background-image: url(http://i32.servimg.com/u/f32/14/52/65/41/dew10.png);
}

p {
    font-size: 1.1em;
    line-height: 1.3em;
    margin-bottom: 0.5em;
    color: #eee;
    text-shadow: 1px 1px 0 #000000;
}

a.forumtitle {
    text-decoration: none;
    color: #eee;
    font-family: tahoma,verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;
    font-size: 13px;
    font-weight: bold;
}
a.forumtitle:hover {
    text-decoration: underline;
    color: #fff;
}

a.topictitle {
    text-decoration: none;
    color: #eee;
    font-family: tahoma,verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;
    font-size: 13px;
    font-weight: bold;
}
a.topictitle:hover {
    text-decoration: underline;
    color: #fff;
}

.h3, h3 {
    border-bottom: 1px dashed #444;
    color: #eee;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 1.05em;
    margin-bottom: 3px;
    margin-top: 20px;
    padding-bottom: 2px;
    text-transform: uppercase;
}

.navbar span.corners-bottom, .navbar span.corners-top, .panel span.corners-bottom, .panel span.corners-top, .post span.corners-bottom, .post span.corners-top {
    display: none;
}

span.corners-top span, span.corners-bottom, span.corners-bottom span, span.corners-top {
    display: none;
}


.post {
background-color: #2C2C2C;
border: 1px solid #111;
border-radius: 3px;
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1) inset;

}

.postbody {
background-color: #2C2C2C;
border: 1px solid #1f1f1f;
border-radius: 3px;
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1) inset;
padding: 5px;
min-height: 284px;
    margin-top: 5px;
}

.postprofile {
min-height: 280px;
border: 1px solid #1f1f1f;

border-radius: 3px;
background: #282828;
    padding-bottom: 3px;
    padding-left: 1px;
    padding-right: 1px;
    padding-top: 3px;
}

.navbar {
    background-color: transparent;
    clear: both;
    padding-bottom: 0;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 20px;
}
ul.navlinks {
    border-bottom: 0px;
    font-weight: normal;
    margin-top: -32px;
}

a.mainmenu {
    color: #fff;
    font-family: Verdana,Arial,Sans-Serif;
    font-size: 12px;
    text-shadow: 1px 1px 0 #000000;
    padding-left: 8px;
    padding-right: 8px;
    margin-left: -8px;
    text-transform: uppercase;
}

a.mainmenu:hover {
    color: #fff;
    background-color: rgba(0, 0, 0, 0.5);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6) inset, 0 0 0 1px rgba(255, 255, 255, 0.06), 0 1px 0 rgba(255, 255, 255, 0.15);
    padding-top: 9px;
    padding-bottom: 9px;
    padding-left: 8px;
    padding-right: 8px;
    border-radius: 3px 3px 3px 3px;
}

ul.linklist li a img {
    vertical-align: middle;
    display: none;
}

.inputbox {
    background-color: #282828;
    border: 1px solid #111;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1) inset;
    color: #fff;
    cursor: text;
    padding: 2px;
}
.inputbox:hover {
    border: 1px solid #111;
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1) inset;
}
.inputbox:focus {
    border: 1px solid #111;
    color: #fff;
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1) inset;
}

#message-box textarea {
    color: #ccc;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 1.2em;
    width: 80%;
}

.row2 {
    background-color: transparent;
}
.row3 {
    background-color: transparent;
}

ul.topiclist dfn {
    display: block;
    margin-top: -10px;
    font-style: normal;
    color: #848484;
    text-shadow: 1px 1px 0 #000000;
}

dd.lastpost dfn {
    font-size: 1.1em;
    width: 20%;
    display: none !important;
    margin-top: -10px!important;
}

.pagination span a, .pagination span a:active, .pagination span a:link, .pagination span a:visited {
    background-color: #181818;
    border: solid 1px #000;
    color: #5C758C;
    font-size: 0.9em;
    font-weight: 400;
    line-height: 1.5em;
    margin-bottom: 0;
    margin-left: 2px;
    margin-right: 2px;
    margin-top: 0;
    padding-bottom: 0;
    padding-left: 2px;
    padding-right: 2px;
    padding-top: 0;
}
.pagination span a:hover {
    border: 1px solid #282828;
    background-color: #222;
    color: #FFFFFF;
}

#forum-search {
    display: none;
}

#page-header #search-box {
    display: none;
}

body.chatbox {
    background-image: none;
}
.chatbox {
    background-color: #2C2C2C;
}
#chatbox_header {
    background-color: transparent;
    height: 30px;
}
.chatbox .forabg {
    background-color: transparent;
    margin: 0px;
    padding: 0px;
    background-image: url(http://i32.servimg.com/u/f32/14/52/65/41/dew10.png);
}

.chatbox_row_1 {
    background-color: #282828;
    padding: 4px;
    border-bottom: 1px dashed #363636;
}
.chatbox_row_2 {
    background-color: #2c2c2c;
    padding: 4px;
}

#chatbox_members {
    border-right: 1px dashed #444;
    bottom: 30px;
    overflow-x: auto;
    overflow-y: auto;
    position: absolute;
    top: 30px;
    width: 180px;
}
#chatbox_members .member-title {
    background-color: #333;
    background-image: none;
    color: #ddd;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 12px;
    padding-bottom: 0.5em;
    padding-left: 0.25em;
    padding-right: 0.25em;
    padding-top: 0.5em;
    text-align: center;
    border-bottom: 1px dashed #454545;
}
.chatbox-title {
  background-image: url(http://i32.servimg.com/u/f32/14/52/65/41/dew10.png);
}
#tabs a {
    background-color: #222;
    cursor: pointer;
    float: left;
    margin-bottom: 1px;
    margin-left: 3px;
    margin-right: 3px;
    margin-top: 0;
    padding-bottom: 0;
    padding-left: 5px;
    padding-right: 0;
    padding-top: 0;
    position: relative;
    border: 1px solid #444;
}
#tabs a span {
    color: #ededed;
    display: block;
    float: left;
    padding-bottom: 6px;
    padding-left: 5px;
    padding-right: 10px;
    padding-top: 6px;
    white-space: nowrap;
}
#tabs a:hover span {
    color: #fff;
}
#tabs .activetab a {
    background-color: #262626;
    margin-bottom: -1px;
    border: 1px solid #444;
}
#tabs .activetab a span {
    color: #ededed;
    padding-bottom: 7px;
}
#tabs a:hover {
    background-color: #222;
    border: 1px solid #444;
}

#tabs .activetab a:hover span {
    color: #fff;
}

label {
    color: #fff;
    cursor: default;
    padding-right: 5px;
}

fieldset dl:hover dt label {
    color: #ccc;
}

hr {
   
   border-top: 1px dashed #111;
border-bottom: 1px dashed #444;
  height: 1px;
   margin: 5px 0;
   display: block;
   clear: both;
   }
hr.dashed {
   border-top: 1px dashed #ffffff;
   margin: 5px 0;
   }

blockquote {
    background-color: #222;
    background-image: url("http://2img.net/i/fa/prosilver/quote.gif");
    background-position: 6px 8px;
    background-repeat: no-repeat;
    border: 1px dashed #4B4B4B;
    font-size: 0.95em;
    margin-bottom: 1em;
    margin-left: 25px;
    margin-right: 1px;
    margin-top: 1em;
    overflow-x: hidden;
    overflow-y: hidden;
    padding: 5px;
    color: #ddd!important;
    border-left: 3px solid #98B843;
}
blockquote div {
    margin-left: 20px;
}
blockquote blockquote {
    background-color: #262626;
    font-size: 1em;
    margin-bottom: 0;
    margin-left: 15px;
    margin-right: 1px;
    margin-top: 0.5em;
}
blockquote blockquote blockquote {
    background-color: #282828;
}

dl.codebox {
    background-color: #333;
    border: 1px solid #1a1a1a;
    font-size: 1em;
    padding: 3px;
    color: #ddd;
}
dl.codebox dt {
    border-bottom: 1px dashed #444;
    display: block;
    font-size: 0.8em;
    font-weight: 700;
    margin-bottom: 3px;
    text-transform: uppercase;
}
blockquote dl.codebox {
    margin-left: 0;
}
dl.codebox code {
    color: #70872b;
    display: block;
    font-family: Courier,Courier New,sans-serif;
    font-size: 0.9em;
    font-weight: normal;
    height: auto;
    line-height: 1.3em;
    margin-bottom: 2px;
    margin-left: 0;
    margin-right: 0;
    margin-top: 2px;
    max-height: 200px;
    overflow-x: auto;
    overflow-y: auto;
    padding-top: 5px;
    white-space: normal;
    text-shadow: none!important;
}

table.table1 tbody tr {
    background: #222;
}
table.table1 tbody tr.hover, table.table1 tbody tr:hover {
    background-color: #282828;
}
table.table1 td {
    color: #878787;
    font-size: 1.1em;
}

table.table1 tbody th {
    background-color: #1e1e1e;
    border-bottom: 1p solid #000000;
    color: #FFFFFF;
    padding: 5px;
    text-align: left;
}


.row1 {
    background-color: #222222;
    border: 1px solid #111;
}

#calendar .hover-td:hover, #mini-calendar .hover-td:hover {
    background-color: #282828;
}

input {
    cursor: pointer;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 1.2em;
    font-weight: 400;
    padding: 3px!important;
    vertical-align: middle;
    color: black;
}

.content {
    color: #ddd;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    line-height: 1.4em;
    min-height: 3em;
    text-shadow: none!important;
}

.panel {
    background-color: transparent;
    color: #536482;
    margin-bottom: 4px;
    padding-bottom: 0;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0;
}

#cp-main .panel {
    background-color: #222;
    border: 1px solid #444;
}

#calendar ul, #mini-calendar ul {
    background-color: #282828;
    height: 120px;
    list-style-type: none;
}
#calendar ul:hover, #mini-calendar ul:hover {
    background-color: #333;
}

table.table1 tbody td {
    border-top: 1px dashed #444;
    padding-bottom: 5px;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 5px;
}

.module {
    background-color: transparent;
    color: #536482;
    margin-bottom: 4px;
    overflow-x: hidden;
    overflow-y: hidden;
    padding-bottom: 0;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 0;
    border: 1px dashed #444;
    margin-top: 15px;
}

a:link{
    color: #ededed;
    text-decoration: none;
    }
a:visited{
    color: #ddd;
    text-decoration: none;
    }
a:active{
    color: #ddd;
    text-decoration: underline;
    }
a:hover{
    color: #ccc;
    text-decoration: none;
    }

ul.navlinks span.new-message {
color: #a9c32f;
text-decoration:blink;
}

#logo-desc:after {
    color: #FFFFFF;
    content: "Edited by Akkii | Original by Matti";
    font-size: 10px;
    position: absolute;
    right: 8%;
    top: 115px;
    font-weight: normal;
    font-family: Dotum,sans-serif;
    padding-top: 20px;
}
#logo {
float: left;
padding: 20px;
}
table.table1 thead th {
   font-weight: bold;
   text-transform: uppercase;
   color: #ffffff;
   line-height: 1.3em;
   font-size: 1em;
   padding: 0 0 4px 3px;
   }

.postprofile dd, .postprofile dt {
    line-height: 1.2em;
    margin-left: 8px;
    color: #ccc;
}

#smiley-box, .smile-status-box {
    background-color: transparent;
    float: right;
    margin-top: 25px;
    width: 18%;
    color: #ddd;
}

.smiley-element {
    background: #333;
    padding-left: 10px;
}

.icon {
padding-left: 12px;
}
.dl-icon {
padding-left: 12px;
}

Akkii, nice work on the edit of this theme. Saw it on your site and it looks greats. Now i know why you MIA from the graphics section. Keep up the good job.

Cool work =)

Nice work on the skin, also you don't need the tipsy in the css if you haven't add the Javascript.

Matti, you did a great job on the initial theme props goes out to you too.

Thank you guys
Its great you like it
Idea is from Matti , i just edited theme to my style

Wow nice job!

roberts1223 wrote:Wow nice job!

Thank you very much

I don't like it. It's to dull, and a few more things. 1/10

!_NICK_! wrote:I don't like it. It's to dull, and a few more things. 1/10

Better post your suggestions what to improve , then telling me its dull.

Isn't there any demo or preview site? maybe screenshots?

@Rhino.Freak, this is an old post his forum no longer exist.

but this is what it would look like from my testing. With the exception of the buttons above.