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
Sweetened
Topic Started: Mar 1 2006, 09:36 PM (1,050 Views)
Kadilac
Member
[ *  * ]
Name: Sweetened
Author: Anna (I am Anna I just don't remember the password to that account)
Skin Number: I don't know
Date Created: between Feb 24 and Mar 1
Side Notes: I have yet to make buttons for it. I think I have all defaults cleared or skinned if I managed to miss one or two please let me know.

PREVIEW





Replace everything in your Header & Body above <% BOARD HEADER %>with this, edit what is in RED with your boards URL, and edit what is in green with your banner/logo URL:

Quote:
 
<center><body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" alink="#000000" vlink="#000000">
<table cellspacing="0"  bgcolor="eeecec" valign="top" width="90%"><tr><td valign="top" background="http://i5.ifrm.com/6158/57/upload/p81463.gif" style="padding:11px;border:0px;"></td><td valign="top">
<div class="banner" width="100%">
<center><a href="http://s11.invisionfree.com/newboard1/index.php?"><img src="http://i5.ifrm.com/6158/57/upload/p81879.gif"></a></center></div>
<table width="100%" >
<td class="customsubmenu"  align='center' width="100%">
<a href="http://s11.invisionfree.com/newboard1/index.php?">  INDEX  </a>  <a href='http://s11.invisionfree.com/newboard1/index.php?act=site'>  PORTAL</a><a href='http://s11.invisionfree.com/newboard1/index.php?act=Help'>  HELP  </a><a href='http://s11.invisionfree.com/newboard1/index.php?act=Search&f='>  SEARCH  </a><a href='http://s11.invisionfree.com/newboard1/index.php?act=Members'> MEMBERS </a><a href='http://s11.invisionfree.com/newboard1/index.php?act=calendar'> CALENDAR</a>
</td>
</table> 





Place this in your board footers:

Quote:
 
</td></td><td align="left" valign="top" background="http://i5.ifrm.com/6158/57/upload/p81487.gif" style="padding:12px;border:0px;"></td></tr></table>

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

sigImg = "http://i5.ifrm.com/6158/57/upload/p152127.gif"

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 + ' + >')
}}}
</script>
<script type="text/javascript" language="javascript">
<!--
// 3 gradient maintitle
// created by Secc, http://www.kamikazegfx.com

e = document.getElementsByTagName('DIV')
dv = []
i = 0
for (n = 0; n < e.length; n++) if (e[n].className == 'maintitle' && e[n].parentNode.id != 'ucpmenu') dv[i++] = e[n]
for (n = 0; n < i; n++) {
s = dv[n].innerHTML
dv[n].innerHTML = "<div class='maintitleleft'><div class='maintitleright'><div class='maintitlecontent'>" +                 
// -->
s + '</div></div></div></div>'
}

</script>




Replace everything in Skinning & Styles---Manage Style Sheets with the following code:

Quote:
 
html { overflow-x: hidden; overflow-y: auto; }

