We hope you enjoy your visit.

You're currently viewing our forum as a guest. This means you are limited to certain areas of the board and there are some features you can't use. If you join our community, you'll be able to access member-only sections, and use many member-only features such as customizing your profile, sending personal messages, and voting in polls. Registration is simple, fast, and completely free.


Join our community!


If you're already a member please log in to your account to access all of our features:

Username:   Password:
Add Reply
  • Pages:
  • 1
  • 2
Diversity 1.0; [ Dark Grey / Green ]
Topic Started: Jun 29 2007, 11:24 AM (2,507 Views)
.Fable
Member Avatar
relax, we understand j00
[ *  *  *  *  *  * ]
Name: Diversity 1.0
Author: Fable
Skin Number: 61st skin
Date Created: Quite a while back.
Side Notes: This was made for my board, which closed so I'm releasing the skin here along with the graphics if anyone wants them. I don't pretend that this is one of my better skins but I thought I would just release it for the sake of it :)

I'd just like to thank Jago and a few others for their help in the production of the graphics. Nice work ^_^

Preview of the Skin

Graphics
Full button Set By Fable, folders made by Jago.

Change the Red text for the banner url.
Change the Blue text for the submenu links.

"Header and Body"
 
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" alink="#000000" vlink="#000000">
<br />
<div align="center">
<div>
<table width="1000px" cellpadding="0" cellspacing="0"><tr><td class="boardtable">
<div class="header_logo"><img src="http://i123.photobucket.com/albums/o290/Fable-06/headerlogod1.png" /></div>
<table cellpadding="0" cellspacing="0" id="header_menu"><tr><td>&nbsp;
<a href="http://z7.invisionfree.com/diversity/index.php?act=Members"><img src="http://i123.photobucket.com/albums/o290/Fable-06/membersbuttond1.png" /></a>&nbsp;<a href="http://z7.invisionfree.com/diversity/index.php?act=calendar"><img src="http://i123.photobucket.com/albums/o290/Fable-06/calendarbuttond1.png" /></a>&nbsp;&nbsp;<a href="http://z7.invisionfree.com/diversity/index.php?act=boardrules"><img src="http://i123.photobucket.com/albums/o290/Fable-06/tosbuttond1.png" /></a></td><td><% NAVIGATION %>
</td></tr></table>
<div style="margin:0px 5px 0px 5px;">
<% BOARD HEADER %>
</div>
<div style="margin:0px 60px 5px 60px;">
<% BOARD %>
<div id="logostrip"></div>
<span class="copyright">

"Footer"
 
</span></div>
<center><div style="padding:2px 0px 2px 0px; width:300px; background:#8F8F8F url(http://i123.photobucket.com/albums/o290/Fable-06/mtlmiddled1.png) top repeat-x; border:1px solid #444; margin-bottom:5px; border-top:0px;">Hover over a username to find out which usergroup they are in.</div></center>
<table cellpadding="0" cellspacing="0" id="footer_copyright"><tr><td>Hosted by <a href='http://invisionfree.com' target='_blank'>InvisionFree</a>. Powered by <a href="http://www.invisionboard.com" target='_blank'>IPB</a> v1.3 Final ©2003 <a href='http://www.invisionpower.com' target='_blank'>IPS, Inc.</a></td><td style="float:right; padding-right:5px;">Skin and Content © Diversity 2007.</tr></table></div></td></tr></table></div></div><br />

<script language="javascript"><!--
// Replace Sig Line with Image
// created by Ryan Fan
// http://www.ifsz.com , 2005
if(location.href.match('showtopic')){

sigImg = "http://i123.photobucket.com/albums/o290/Fable-06/siglined1.png"

var x = document.getElementsByTagName('td')
for(y=0;y<x.length;y++){
if(x[y].className == "post2" || x[y].className == "post1" && x[y].innerHTML.match(/--------------------/) && x[y].width == "100%"){
x[y].innerHTML = x[y].innerHTML.replace(/--------------------/, '<img src=' + sigImg + ' + >')
}}}
// -->

