Post by Welshling on Sept 12, 2013 4:38:35 GMT -8
A brown color scheme, originally used... of course for a pirate theme, Johnny Depp images were made by ♡ Kat Meows ♡ but are not supplied. The Banner is supplied, for reference purposes only.
Here's some helpful information for plugins that I recommend and the links to the template mods that are implimented in the theme.
Redux sidebar
Peekaboo right side, basic
Drop down nav
Easy affiliates table
Back to top
Legend in info center
Remove topics|posts bar
Remove on/off cells
Slimline info center
Highlight/rollover div on links
Css border around forum
Logo/banner hover
To add divs in your board descriptions to show new/no new posts
Admin > Themes > Layout Templates > Board > Board List
Line 15, you should see:<td class="icon">$[board.icon]</td>
Replace that with<!--<td class="icon">$[board.icon]</td>-->
Go a little further down, to line 18, you should have:<p class="description">$[board.description]</p>
Replace with<p {if $[board.is_new]} id="descrip2"{else}id="descrip"{/if}>$[board.description]</p>
Then in your Style Sheet add the following to the bottom:
/* Main Page New Posts/No New Posts */
#descrip {
background-color: #141414;
border-left: 5px solid #141414;
border-right: 5px solid #141414;
font: 400 85% Arial,Helvetica,sans-serif;
padding: 10px;
.rounded-corners(2px);
}
#descrip2 {
background-color: #111111;
border-left: 2px solid #CF5558;
border-right: 2px solid #CF5558;
font: 400 85% Arial,Helvetica,sans-serif;
padding: 5px;
.rounded-corners(2px);
}
EDIT THE HEX VALUES. (#141414) TO SUIT YOUR COLOR PREFERENCES
Note You may come across a board highlight problem, because of the rounded corners in the boards and categories.
with thanks to Stinky666, for added help with the member legend and highlight over the boards. To fix this problem, if you encounter it...
Most of the themes, I make have a lighter board highlight color than the background color and this is causing a slight problem with the overflow content.
This means when you hover your mouse over a board, you should see a change in color and also an overflow error. like so.
before you hover over we see, nice rounded borders for the board borders. And after you hover over, you see sharp ugly overflow.
To fix this you will need to go into your css.
Admin>themes>Advanced styles & css
LOOK FOR THIS on line 452 or there abouts.
.container > .content { overflow: visible; }
Change visible; to hidden;
Now this will then cause an error, again with the overflow for the member legend in the info center. See how the last member group gets cut off, when hovered over.?
To fix this, you will need to move your member legend information from your home Wrappers a little. By moving it up to where it says [users online] In your basic info center, but if you are using the slimline info center, you will need to move it too Line 104, which should be after this...
<table>
<tbody>
<tr>
<td style="padding: 10px 10px 10px 10px;">
<table>
<tbody>
You will then need to edit the alignment from "right" to "left" and you may need to lower the pixel alignment in your css for each of your member groups.
/* Admiral */
a.admlegend {
position: relative;
text-decoration: none;
}
a.admlegend:hover:before {
display: inline-block;
position: absolute;
padding: .5em;
content: attr(title);
min-width: auto;
text-align: center;
width: auto;
height: auto;
white-space: nowrap;
top: -32px;
right: -30px;
background: rgba(100, 74, 59,.8);
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
color: #fff;
font-size: .86em;
}
a.admlegend:hover:after {
position: absolute;
display: inline-block;
content: "";
border-color: rgba(100, 74, 59,.8) transparent transparent transparent;
border-style: solid;
border-width: 6px;
height:0;
width:0;
position:absolute;
top: -4px;
left: 0px;
}
Note the pixels in bold, those are the only parts you need to edit. Use your visual editor while altering and perhaps open up a new tab of your home page, so you can edit and check out the finished product, alignment at the same time. Without having to go back and reload your entire css areas.
if you need further help, please feel free to reply below.
And if it is, what do I have to do? xD