form { display:inline; }
img  { vertical-align:middle; border:0px }
BODY { font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 11px; color: #569dbe; margin:0px 10px 0px 10px;background-color:#e1e0e0 }
TABLE, TR, TD { font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 11px; color: #569dbe; }
a:link, a:visited, a:active { text-decoration: underline; color: #569dbe}
a:hover { color: #f26e2e; text-decoration:underline }

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

img.attach { border:1px dotted #569dbe;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: #569dbe; }
.googlish, .googlish a:link, .googlish a:visited, .googlish a:active { font-size:14px; font-weight:bold; color:#569dbe; }
.googlepagelinks { font-size:1.1em; letter-spacing:1px }
.googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited { font-size:10px; color:#569dbe}

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:#569dbe}
.caldate  { text-align:right;font-weight:bold;font-size:11px;color:#569dbe;background-image: url(http://i5.ifrm.com/6158/57/upload/p59439.gif);padding:3px;margin:0px }

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

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

#profilename {text-align:center; font-size:34px; font-weight:bold; }
#calendarname {text-align:center; font-size:34px; font-weight:bold; }

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

#ucpmenu    { line-height:150%;width:22%; border:1px dotted #ffffff;background-color: #eeecec}
#ucpmenu p  { padding:2px 5px 6px 9px;margin:0px; }
#ucpcontent { background-color: #eeecec; border:1px dotted #ffffff;line-height:150%; width:auto }
#ucpcontent p  { padding:10px;margin:0px; }

#ipsbanner { position:absolute;top:1px;right:5%; }
#logostrip {text-align:center; border: 1px solid #eeecec; background-color: #eeecec padding: 0px; margin: 0px; }
#submenu  { border:1px solid #c3bee1;background-image: url(http://i5.ifrm.com/6158/57/upload/p63595.gif);font-size:10px;margin:3px 0px 3px 0px;color:#569dbe;font-weight:bold;}
#submenu a:link, #submenu  a:visited, #submenu a:active { font-weight:bold;font-size:10px;text-decoration: none; color: #569dbe; }
#userlinks { border:1px solid #c3bee1; background-image: url(http://i5.ifrm.com/6158/57/upload/p63595.gif) }

#submenu a:hover { font-weight: bold; color: #f26e2e; }
#submenu { display: none; }

.customsubmenu{
text-align: center;
border: 1px solid #eeecec;
padding: 0px;
text-transform:
uppercase;
font-size: 11px;
margin: 10px 0px 0px 0px;
color:#569dbe;
font-weight:bold;
text-align:center;
text-position:bottom;
height: 20px;
background-color: #eeecec}

.customsubmenu a {
font-weight:bold;
font-size:10px;
text-decoration: none;
color: #569dbe;
padding-top: 2px;
padding-bottom: 2px;
padding-left: 20px;
padding-right: 20px;
border: 1px solid #eeecec;
border-left: 1px solid #eeecec;
border-top: 1px solid #eeecec;
background-image:url(http://i5.ifrm.com/6158/57/upload/p144304.gif);}

.customsubmenu a:hover { text-decoration:none;
padding-top: 2px;
padding-bottom: 2px;
padding-left: 20px;
padding-right: 20px;
border: 1px solid #eeecec;
background-image: url(http://i5.ifrm.com/6158/57/upload/p144304.gif);
background-position:top center ;
color: #f26e2e;
}

#navstrip  { font-weight:bold ;padding:6px 0px 6px 0px;border:1px solid #ffffff;background-image: url(http://i5.ifrm.com/6158/57/upload/p56784.gif); }

.activeuserstrip { background-image: url(http://i5.ifrm.com/6158/57/upload/p56784.gif); padding:6px }

.pformstrip { background-image: url(http://i5.ifrm.com/6158/57/upload/p56818.gif) ; color:#569dbe;font-weight:bold;padding:3px;margin-top:1px }
.pformleft  { background-color: #eeecec; padding:6px; margin-top:1px;width:25%; border-top:1px solid #ffffff; border-right:1px solid #ffffff; }
.pformleftw { background-color: #eeecec; padding:6px; margin-top:1px;width:40%; border-top:1px solid #ffffff; border-right:1px solid #ffffff; }
.pformright { background-color: #eeecec; padding:6px; margin-top:1px;border-top:1px solid #ffffff; }

.post1 table {background-image: url(http://i5.ifrm.com/6158/57/upload/p56784.gif); color:#569dbe; }
.post2 table { background-image: url(http://i5.ifrm.com/6158/57/upload/p56784.gif); color:#569dbe; }
.post1 { background-color: #eeecec}
.post2 { background-color: #eeecec}
.postlinksbar { background-color:#eeecec;padding:3px;margin-top:1px;font-size:10px; background-image: url(http://i5.ifrm.com/6158/57/upload/p56818.gif) }

.row1 { background-color: #eeecec}
.row2 { background-color: #eeecec}
.row3 { background-color: #eeecec}
.row4 { background-color: #eeecec}

.darkrow1 { background-color: #eeecec; color:#569dbe; }
.darkrow2 { background-image: url(http://i5.ifrm.com/6158/57/upload/p56784.gif); color:#569dbe; }
.darkrow3 { background-color: #eeecec; color:#569dbe; }

.hlight { background-color: #eeecec}
.dlight { background-color: #eeecec}

.titlemedium { font-weight:bold; color:#569dbe; padding:3px; margin:0px; background-image: url(http://i5.ifrm.com/6158/57/upload/p56818.gif) }
.titlemedium  a:link, .titlemedium  a:visited, .titlemedium  a:active  { text-decoration: underline; color: #569dbe}

.maintitle {text-indent: 50px;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-WEIGHT: bold; BACKGROUND: url(http://i5.ifrm.com/6158/57/upload/p59439.gif) repeat-x 50% top; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 100%; COLOR: #569dbe; PADDING-TOP: 0px; }

#ucpmenu .maintitle {WIDTH: auto; LINE-HEIGHT: 1em}}

#ucpmenu .maintitle {WIDTH: auto; LINE-HEIGHT: 1em}

#ucpcontent .maintitle {LINE-HEIGHT: 1em}

.maintitle a:link, .maintitle  a:visited, .maintitle  a:active { text-decoration: none; color: #569dbe; font-weight: bold;text-indent: 50px;}

.maintitle a:hover { text-decoration: underline; color: #569dbe; font-weight: bold;text-indent: 50px;}

.maintitleleft {BACKGROUND: url(http://i5.ifrm.com/6158/57/upload/p75548.gif) no-repeat left top}

.maintitleright {BACKGROUND: url(http://i5.ifrm.com/6158/57/upload/p59405.gif) no-repeat right top}

.maintitlecontent {PADDING-RIGHT: 40px; PADDING-LEFT: 0px; PADDING-BOTTOM: 7px; PADDING-TOP: 10px;}

TD.maintitle {PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 10px; PADDING-TOP: 10px}

#ucpmenu .maintitle {PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 10px; PADDING-TOP: 10px}

div.maintitle div { text-indent: 50px; }

.plainborder { border:1px solid #ffffff;background-color:#ffffff}
.tableborder { border:1px solid #ffffff;background-color:#ffffff; padding:0px 0px 0px 0px; margin:0px; width:100%; }
.tablefill  { border:1px solid #ffffff;background-color:#e1e0e0;padding:6px;  }
.tablepad    { background-color:#eeecec;padding:4px }
.tablebasic  { width:100%; padding:0px 0px 0px 0px; margin:0px; border:0px }

.wrapmini    { float:left;line-height:1.5em;width:25% }
.pagelinks  { float:left;line-height:1.2em;width:35% }
.darkrow3 .desc { color:#fd3c21 }
.desc { font-size:10px; color:#5bb1b9}
.edit { font-size: 9px }

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

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

.searchlite { font-weight:bold; color:#569dbe; background-color:#e1e0e0}
</STYLE><CENTER>Skin created by <B>Anna</B>. Find more great skins at the <B><A HREF="http://forums.ifskinzone.net/index.php?act=idx" TARGET="_BLANK">IF Skin Zone</A></B>.</CENTER><STYLE TYPE="text/css">


#QUOTE { font-family: Verdana, Arial; font-size: 11px; color: #f26e2e; background-color: #e1e0e0; border: 1px solid #ffffff; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }
#CODE  { font-family: Courier, Courier New, Verdana, Arial;  font-size: 11px; color: #f26e2e; background-color: #e1e0e0; border: 1px solid #ffffff; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }

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

.codebuttons  {background-image: url(http://i5.ifrm.com/6158/57/upload/p93982.gif); font-size: 10px; color: #f26e2e;  font-family: verdana, helvetica, sans-serif; vertical-align: middle; border:1px dotted #ffffff; }
.forminput, .textinput, .radiobutton, .checkbox  {background-color:#e1e0e0; font-size: 11px;color: #f26e2e; font-family: verdana, helvetica, sans-serif; vertical-align: middle; border:1px dotted #ffffff; }

.thin { padding:6px 0px 6px 0px;line-height:140%;margin:2px 0px 2px 0px;border-top:1px solid #ffffff;border-bottom:1px solid #ffffff}

.boardtable { background-color: #e1e0e0;border:1px solid #345487; }

div.row4 {border-color:#ffffff  ;border-right:1px dotted #c3bee1 ;border-bottom:1px dotted #c3bee1  !important}
div.row4 {border-color:#ffffff  !important;background-color: #eeecec  ;}

div.tableborder div.tablepad { background-color: #eeecec!important; }
div.tableborder div.tablepad  table { background-color: #eeecec!important; }


.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 }


<STYLE type="text/css">
<!--
BODY {
scrollbar-face-color: #569dbe;
scrollbar-highlight-color: #e1e0e0;
scrollbar-3dlight-color: #e1e0e0;
scrollbar-darkshadow-color: #e1e0e0;
scrollbar-shadow-color: #e1e0e0;
scrollbar-arrow-color: #e1e0e0;
scrollbar-track-color: #e1e0e0;
}-->
Offline Profile Quote Post Goto Top
 
Replies:
PrinceVegeta
Member Avatar
Member
[ *  *  *  * ]
perfect 10/10
Offline Profile Quote Post Goto Top
 
Menindrag
Member Avatar
a work in progress
[ *  *  *  *  *  *  * ]
Didn't expect this. Better than I thought beacuse looking at your post count, I didn;t really expect much. Have you had experinced skinning before? Since you look expeinced, I'll point out some extra bits...

Firstly, please please please remove the white from the tableborder. It looks horrible and defualt. Change it to a #CCCCCC.

Changw your darkrow2 and titlemeduim. Eg, titlemeduim grad = darkrow2 and darkrow2 grad = titlemeduim.

The sirls on your maintitle are really pweety. I suggest changing the text area. Reverse the gradient or add a border ot it. Liven it up a bit.

Quote and code background color #F4F4F4 please. Border #CCCCCC please.

Remove the underline JUST from the link state and change the text from Verdana to Tahoma.

If you use these topis then you skin will look a whole lot better.
Offline Profile Quote Post Goto Top
 
Kadilac
Member
[ *  * ]
Thank you all for your comments and suggestions on how to make this a better skin and I will mess around with the CSS over the next few days tweaking and yes-I will make the tableborder a bit darker.

Damein-I have been skinning since right after I joined SZ back in 03. I lurk here quite a bit reading and browsing through the documentations on Skinning and Graphics.
Offline Profile Quote Post Goto Top
 
Lastscionz
Member Avatar
.-.
[ *  *  *  *  *  *  * ]
It looks good, but I think the background is a bit too dark for the skin itself. Otherwise this is very nice. :)
Offline Profile Quote Post Goto Top
 
Nonsense
Member Avatar
ByShine
[ *  *  *  *  * ]
Pretty good.
Offline Profile Quote Post Goto Top
 
ArchAngelTHC
Member Avatar
Member
[ *  *  *  * ]
The border on the left of the skin has a red mark near the forums and categories and on the right side there isn't. I don't know if it's the border repeating itself or whatnot, but you might want to try and fix that. That's all I seemed to find at the moment.
Offline Profile Quote Post Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
« Previous Topic · Light · Next Topic »
Add Reply
  • Pages:
  • 1
  • 2