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
Moonless Night - First IF Skin!
Topic Started: Jan 2 2008, 10:34 AM (1,031 Views)
fijiguide
Member
[ * ]
Name: Moonless Night
Author: Me, Fijiguide
Skin Number: 1 (At least for IF)
Date Created: Jan. 1st, 2008
Side Notes: I have made other skins before... for Hosted-Forum and the like. This one is just adapted from the hosted-forum version for IF. And the Portal doesnt really work. Neither do the profiles.

Preview?

Change the parts in red to your board's URL.
Banner is changed from the Images panel.
Made for FF, works in IE only the images arent transparent.

header
 
<body>
<div align="left" style="border:1px solid #FFF; float:left; width:190px;margin:1px 10px 10px 10px; background:#000; padding:5px; text-align:right; color:#FFF; border-right:5px solid #6598AE; padding-right:0px;">
<a href="http://z15.invisionfree.com/fijiguide1/index.php?act=index">HOME</a><br>
<a href="http://z15.invisionfree.com/fijiguide1/index.php?act=boardrules">RULES</a><br>
<a href="http://z15.invisionfree.com/fijiguide1/index.php?act=search">SEARCH</a><br>
<a href="http://z15.invisionfree.com/fijiguide1/index.php?act=members">MEMBERS</a><br>
<a href="http://z15.invisionfree.com/fijiguide1/index.php?act=calendar">CALENDAR</a>
</div><div id="ipbwrapper" align="right;" style="float:right;">
<% BOARD HEADER %>
<% NAVIGATION %>
<% BOARD %>
<% STATS %>


footer
 
<center>Skin created by <b>Fijiguide</b> of the  <b><a href="http://forums.ifskinzone.net/index.php?act=idx">IFSZ</a></b>.</center>
</div>


css
 
