|
Modern; WOW
|
|
Topic Started: Feb 4 2007, 08:58 AM (1,095 Views)
|
|
stingray001
|
Feb 4 2007, 08:58 AM
Post #1
|
- Posts:
- 20
- Group:
- Members
- Member
- #144,635
- Joined:
- February 5, 2006
|
Name: Modern Author: stingray001 Skin Number: 3 Button set Number: 4 Date Created: 3 Feb 07 Side Notes: Yet another production of mine [ps.better this time]
Preview:




CSS of skin:
- Code:
-
html { overflow-x: hidden; overflow-y: auto; }
form { display:inline; } img { vertical-align:middle; border:0px } BODY { font-family: Arial, sans-serif; font-size: 11px; color: #393939; margin:0px 10px 0px 10px;background-color:#1e1e1e; background-image: url(http://i15.photobucket.com/albums/a371/stingray001/5ef1aefe.jpg); background-repeat:no-repeat; } TABLE, TR, TD { font-family: Arial, sans-serif; font-size: 11px; color: #393939; } a:link, a:visited, a:active { text-decoration: underline; color: #393939 } a:hover { color: #4976b9; 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:right;font-weight:bold;font-size:11px;color:#777;background-color:#DFE6EF;padding:4px;margin:0px }
.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 }
#ucpmenu { line-height:150%;width:22%; border:1px solid #345487;background-color: #F5F9FD } #ucpmenu p { padding:2px 5px 6px 9px;margin:0px; } #ucpcontent { background-color: #F5F9FD; border:1px solid #345487;line-height:150%; width:auto } #ucpcontent p { padding:10px;margin:0px; }
#ipsbanner { position:absolute;top:1px;right:5%; } #logostrip { border:0px;background-color: #000;} #submenu { display:none} #submenu a:link, #submenu a:visited, #submenu a:active { display:none; } #userlinks { border:1px solid #C2CFDF; background-color: #F0F5FA }
#navstrip { background-image:url(http://i15.photobucket.com/albums/a371/stingray001/9a02be5d.jpg); background-repeat:no-repeat; color:#a4a4a4; font-weight:bold;padding:10px 0px 16px 15px; } #navstrip a:link, #navstrip a:visited, #navstrip a:active { text-decoration: none; color: #FFF; }
.activeuserstrip { background-color:#BCD0ED; padding:6px }
.pformstrip { background-color: #000; background-image:url(http://i15.photobucket.com/albums/a371/stingray001/b4d24b1f.jpg); color:#FFF;font-weight:bold;padding:7px;margin-top:1px } .pformleft { background-color: #F5F9FD; padding:6px; margin-top:1px;width:25%; border-top:1px solid #C2CFDF; border-right:1px solid #C2CFDF; } .pformleftw { background-color: #F5F9FD; padding:6px; margin-top:1px;width:40%; border-top:1px solid #C2CFDF; border-right:1px solid #C2CFDF; } .pformright { background-color: #F5F9FD; padding:6px; margin-top:1px;border-top:1px solid #C2CFDF; }
.post1 { background-color: #F5F9FD } .post2 { background-color: #EEF2F7 } .postlinksbar { background-color:#D1DCEB;padding:7px;margin-top:1px;font-size:10px; background-image: url(http://i6.ifrm.com/style_images/<#IMG_DIR#>/tile_sub.gif) }
.row1 { background-color: #F5F9FD } .row2 { background-color: #FEFEFE; background-image: url(http://i15.photobucket.com/albums/a371/stingray001/8e328784.jpg); background-repeat:no-repeat; } .row3 { background-color: #EEF2F7 } .row4 { background-color: #FEFEFE; background-image: url(http://i15.photobucket.com/albums/a371/stingray001/8e328784.jpg); background-repeat:x-repeat;color:#393939; } .row4 a:link, .row4 a:visited, .row4 a:active { text-decoration: none }
.darkrow1 { background-color: #C2CFDF; color:#4C77B6; } .darkrow2 { display:none } .darkrow3 { background-color: #D1DCEB; color:#3A4F6C; }
.hlight { background-color: #DFE6EF } .dlight { background-color: #EEF2F7 }
.titlemedium { font-weight:bold; color:#FFF; padding:7px; margin:0px; background-image: url(http://i15.photobucket.com/albums/a371/stingray001/b4d24b1f.jpg); border:0px } .titlemedium a:link, .titlemedium a:visited, .titlemedium a:active { text-decoration: underline; color: #3A4F6C }
.maintitle { vertical-align:middle;font-weight:bold; color:#FFF; letter-spacing:1px; padding:15px 0px 5px 65px; background-image: url(http://i15.photobucket.com/albums/a371/stingray001/092bb9be.jpg) } .maintitle a:link, .maintitle a:visited, .maintitle a:active { text-decoration: none; color: #FFF } .maintitle a:hover { text-decoration: none }
.plainborder { border:1px solid #ededed;background-color:#F5F9FD } .tableborder { border:0px solid #ededed;background-color:#ededed; padding:0px; margin:0px; width:100% } .tablefill { border:1px solid #345487;background-color:#F5F9FD;padding:6px; } .tablepad { background-color:#F5F9FD;padding:6px } .tablebasic { width:100%; padding:0px 0px 0px 0px; margin:0px; border:0px }
.wrapmini { display:none } .pagelinks { float:left;line-height:1.2em;width:35% }
.desc { font-family: Arial, sans-serif; font-size:10px; color:#a4a4a4; } .edit { font-size: 9px }
.signature { font-size: 10px; color: #339 } .postdetails { font-size: 10px } .postcolor { font-size: 12px; line-height: 160% }
.normalname { font-size: 12px; font-weight: bold; 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 }
#QUOTE { font-family: Verdana, Arial; font-size: 11px; color: #465584; background-color: #FAFCFE; border: 1px solid #000; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px } #CODE { font-family: Courier, Courier New, Verdana, Arial; font-size: 11px; color: #465584; background-color: #FAFCFE; border: 1px solid #000; 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 { font-size: 10px; font-family: verdana, helvetica, sans-serif; vertical-align: middle } .forminput, .textinput, .radiobutton, .checkbox { font-size: 11px; font-family: verdana, helvetica, sans-serif; vertical-align: middle }
.thin { padding:6px 0px 6px 0px;line-height:140%;margin:2px 0px 2px 0px;border-top:1px solid #FFF;border-bottom:1px solid #FFF }
.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 }
.gfooter { background: #FFF; margin: 5px 0 5px 0; padding: 0; width: 100%; }
#mainbar { background-image:url(http://i15.photobucket.com/albums/a371/stingray001/d3602460.jpg); background-repeat:no-repeat; padding:11px 0px 8px 65px;font-weight:bold;font-size:11px;text-decoration: none; color: #39639f } #mainbar a:link, #mainbar a:visited, #mainbar a:active { font-weight:bold;font-size:11px;text-decoration: none; color: #000; word-spacing:30px; } #mainbar a:hover { font-weight:bold;font-size:11px;text-decoration: none; color: #39639f; word-spacing:30px; }
#specialbar { background-image:url(http://i15.photobucket.com/albums/a371/stingray001/d3602460.jpg); background-repeat:no-repeat; padding:11px 0px 8px 65px;font-weight:bold;font-size:11px;text-decoration: none; color: #39639f } #specialbar a:link, #specialbar a:visited, #specialbar a:active { font-weight:bold;font-size:11px;text-decoration: none; color: #FFF; } #specialbar a:hover { font-weight:bold;font-size:11px;text-decoration: none; color: #39639f; }
#specialbar1 { background-image:url(http://i15.photobucket.com/albums/a371/stingray001/d3602460.jpg); background-repeat:no-repeat; padding:11px 0px 8px 65px;font-weight:bold;font-size:11px;text-decoration: none; color: #39639f } #specialbar1 a:link, #specialbar1 a:visited, #specialbar1 a:active { font-weight:bold;font-size:11px;text-decoration: none; color: #000; } #specialbar1 a:hover { font-weight:bold;font-size:11px;text-decoration: none; color: #39639f; }
Document Type:
- Code:
-
<title>YOUR BOARD NAME HERE</title>
***** After doing this, please go to General Configuration > Board Name > Change to "Index"
Header & Body:
- Quote:
-
<table border="0" cellspacing="0" cellpadding="0" align="center"><tr> <td width="800" valign="top"> <br><br> <div align="right"><div style="width:500px;padding:12px; font-size:10px;border-bottom:0px;background-image:url( http://i15.photobucket.com/albums/a371/stingray001/9a02be5d.jpg);" id="specialbar" align="center"><b>Modern Skin developed by <a href="http://forums.ifskinzone.net/index.php?showuser=144635">stingray001</a> of <a href="http://forums.ifskinzone.net/index.php">IF Skin Zone</a></b></div></div><br><br> <% BOARD HEADER %> <% NAVIGATION %> <script type='text/javascript'> /* IPBv2 Style Guest Bar Created by iFusion */ function swapBar(){ if(document.getElementById('userlinks').innerHTML.match(/logged in as/i) == null){ document.getElementById('userlinks').getElementsByTagName('TD')[1].style.display="none"; document.getElementById('userlinks').getElementsByTagName('TD')[0].style.textAlign="center"; with(document.getElementById('userlinks') ){ style.backgroundColor="#f4e7ea"; style.border = "1px solid #986265" getElementsByTagName('TD')[0].innerHTML = getElementsByTagName('TD')[0].innerHTML.replace(/welcome guest/i, "<b>Welcome Guest</b>"); }}} if(document.getElementById('userlinks')){ swapBar(); } </script> <% BOARD %> <% STATS %>
Footer
- Code:
-
<script type='text/javascript'> //Put legend, and search box together in a table
//By Sean divs=document.getElementsByTagName('div') c=0 s='' t=Array() for(x=0;x<divs.length;x++) { if ((divs[x].className=='wrapmini'||c)&&c<3) {t[c]=divs[x];c++;} } if (t[0]) { for (x=0;x<2;x++) s+='<td>'+t[x].innerHTML+'</td>' s+="<td align='right'>"+t[2].innerHTML+"</td>" t[0].className='' t[0].innerHTML='<table style="border:1px solid #000000;width:100%;background-color:#e4eaf2"><tr>'+s+'</tr></td>' for (x=1;x<3;x++) document.body.removeChild(t[x]) } </script>
<script> var x = document.getElementsByTagName('DIV');for(i=0;i<x.length;i++) {if(x[i].className == 'row4' && x[i].innerHTML.match('Hosted for free by')) {x[i].id = 'copyright';}}var copyright = document.getElementById('copyright');copyright.className = '';copyright.style.border = '0px';copyright.lastChild.style.display = 'none';copyright.innerHTML = '<table width="100%" class="gfooter" cellSpacing="0" cellPadding="6"><tr><td width="33%"> </td><td width="33%" align="center"><b><a href="' + window.location.href.split('/index.php')[0] + '/ar/"><font color="#000"><font size="1">Lo-Fi Version</font></a></b></td><td align="right" width="33%"><font color="#000"><font size="1">Time is now: ' + new Date().toLocaleString() + '</font></td></tr></table><div class="row5" style="font-size:7.5pt;line-height:16px;padding:6px;cell-spacing:5px;align="center">' + copyright.innerHTML.replace('|', '<br />') + '</div>';var x = document.getElementsByTagName('DIV');for(i=0;i<x.length;i++) {if(x[i].innerHTML.match('Welcome back; your last visit was on')) {x[i].id = 'welcomeback';}}var welcomeback = document.getElementById('welcomeback');var loggedin = 1;var x = document.getElementsByTagName('DIV');for(i=0;i<x.length;i++) {if(x[i].className == 'maintitle' && x[i].innerHTML == 'Board Statistics') {x[i].style.display = 'none';x[i].parentNode.id = 'boardstats';}}var x = document.getElementsByTagName('A');for(i=0;i<x.length;i++) {if(x[i].innerHTML == 'Log In' && x[i].parentNode.parentNode.parentNode.parentNode.id == 'userlinks') {var loggedin = 0;}}var x = document.getElementsByTagName('INPUT');for(i=0;i<x.length;i++) {if(x[i].name == 'UserName') {if(document.getElementById('boardstats') != null){x[i].parentNode.style.display = 'none';}}}var rightside = '<form action="' + window.location.href.split('index.php')[0] + 'index.php?act=Login&CODE=01&CookieDate=1" method="post"><input type="text" class="forminput2" size="20" name="UserName" value="User Name" onfocus="if(this.value==\'User Name\'){this.value=\'\';}" /> <input type="password" class="forminput2" size="20" value="password" name="PassWord" onfocus="if(this.value==\'password\'){this.value=\'\';}" /> <img style="cursor:hand;" onclick="this.parentNode.submit();" src="http://i15.photobucket.com/albums/a371/stingray001/login-button.gif" /></form>';if(loggedin == 1) {var rightside = '<input type="text" class="forminput2" id="dk" onfocus="if(this.value.match(\'Enter words to search...\')){this.value=\'\';}" size="25" value="Enter words to search..." /> <img style="cursor:hand;" onclick="window.location=\'index.php?act=Search&f=&defaultkeywords=\'+document.getElementById(\'dk\').value;" src="http://i15.photobucket.com/albums/a371/stingray001/login-button.gif" />';}if(welcomeback != null){welcomeback.innerHTML = '<table id="userlinks" width="100%" cellPadding="10" cellSpacing="0"><tr><td width="40%" align="left">' + welcomeback.innerHTML + '</td><td align="right" valign="middle">' + rightside + '</td></tr></table><br>';}var x = document.getElementsByTagName('A');for(i=0;i<x.length;i++) {if(x[i].innerHTML == 'Delete cookies set by this board' && x[i].href.match('act=Login&CODE=06')) {var blinks = x[i].parentNode.innerHTML;x[i].parentNode.style.display = 'none';}if(x[i].innerHTML == 'The moderating team' && x[i].href.match('act=Stats&CODE=leaders')) {var statlinks = x[i].parentNode.innerHTML;x[i].parentNode.style.display = 'none';}}var boardstats = document.getElementById('boardstats');if(boardstats != null){boardstats.className = null;boardstats.innerHTML = '<div align="right"><div style="width:500px;padding:12px; font-size:10px;border-bottom:0px;background-image:url(http://i15.photobucket.com/albums/a371/stingray001/9a02be5d.jpg);" id="specialbar" align="center"><b><font color:#fff>' + blinks + '</font></b></div></div><br><br><div class="tableborder"><div class="maintitle">Board Statistics</div><div class="specialbar1" style ="border:0px; padding:10px; background-image:url(http://i15.photobucket.com/albums/a371/stingray001/d3602460.jpg);" align="right">' + statlinks + '</div>' + boardstats.innerHTML + '</div>';}if(window.location.href.match('showuser=') && document.title == 'Viewing Profile') {var profilename = document.getElementById('profilename').innerHTML;var navstrip = document.getElementById('navstrip');var x = document.getElementsByTagName('B');for(i=0;i<x.length;i++) {if(x[i].parentNode.className == 'row3') {var data2 = x[i].parentNode.parentNode.cells[1].innerHTML;if(x[i].innerHTML == 'Joined') {var joined = x[i].parentNode.parentNode.cells[1].firstChild.innerHTML;x[i].parentNode.parentNode.style.display = 'none';}if(x[i].innerHTML == 'Member Group') {x[i].parentNode.parentNode.parentNode.parentNode.parentNode.style.display = 'none';var membergroup = data2;}if(x[i].innerHTML == 'Member Title') {var membertitle = data2;}if(x[i].innerHTML == 'Avatar') {var avatar = data2;}if(x[i].innerHTML == 'Signature') {var signature = data2;}}}var signaturediv = '';if(signature != '') {signaturediv = '<br /><br /><div class="tableborder"><div class="maintitle">Signature</div><div class="row2" style="padding:6px;"><div class="signature">' + signature + '</div></div></div>';}navstrip.innerHTML = '<div id="navstrip">' + navstrip.innerHTML + '</div><br /><br /><div class="tableborder"><div class="maintitle">Viewing Profile: ' + profilename + '</div><div class="row2" style="padding:6px;"><div style="line-height:160%;"><span id="profilename">' + profilename + '</span><br /><br />' + avatar + '<br /><span class="desc">' + membertitle + '<br /><br />Member Group: ' + membergroup + '<br />Joined: ' + joined + '</span></div></div></div>' + signaturediv;navstrip.id = '';} </script>
Images can be found at my post below this one
|
|
|
| |
|
stingray001
|
Feb 4 2007, 09:04 AM
Post #2
|
- Posts:
- 20
- Group:
- Members
- Member
- #144,635
- Joined:
- February 5, 2006
|
http://www.freewebs.com/ddsz/images.htm
|
|
|
| |
|
OverTheBelow
|
Feb 4 2007, 09:41 AM
Post #3
|
- Posts:
- 3,294
- Group:
- Members
- Member
- #65,788
- Joined:
- April 6, 2005
|
Doesn't look worth that much coding..
|
|
|
| |
|
Seraphim.
|
Feb 4 2007, 01:04 PM
Post #4
|
- Posts:
- 1,980
- Group:
- Members
- Member
- #201,066
- Joined:
- August 8, 2006
|
It looks good in the previews but when you actually put it on a board it aligns itself a little the right throwing it off the white inner bg and into the image outside.
|
|
|
| |
|
7 in a row
|
Feb 4 2007, 01:07 PM
Post #5
|
- Posts:
- 528
- Group:
- Members
- Member
- #215,608
- Joined:
- September 29, 2006
|
Maybe you should make a test board instead of images.
|
|
|
| |
|
BlueMatter
|
Feb 4 2007, 03:47 PM
Post #6
|
- Posts:
- 1,333
- Group:
- Members
- Member
- #80,764
- Joined:
- June 12, 2005
|
Sorry buddy, not really liking this skin. Nice try tho
|
|
|
| |
|
Doofosmitch (PM)
|
Feb 4 2007, 05:53 PM
Post #7
|
I've heard it all before.
- Posts:
- 1,549
- Group:
- Restricted (PM)
- Member
- #247,996
- Joined:
- February 4, 2007
|
Don't like this either, seems very basic.
Nice try though, better than what i can do
|
|
|
| |
|
Beaumont
|
Feb 4 2007, 07:13 PM
Post #8
|
- Posts:
- 1,986
- Group:
- Members
- Member
- #222,970
- Joined:
- October 28, 2006
|
Its good. But next time make a test board. Easier for us to see it.
|
|
|
| |
|
Master_Joe
|
Feb 4 2007, 07:47 PM
Post #9
|
- Posts:
- 292
- Group:
- Members
- Member
- #243,414
- Joined:
- January 18, 2007
|
I don't really like it but thats good for a third skin though.
|
|
|
| |
|
Bibbity
|
Feb 4 2007, 08:03 PM
Post #10
|
- Posts:
- 5,387
- Group:
- Members
- Member
- #81,086
- Joined:
- June 13, 2005
|
Your skin needs a working preview, please provide one within 24 hours.
|
|
|
| |
|
stingray001
|
Feb 5 2007, 04:30 AM
Post #11
|
- Posts:
- 20
- Group:
- Members
- Member
- #144,635
- Joined:
- February 5, 2006
|
PREVIEW > http://z6.invisionfree.com/elegantskin
|
|
|
| |
|
Peter
|
Feb 5 2007, 08:16 AM
Post #12
|
- Posts:
- 3,202
- Group:
- Members
- Member
- #50,386
- Joined:
- January 28, 2005
|
Personally, while I don't think this is a bad skin, there are number of things which irritate me, though some may just be personal preference. 1. The maintitle text area is much too small, if anyone has a long category name then it will go over the edge and look silly. 2. You have a number of flat back areas across the skin: your copyright, the #navstrip, .titlemedium etc. I can see that some of them have background images, but the contrast is so little that they look pretty much like solid blocks of colour. These areas make parts of the skin look dull and flat in contrast to the bright blue gradient on the maintitle. 3. Personally I really don't like the IPB style log in and stuff, it just isn't worth having as much code as you do just to have a few bits like IPB does.
Like I said: it's not a bad skin, but it could be improved. Keep trying
|
|
|
| |
|
|p4|Brass Monkey
|
Feb 5 2007, 09:25 AM
Post #13
|
- Posts:
- 1,718
- Group:
- Members
- Member
- #218,984
- Joined:
- October 12, 2006
|
pretty buttons!
|
|
|
| |
|
AstronomyXtreme
|
Feb 5 2007, 12:39 PM
Post #14
|
- Posts:
- 1,627
- Group:
- Members
- Member
- #1,241
- Joined:
- September 5, 2003
|
The black is really annoying and the images are a little large...
Otherwise, it looks good.
|
|
|
| |
| 1 user reading this topic (1 Guest and 0 Anonymous)
|