<!--
// 3-part maintitle
// http://aasforums.com
d = document.getElementsByTagName("DIV")
for (n = 1; n<d.length; n++) {
if (d[n].className == "maintitle" && d[n].parentNode.id != "ucpmenu" && d[n].parentNode.id != "ucpcontent") {
mtcontent = d[n].innerHTML
d[n].innerHTML = '<div class="mtleft"><div class="mtright"><div class="mtcentre">' + mtcontent + '</div></div></div>' } }
// --></script>

"CSS"
 
html { overflow-x: hidden; overflow-y: auto; }

form { display:inline; }
img  { vertical-align:middle; border:0px }
BODY { font-family: Tahoma, sans serif; font-size: 10px; color: #444; margin:0px 10px 0px 10px;background-color:#7F7F7F; background-image:url(http://i123.photobucket.com/albums/o290/Fable-06/background1d1.png); background-positon:top; background-repeat:repeat-x; }
TABLE, TR, TD { font-family: Tahoma, sans serif; font-size: 10px; color: #333; }
a:link, a:visited, a:active { text-decoration: none; color: #3C3C3C }
a:hover { color: #333; text-decoration:underline }

fieldset.search { padding:6px; line-height:150% }
label { cursor:pointer; }

img.attach { border:2px outset #EEF2F7;padding:2px }

.googleroot  { padding:6px; line-height:130% }
.googlechild { padding:6px; margin-left:30px; line-height:130% }
.googlebottom, .googlebottom a:link, .googlebottom a:visited, .googlebottom a:active { font-size:11px; color: #3A4F6C; }
.googlish, .googlish a:link, .googlish a:visited, .googlish a:active { font-size:14px; font-weight:bold; color:#00D; }
.googlepagelinks { font-size:1.1em; letter-spacing:1px }
.googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited { font-size:10px; color:#434951 }

li.helprow { padding:0px; margin:0px 0px 10px 0px }
ul#help    { padding:0px 0px 0px 15px }

option.cat { font-weight:bold; }
option.sub { font-weight:bold;color:#555 }
.caldate  { text-align:center;
font-weight:normal;
font-size:10px;
color:#D4E2E2;
background: url(http://i123.photobucket.com/albums/o290/Fable-06/mtlmiddled1.png) top repeat-x;
padding:0px;
margin: 1px 10px 0px 70px;
border:1px solid #444;
border-top:0px; }

form div.tableborder td.row1 div.caldate { text-align:center; font-weight: normal;
background:none;
color:#333;
margin: 2px 10px 0px 70px;
border:0px; }
form div.tableborder td.row1 { background:#90B0B0 url(http://i123.photobucket.com/albums/o290/Fable-06/grad2d1.png) top repeat-x!important; border: none!important; }
td#ucpcontent form div.tableborder td.row1 { background:#90B0B0 url(http://i123.photobucket.com/albums/o290/Fable-06/grad2d1.png) top repeat-x!important; border: none!important; }

.warngood { color:green }
.warnbad  { color:red }

#padandcenter { margin-left:auto;margin-right:auto;text-align:center;padding:14px 0px 14px 0px }

#profilename { font-size:28px; font-weight:bold; }
#calendarname { font-size:22px; font-weight:bold; }

#photowrap { padding:6px; }
#phototitle { font-size:24px; border-bottom:1px solid black }
#photoimg  { text-align:center; margin-top:15px }

table td#ucpcontent div.pformstrip { border:1px solid #444;
border-left:0px;
border-right:0px;
padding:3px;
padding-top:1px; }

table td#ucpcontent div.maintitle { text-align:center;
text-indent:5px;
border:0px;
color:#D4E2E2;
background: url(http://i123.photobucket.com/albums/o290/Fable-06/mtlmiddled1.png) top repeat-x;
margin:-1px 0px -4px 0px;
padding: 5px 0px 8px 0px; }

table td#ucpmenu div.pformstrip { border:1px solid #444;
border-left:0px;
border-right:0px;
padding-top:1px; }

table td#ucpmenu div.maintitle { text-align:center;
text-indent:5px;
border:0px;
color:#D4E2E2;
background: url(http://i123.photobucket.com/albums/o290/Fable-06/mtlmiddled1.png) top repeat-x;
margin:-1px 0px -4px 0px;
padding: 5px 0px 8px 0px; }

#ucpmenu    { line-height:150%;
width:22%;
border:1px solid #444;
background:#7F7F7F; }

#ucpmenu p  { padding:2px 5px 6px 9px;
margin:0px; }

#ucpcontent { background:#7F7F7F;
border:1px solid #444;
line-height:150%;
width:auto }

#ucpcontent p  { padding:10px;
margin:0px; }

div#ucpcontent { border:0px; }
div#ucpcontent div.pformstrip { border:1px solid #444; }

#ipsbanner { position:absolute;top:1px;right:5%; }
#submenu, #logostrip { display:none }

#userlinks { border:1px solid #444;
background:#757575 url(http://i123.photobucket.com/albums/o290/Fable-06/userlinksd1.png) top repeat-x;
color:#333; }
#userlinks a:active, #userlinks a:link, #userlinks a:visited { color:#333; }
#userlinks a:hover { color:#A3C2C2; }

#navstrip  { font-weight:bold; padding:0px; margin-right:5px; float:right; }

.activeuserstrip { background:#90B0B0 url(http://i123.photobucket.com/albums/o290/Fable-06/grad2d1.png) top repeat-x;
border:1px solid #444; padding:6px }

#copyrightfable { Copyright to fable of diversity. Not to be ripped or distributed. Skin for the Diversity forum only! }

table tr td#ucpcontent form table td.pformstrip { border:1px solid #444!important; }

table.tableborder td.pformstrip { border:1px solid #444; }

div.pformstrip { border:1px solid #444; }

.pformstrip { background:#818181 url(http://i123.photobucket.com/albums/o290/Fable-06/titlemediumd1.png) top repeat-x;
color:#444;
font-weight:normal;
padding:2px;
margin-top:1px }

.pformleft  { background:#7F7F7F;
padding:6px;
margin-top:1px;
width:25%;
border-left:1px solid #444; }

.pformleftw { background:#7F7F7F;
border-right:1px solid #444;
border-left:1px solid #444!important;
padding:6px;
margin-top:1px;
width:40%;
border-bottom:0px!important; }

.pformright { background:#7F7F7F;
padding:6px;
margin-top:1px;
border:1px solid #444;
border-top:0px;
border-bottom:0px; }

.postlinksbar { background:#818181 url(http://i123.photobucket.com/albums/o290/Fable-06/titlemediumd1.png) top repeat-x;
padding:2px;
margin-top:1px;
font-size:10px;
border-left:1px solid #444;
border-right:1px solid #444; }

.post1, .post2 { background:#7F7F7F;
border:1px solid #929292;
border-bottom:0px; }

.row1, .row2, .row4 { background:#7F7F7F ;
border-top:1px solid #929292; }

.row3 { background:#7B7B7B url(http://i123.photobucket.com/albums/o290/Fable-06/menud1.png) top repeat-x; }

div.row1 { background-color: #7F7F7F; border: 1px solid #444; border-top:0px; }

div.row2 { border-bottom:1px solid #444;
border-left:1px solid #444;
border-right:1px solid #444; }

div.row4 { background:#7F7F7F;
border:0px; }

.darkrow1 { background:#90B0B0 url(http://i123.photobucket.com/albums/o290/Fable-06/grad2d1.png) top repeat-x;
border-left:1px solid #444;
border-right:1px solid #444;
color:#333; }

td.darkrow1 { background:#757575 url(http://i123.photobucket.com/albums/o290/Fable-06/userlinksd1.png) top repeat-x!important;
border-left:0px!important;
border-right:0px!important; }

.darkrow2 { background:#8F8F8F url(http://i123.photobucket.com/albums/o290/Fable-06/darkrow2d1.png) top repeat-x;
color:#333; }

div.darkrow2 { background:#757575 url(http://i123.photobucket.com/albums/o290/Fable-06/userlinksd1.png) top repeat-x;
border:1px solid #444;
border-top:0px; }

.darkrow3 { background:#7F7F7F;
color:#333;
border-top:1px solid #929292; }

div.darkrow3 { border:0px; }

.hlight { background-color: #8F8F8F }
.dlight { background-color: #7F7F7F }

.titlemedium { font-weight:normal;
color:#444;
padding:2px;
margin:0px;
background:#818181 url(http://i123.photobucket.com/albums/o290/Fable-06/titlemediumd1.png) top repeat-x; }
.titlemedium  a:link, .titlemedium  a:visited, .titlemedium  a:active  { text-decoration:underline;
color:#444; }

div.titlemedium { border:1px solid #444;
border-top:0px; }

/* maintitle fix */
table td.plainborder table td.maintitle { text-align:center;  background:#90B0B0 url(http://i123.photobucket.com/albums/o290/Fable-06/grad2d1.png) top repeat-x;
padding:5px 0px 8px 0px;
color:#111; }
div.maintitle { text-align:center; background:top; }
div.maintitle div { text-align:center; }
/* end fix */

table.tableborder td.maintitle { border-left:1px solid #444!important; border-right:1px solid #444!important; }

.maintitle a:link, .maintitle  a:visited, .maintitle  a:active { text-decoration: none; color:#D4E2E2; font-size:9px; }
.maintitle a:hover { text-decoration: underline }
.maintitle img { display:none }

.mtcentre { background-image: url(http://i123.photobucket.com/albums/o290/Fable-06/mtlmiddled1.png);
background-position: top center;
background-repeat: repeat-x;
margin-right: 20px;
margin-left: 20px;
padding: 5px 0px 9px 0px;
text-align: center;
color:#D4E2E2;
font-size:9px; }

td.maintitle { background-image: url(http://i123.photobucket.com/albums/o290/Fable-06/mtlmiddled1.png);
background-position: top center;
background-repeat: repeat-x;
padding: 5px 0px 9px 0px;
text-align: center;
color:#D4E2E2;
font-size:9px; }

.mtleft { background-image: url(http://i123.photobucket.com/albums/o290/Fable-06/mtleftd1.png);
background-position: top left;
background-repeat: no-repeat;
height: 25px }

.mtright { background-image: url(http://i123.photobucket.com/albums/o290/Fable-06/mtlrightd1.png);
background-position: top right;
background-repeat: no-repeat;
height: 25px }

.plainborder { border:1px solid #A0A0A0;
background:#444; }

.tableborder { border:1px solid #A0A0A0;
background-color:#444;
padding:0px;
margin:0px;
width:100%; }

.tablefill  { border:1px solid #444;
background:#757575 url(http://i123.photobucket.com/albums/o290/Fable-06/userlinksd1.png) top repeat-x;
padding:6px;  }

.tablepad    { background-color:#7F7F7F;
padding:6px; }

.tablebasic  { width:100%;
padding:0px;
margin:0px;
border:0px }

.wrapmini    { float:left;line-height:1.5em;width:25% }
.pagelinks  { float:left;line-height:1.2em;width:35% }

.desc { font-size:10px; color:#444 }
.edit { font-size: 9px }

.signature  { font-size: 10px; color: #444; }
.postdetails { font-size: 10px; }
.postcolor  { font-size: 12px;
line-height: 160%; }

.normalname { font-size: 12px; font-weight: noraml; color: #003 }
.normalname a:link, .normalname a:visited, .normalname a:active { font-size: 12px }
.unreg { font-size: 11px; font-weight: bold; color: #900 }

.searchlite { font-weight:bold; color:#F00; background-color:#FF0 }

.post1 table td, .post2 table td { color:#D4E2E2; }

#QUOTE { font-family:Tahoma, sans-serif;
font-size:11px;
color:#333;
background:#90B0B0 url(http://i123.photobucket.com/albums/o290/Fable-06/grad2d1.png) top repeat-x;
border: 1px solid #444;
padding:2px; }

#CODE { font-family:Tahoma, sans-serif;
font-size:11px;
color:#333;
background:#7B7B7B url(http://i123.photobucket.com/albums/o290/Fable-06/menud1.png) top repeat-x;
border: 1px solid #444;
padding:2px; }

.copyright { font-family: Verdana, Tahoma, Arial, Sans-Serif; font-size: 9px; line-height: 12px }
.copyright .row4 { display:none }

.codebuttons  { font-size:10px;
font-family: Tahoma, sans serif;
vertical-align: middle;
border:1px solid #444;
background:#7B7B7B url(http://i123.photobucket.com/albums/o290/Fable-06/menud1.png) top repeat-x;
margin:1px; }

.codebuttons:hover { font-size:10px;
font-family: Tahoma, sans serif;
vertical-align: middle;
background:#90B0B0 url(http://i123.photobucket.com/albums/o290/Fable-06/grad2d1.png) top repeat-x;
margin:1px;
border:1px solid #444; }

input.row1 { background:#7F7F7F; }

.forminput, .textinput, .radiobutton, .checkbox  { font-size:10px;
font-family: Tahoma, sans serif;
vertical-align:middle;
border:1px solid #444;
background:#90B0B0 url(http://i123.photobucket.com/albums/o290/Fable-06/grad2d1.png) top repeat-x;
padding:1px 0px 0px 1px;
color:#333; }

.thin { padding:1px 0px 1px 2px;
line-height:140%;
margin:2px 0px 2px 0px;
background:#7F7F7F;
border-left:1px solid #555;
border-bottom:1px solid #999;
border-right:1px solid #999;
border-top:1px solid #555; }

/* Begin Custom */

.boardtable { background:#8F8F8F; border:1px solid #444; }
.header_logo { width:100%; height:100px; background:#98BABA url(http://i123.photobucket.com/albums/o290/Fable-06/logod1.png) top repeat-x; }
#header_menu { width:100%; height:25px; background:#7B7B7B url(http://i123.photobucket.com/albums/o290/Fable-06/menud1.png) top repeat-x; border-top:1px solid #444; border-bottom:1px solid #444; margin: 0px 0px 5px 0px; }
#footer_copyright { background:#95ADAD url(http://i123.photobucket.com/albums/o290/Fable-06/gradd1.png) top repeat-x; width:100%; border-top:1px solid #444; text-indent:5px; }

/* End Custom */

/* See Previous Post Fix */

TD[class='row4'][valign='top'][width='20%'] { background:#95ADAD url(http://i123.photobucket.com/albums/o290/Fable-06/gradd1.png) top repeat-x; }

TD[class='row4'][valign='top'][width='80%'] { background:#95ADAD url(http://i123.photobucket.com/albums/o290/Fable-06/gradd1.png) top repeat-x; }

/* See Previous Post Fix End */

/* fixing the post */
.postdetails { font-size: 10px; background:#none; color:#333; padding:0px 2px 0px 2px; }
DIV[align='left'][class='row4'] { background:none; border:none; }
/* end fix */

/* skinning the poll */
TD[class="row1"][colspan="3"] { background:#7F7F7F; border:1px solid #444; }
TD[class='row1'] { background:#7F7F7F url(http://); }
DIV[align="center"][class="pformstrip"] { border-top:0px; border-bottom:0px; background:#7F7F7; }
DIV[align="right"][class="pformstrip"] { border-bottom:0px; }
DIV[class="tablepad"][align="center"] { border-left:1px solid #444; border-right:1px solid #444; }

TABLE[cellpadding="5"][align="center"] TD[class='row1'] { border:0px; }
/* end of poll */

/* Important Fixes */
div.tableborder div.tablepad div.pformstrip div td { border-top:0px!important; }
div.tableborder div.tablepad { background:#7F7F7!important; border:1px solid #444!important; }
div.tableborder div.tablepad  table { background:#7F7F7!important; }

form div.tableborder td.pformleftw { border:0px; }
form div.tableborder div.pformstrip { margin:0px; }
form div.tableborder table.tablebasic td { border:0px;margin:0px; }
form div.tableborder table.tablebasic { border:0px;margin:0px; }
div.tableborder div.pformstrip { margin-top:0px; }
form table td.pformright textarea { background:#90B0B0 url(http://i123.photobucket.com/albums/o290/Fable-06/grad2d1.png) top repeat-x; border:1px solid #444; }
div fieldset.search { border:1px solid #444; }

FORM[action="http://z8.invisionfree.com/fable54/index.php?act=Login&CODE=01"][method="post"][name='LOGIN'][onsubmit='return ValidateForm()'] DIV[class="pformstrip"][align="center"] { border-bottom:1px solid #444; }
FORM[action="http://z8.invisionfree.com/fable54/index.php?act=Login&CODE=01"][method="post"][name='LOGIN'][onsubmit='return ValidateForm()'] DIV[class='pformstrip'] { border-bottom:0px; }
FORM[action="http://z8.invisionfree.com/fable54/index.php?act=Login&CODE=01"][method="post"][name='LOGIN'][onsubmit='return ValidateForm()'] TABLE[class="tablebasic"][cellspacing="1"] TD[class='pformleftw'] { border:0px!important; }

DIV[class='tableborder'] DIV[class='pformstrip'][align='center'] { border-bottom:1px solid #444; background:#7F7F7; }
DIV[align='center'][class='darkrow2'][style='padding:4px'] { border:1px solid #444; }
/* End Fixes */

.purple { color:purple;font-weight:bold }
.red    { color:red;font-weight:bold }
.green  { color:green;font-weight:bold }
.blue  { color:blue;font-weight:bold }
.orange { color:#F90;font-weight:bold }

Offline Profile Quote Post Goto Top
 
Replies:
Mzeppelin
Member Avatar
Member
[ *  *  * ]
Very nice. Good Job 10/10.
Offline Profile Quote Post Goto Top
 
--shadow-of-death--
Member Avatar
Member
[ *  * ]
yeah i miss that forum sorely.. is quite a nice skin though..
Offline Profile Quote Post Goto Top
 
Beaumont
Member Avatar
Member
[ *  *  *  *  * ]
Nice skin. Very simple, but in a good way.
Offline Profile Quote Post Goto Top
 
Tim
TimS
[ *  *  *  *  *  * ]
That's very nice.

The space between the boarder and the board is a little too much in my opinion.

Apart from that, I love it.
Offline Profile Quote Post Goto Top
 
.Derek (PM)
Member
[ *  *  *  * ]
Amazing work, Fable. :)
Offline Profile Quote Post Goto Top
 
.Fable
Member Avatar
relax, we understand j00
[ *  *  *  *  *  * ]
Thanks for the comments everyone ^_^
Offline Profile Quote Post Goto Top
 
MichaelK
Member Avatar
Member
[ *  *  * ]
It's GREAT! :D
Offline Profile Quote Post Goto Top
 
Nivexonix
Member Avatar
Love
[ *  *  *  *  *  *  * ]
The skin looks great, Fable. Nice work! :)
Offline Profile Quote Post Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
« Previous Topic · Dark · Next Topic »
Add Reply
  • Pages:
  • 1
  • 2