html { overflow-x: hidden; overflow-y: auto }
BODY { font-family: Trebuchet MS; font-size: 8pt; margin: 0px; padding: 0px; align: center; color: #6C6C6C; background: #343434 url(http://sixpop.com/images/file/1757026.png) }
TABLE, TR, TD { font-family: Trebuchet MS; font-size: 8pt; color: #6C6C6C }
a:link, a:visited, a:active { text-decoration: none; color: #FFFFFF }
a:hover { text-decoration: none; color: #6598AE }
h1 { border-bottom: 1px dotted #FFFFFF; font-size: 13px; font-family: Trebuchet MS; font-weight: bold; color: #CDCDCD; text-transform: lowercase }
b { color: #6598AE; letter-spacing: 1px }
#ipbwrapper { text-align: justify; width: 780px; padding: 0px 0px 0px 0px; align: left; background: #000000; border-left: 1px solid #FFFFFF; margin: 0px 0px 0px auto }
.maintitle { vertical-align: bottom; font-weight: bold; font-size: 20px; text-transform: uppercase; color: #454545; text-align: right; border-bottom: 1px dotted #FFFFFF; background: #000000; line-height: 16px; padding-top: 5px }
.maintitle a:link, .maintitle  a:visited, .maintitle  a:active { text-decoration: none; color: #454545 }
.maintitle a:hover { text-decoration: none; color: #63A2BD }
.titlemedium { font-weight: bold; padding: 2px; margin: 0px; color: #FFFFFF; background: #101010; text-align: center }
.pformstrip { font-weight: bold; padding: 2px; color: #FFFFFF; background: #101010 }
.postlinksbar { padding: 2px; margin-top: 1px; font-size: 10px; color: #FFFFFF; background: #101010 }
.postlinksbar a { color: #FFFFFF }
.postlinksbar a:hover { color: #6598AE }
#ipsbanner { position: absolute; top: 1px; right 5%:  }
#logostrip { padding: 0px; margin: 0px; background: #FFFFFF }
#submenu { display: none }
#userlinks { border-bottom: 0px; color: #FFFFFF; background: #000000 }
#userlinks a:link, a:visited, a:active { color: #FFFFFF }
#userlinks a:hover { color: #C6C4C6 }
#navstrip { padding: 4px; text-align: center; border-top: 0px; color: #FFFFFF; background: #000000; font-size: 9pt }
#navstrip a:link, a:active, a:visited { color: #FFFFFF }
#navstrip a:hover { text-transform: lowercase; color: #FFFFFF }
.row1 { background: #232323 }
.row2 { background: #232323 }
.row3 { background: #232323 }
.row4 { background: #232323 }
.darkrow1 { color: #FFFFFF; background: #101010 }
.darkrow2 { color: #FFFFFF; background: #101010 }
.darkrow3 { color: #FFFFFF; background: #232323 }
.post1 { background: #454545 }
.post2 { background: #454545 }
.signature { font-size: 9px; line-height: 150%; color: #FFFFFF }
.postdetails { font-size: 9px }
.postcolor { font-size: 9pt; line-height: 140%; padding: 17px }
.normalname { font-size: 11px; font-weight: bold; color: #FFFFFF }
.normalname a:link, .normalname a:visited, .normalname a:active { font-size: 11px; text-align: center }
.unreg { font-size: 10px; font-weight: bold; color: #FFFFFF }
.desc { font-size: 7.5pt; color: #6C6C6C; line-height: 120% }
.edit { font-size: 9px }
#QUOTE { font-family: Trebuchet MS; font-size: 8pt; padding: 2px; color: #CDCDCD; background: #676767; border: 1px solid #000000 }
#CODE { font-family: Trebuchet MS; font-size: 8pt; padding: 2px; color: #CDCDCD; background: #676767; border: 1px solid #000000 }
.copyright { font-family: Trebuchet MS; font-size: 9px; line-height: 10px }
#ucpmenu { line-height: 150%; width: 22%; background: #232323 }
#ucpmenu p { padding: 2px 5px 6px 9px; margin: 0px }
#ucpcontent { line-height: 150%; width: auto; background: #232323 }
#ucpcontent p { padding: 10px; margin: 0px }
.activeuserstrip { padding: 3px; border-top: 0px; color: #FFFFFF; background: #101010 }
.pformleft { padding: 6px; margin-top: 1px; width: 25%; background: #181818 }
.pformleftw { padding: 6px; margin-top: 1px; width: 15%; background: #232323 }
.pformright { padding: 6px; margin-top: 1px; background: #232323 }
.hlight { background: #232323 }
.dlight { background: #232323 }
.plainborder { background: #FFFFFF; border: 1px solid #000000 }
.tablefill { padding: 6px; background: #232323; border: 1px solid #000000 }
.tablepad { padding: 6px; background: #232323 }
.tablebasic { width: 100%; padding: 0px 0px 0px 0px; margin: 0px; border: 0px }
fieldset.search { padding: 6px; line-height: 150% }
label { cursor: pointer }
form { display: inline }
img { vertical-align: middle; border: 0px }
img.attach { padding: 2px }
.googleroot { padding: 6px; l ine-height: 130% }
.googlechild { padding: 6px; margin-left: 30px; line-height: 130% }
.googlebottom, .googlebottom a:link, .googlebottom a:visited, .googlebottom a:active { font-size: 9px; color: #FFFFFF }
.googlish, .googlish a:link, .googlish a:visited, .googlish a:active { font-size: 14px; font-weight: bold; color: #FFFFFF }
.googlepagelinks { font-size: 1.1em; letter-spacing: 1px }
.googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited { font-size: 10px; color: #FFFFFF }
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: #FFFFFF }
.caldate { text-align: right; font-weight: bold; font-size: 9px; padding: 4px; margin: 0px; color: #FFFFFF; background: #101010 }
.warngood { color: green }
.warnbad { color: red }
#padandcenter { margin-center: 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: 24penter; margin-top: 15px }
#photoimg { text-align: center; margin-top: 15px }
.wrapmini { float: left; line-height: 1.5em; width: 25% }
.pagelinks { float: left; line-height: 1.2em; width: 35% }
.searchlite { font-weight: bold; color: #FFFFFF; background: #FFFFFF }
.codebuttons { font-size: 7.5pt; font-family: Trebuchet MS; vertical-align: middle; background: #454545; border: 1px solid #000000 }
.forminput, .textinput, .radiobutton, .checkbox { font-size: 8pt; font-family: Trebuchet MS; vertical-align: middle; text-align: justify; background: #454545; border: 1px solid #000000; color: #CDCDCD }
.purple { font-weight: bold; color: purple }
.red { font-weight: bold; color: red }
.green { font-weight: bold; color: green }
.blue { font-weight: bold; color: blue }
.orange { font-weight: bold; color: #FFFFFF }
Offline Profile Quote Post Goto Top
 
Mortgrim slithe
Member Avatar
Member
[ *  * ]
The board alignment is ANNOYING. It takes the whole skin and makes it way worse than it could be.

2/10
Offline Profile Quote Post Goto Top
 
Paleognath
Napoleon '08
[ *  *  *  * ]
The skin is actually kind of nice, so maybe a 7 out of 10.
Offline Profile Quote Post Goto Top
 
SeanMichael
Member Avatar
Mae Cymru am Byth!
[ *  *  * ]
It is really nice but you may need to fix the board alingment =)
Offline Profile Quote Post Goto Top
 
Alphabeat
Member Avatar
Member
[ * ]
the skin is okay.. but the alignment of the board is bad.. you need to center it more :)
Offline Profile Quote Post Goto Top
 
Aetheria
Member Avatar

[ *  *  *  *  *  *  *  * ]
I like the board alignment. It's different.

I also love the simplicity of it. Change the post background colors (.post1 and .post2) to something darker though.

I'd love to see some of your other work.
Offline Profile Quote Post Goto Top
 
Minato-4th
Member Avatar
Member
[ *  * ]
love this skin but the top at the part is miss placed
Offline Profile Quote Post Goto Top
 
.Person
Member Avatar
iPBFS Public Relations
[ *  *  *  * ]
¤ Puting the main part of the board on the right is neat and uncommon. But for me, and I'm sure others, it could get confusing and make us all feel that we are missing out on something.

¤ I like the colors you used, but why give the numbers their own color?

I really like it.
Offline Profile Quote Post Goto Top
 
fijiguide
Member
[ * ]
Quote:
 
¤ I like the colors you used, but why give the numbers their own color?
Well I just made the tag <b> blue, and 1px letter spaced is all.
Quote:
 
The board alignment is ANNOYING. It takes the whole skin and makes it way worse than it could be.
How so?
Quote:
 
love this skin but the top at the part is miss placed
What do you mean?
Offline Profile Quote Post Goto Top
 
|p4|Brass Monkey
Member Avatar
Member
[ *  *  *  *  * ]
It's awesome. Beautifully simplistic and perfectly executed. All you hataz mad cuz he just made some Bathing Apes!
Offline Profile Quote Post Goto Top
 
.Danilo
Member Avatar
the original pirate
[ *  *  *  *  *  *  *  * ]
I really like the way you did things there. The simplicity looks very nice. ^_^ I'd just try changing the white dotted borders to a light gray so it stands out a bit less. Great job. Keep on skinning.
Offline Profile Quote Post Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
« Previous Topic · Dark · Next Topic »
Add Reply