Welcome Guest [Log In] [Register]
  • Pages:
  • 1
Asphalt; [ Black | Dark Gray | Gray ]
Topic Started: Jul 9 2007, 12:56 AM (1,494 Views)
Crossfire.
Member Avatar
TZ Obsessed
name » Asphalt

author » Crossfire

skin.number » 14

date.created » 05·13·07

side.notes »


preview.skin

skin.header.body:
Quote:
 
<body background="http://209.85.12.231/11034/187/upload/p2533713.gif" bgcolor="#151515" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" alink="#000000" vlink="#000000" style="background-repeat: repeat-x;">
<table align="center" width="800px" cellpadding="0px" cellspacing="0px" style="border: 1px solid #000000;">
<tr>
<td bgcolor="#2C2C2C" style="border: 1px solid #3E3E3E;">
<table align="center" width="750px" cellpadding="0px" cellspacing="0px">
<tr>
<td class="banner">
<center><img src="http://209.85.12.231/11034/187/upload/p2709622.ibf"></center>
</td>
</tr>
<tr>
<td class="customsubmenu">
<img src="http://209.85.12.231/11034/187/upload/p2533958.gif">&nbsp;<a href="http://z4.invisionfree.com/CrossfireStudio14/index.php?act=idx">Index</a>&nbsp;&nbsp;&nbsp;<img src="http://209.85.12.231/11034/187/upload/p2533958.gif">&nbsp;<a href="http://z4.invisionfree.com/CrossfireStudio14/index.php?act=site">Portal</a>&nbsp;&nbsp;&nbsp;<img src="http://209.85.12.231/11034/187/upload/p2533958.gif">&nbsp;<a href="http://z4.invisionfree.com/CrossfireStudio14/index.php?act=boardrules">Guidelines</a>&nbsp;&nbsp;&nbsp;<img src="http://209.85.12.231/11034/187/upload/p2533958.gif">&nbsp;<a href='http://z4.invisionfree.com/CrossfireStudio14/index.php?act=Help'>Help</a>&nbsp;&nbsp;&nbsp;<img src="http://209.85.12.231/11034/187/upload/p2533958.gif">&nbsp;<a href='http://z4.invisionfree.com/CrossfireStudio14/index.php?act=Search&f='>Search</a>&nbsp;&nbsp;&nbsp;<img src="http://209.85.12.231/11034/187/upload/p2533958.gif">&nbsp;<a href='http://z4.invisionfree.com/CrossfireStudio14/index.php?act=Members'>Members</a>&nbsp;&nbsp;&nbsp;<img src="http://209.85.12.231/11034/187/upload/p2533958.gif">&nbsp;<a href='http://z4.invisionfree.com/CrossfireStudio14/index.php?act=calendar'>Calendar</a> 
</td>
</tr>
</table>
<table align="center" width="750px" cellpadding="0px" cellspacing="0px">
<tr>
<td>
<% BOARD HEADER %>
<% NAVIGATION %>
<% BOARD %>
<br>
<table align="center" width="500px" cellpadding="0px" cellspacing="0px" style="border: 1px solid #000000;">
<tr>
<td>
<div class="row4" style="padding: 3px;"><center>Asphalt skin created by Crossfire of the <a href="http://www.ifskinzone.net" target="_blank">InvisionFree Skin Zone</a>.</center></div>
</td>
</tr>
</table>

skin.footer:
Quote:
 
</td>
</tr>
</table>
</td>
</tr>
</table>

<script type="text/javascript">
a = document.getElementsByTagName('div')
for (c=0;c<a.length;c++)
{
if (a[c].className == 'row4' && a[c].innerHTML.match('google_ad_width'))
{
a[c].className = 'adspace'
}
}
</script>

skin.css:
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: #000000; margin: 0px 10px 0px 10px; background-color: #151515; }
TABLE, TR, TD { font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 11px; color: #000000; }
a:link, a:visited, a:active { text-decoration: underline; color: #000000; }
a:hover { color: #151515; 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: #0000ED; }
.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: #555555; }
.caldate { background-color: #535353; background-image: url(http://209.85.12.231/11034/187/upload/p2709181.gif); background-repeat: repeat-x; color: #000000; text-align: center; }

.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 #000000; }
#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 { display: none; }
#submenu { display: none; }
#submenu a:link, #submenu  a:visited, #submenu a:active { font-weight: bold; font-size: 10px; text-decoration: none; color: #000000; }
#userlinks { border: 1px solid #000000; background-color: #303030; background-image: url(http://209.85.12.231/11034/187/upload/p2533822.gif); background-repeat: repeat-x; }

#navstrip  { font-weight: bold; padding: 6px 0px 6px 0px; }

.activeuserstrip { font-weight: normal; color: #000000; padding: 4px; margin: 0px; background-color: #303030; background-image: url(http://209.85.12.231/11034/187/upload/p1821664.gif); background-repeat: repeat-x; border: 1px solid #000000; }

.pformstrip { font-weight: normal; color: #000000; padding: 4px; margin: 0px; background-color: #303030; background-image: url(http://209.85.12.231/11034/187/upload/p1821664.gif); background-repeat: repeat-x; border-right: 1px solid #303030; border-left: 1px solid #303030; }
.pformleft  { background-color: #404040; background-image: url(http://209.85.12.231/11034/187/upload/p1822216.gif); background-repeat: repeat-x; padding: 6px; margin-top: 1px; width: 25%; border-top: 1px solid #000000; border-right: 1px solid #000000; }
.pformleftw { background-color: #404040; padding: 6px; margin-top:1px;width:40%; border-top: 1px solid #000000; border-right: 1px solid #000000; }
.pformright { background-color: #404040; background-image: url(http://209.85.12.231/11034/187/upload/p1822216.gif); background-repeat: repeat-x; padding: 6px; margin-top: 1px; border-top: 1px solid #000000; }

.post1 { color: #000000; background-color: #404040; background-image: url(http://209.85.12.231/11034/187/upload/p1822216.gif); background-repeat: repeat-x; border-right: 1px solid #404040; border-left: 1px solid #404040; }
.post2 { color: #000000; background-color: #404040; background-image: url(http://209.85.12.231/11034/187/upload/p1822216.gif); background-repeat: repeat-x; border-right: 1px solid #404040; border-left: 1px solid #404040; }
.postlinksbar { font-weight: normal; color: #000000; padding: 4px; margin: 0px; background-color: #303030; background-image: url(http://209.85.12.231/11034/187/upload/p1821664.gif); background-repeat: repeat-x; border-top: 1px solid #000000; border-right: 1px solid #000000; border-left: 1px solid #000000; }

.row1 { background-color: #535353; background-image: url(http://209.85.12.231/11034/187/upload/p2709181.gif); background-repeat: repeat-x; color: #000000; }
.row2 { color: #000000; background-color: #404040; background-image: url(http://209.85.12.231/11034/187/upload/p1822216.gif); background-repeat: repeat-x; border-right: 1px solid #404040; border-left: 1px solid #404040; }
.row2 a:link, .row2 a:visited, .row2 a:active { text-decoration: none; color: #151515; }
.row2 a:hover { text-decoration: underline; }
.row3 { background-color: #535353; background-image: url(http://209.85.12.231/11034/187/upload/p2709181.gif); background-repeat: repeat-x; color: #000000; }
.row4 { color: #000000; background-color: #404040; background-image: url(http://209.85.12.231/11034/187/upload/p1822216.gif); background-repeat: repeat-x; border-right: 1px solid #404040; border-left: 1px solid #404040; }
.row4 a:link, .row4 a:visited, .row4 a:active { text-decoration: none; color: #151515; }
.row4 a:hover { text-decoration: underline; }

.darkrow1 { background-color: #2C2C2C; color: #000000; }
.darkrow2 { color: #737373; background-color: #1D1D1D; background-image: url(http://209.85.12.231/11034/187/upload/p1822325.gif); background-repeat: repeat-x; border-right: 1px solid #515151; border-left: 1px solid #515151; }
.darkrow3 { color: #000000; background-color: #404040; background-image: url(http://209.85.12.231/11034/187/upload/p1822216.gif); background-repeat: repeat-x; border-right: 1px solid #404040; border-left: 1px solid #404040; }

.hlight { background-color: #DFE6EF; }
.dlight { background-color: #EEF2F7; }

.titlemedium { font-weight: normal; color: #000000; padding: 4px; margin: 0px; background-color: #303030; background-image: url(http://209.85.12.231/11034/187/upload/p1821664.gif); background-repeat: repeat-x; border-right: 1px solid #303030; border-left: 1px solid #303030; }
.titlemedium  a:link, .titlemedium  a:visited, .titlemedium  a:active  { text-decoration: underline; color: #151515; }

.maintitle { text-align: center; vertical-align: middle; font-weight: normal; color: #737373; letter-spacing: 1px; padding: 8px 0px 8px 0px; background-image: url(http://209.85.12.231/11034/187/upload/p1538330.gif); background-align: center; background-repeat: no-repeat; }
.maintitle a:link, .maintitle  a:visited, .maintitle  a:active { text-decoration: none; color: #737373; }
.maintitle a:hover { text-decoration: underline; }

.plainborder { border: 1px solid #345487; background-color: #F5F9FD; }
.tableborder { border: 1px solid #3E3E3E;background-color: #000000; padding: 0px; margin: 0px; width: 100%; }
.tablefill  { background-color: #535353; background-image: url(http://209.85.12.231/11034/187/upload/p2709181.gif); background-repeat: repeat-x; border: 1px solid #000000; color: #000000; }
.tablepad    { background-color: #535353; background-image: url(http://209.85.12.231/11034/187/upload/p2709181.gif); background-repeat: repeat-x; border: 1px solid #000000; color: #000000; padding: 3px; }
.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%; }

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

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

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

.searchlite { font-weight: bold; color: #FF0000; background-color: #FFFF00; }

#QUOTE { font-family: Verdana, Arial; font-size: 11px; color: #465584; background-color: #FAFCFE; border: 1px solid #000000; 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 #000000; 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: 5px;  border-top: 1px solid #202020; border-left: 1px solid #202020; border-right: 1px solid #515151; border-bottom: 1px solid #515151; }

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

.banner { background-color: #1A1A1A; background-image: url(http://209.85.12.231/11034/187/upload/p2533885.gif); background-repeat: repeat-x; border-top: 1px solid #000000; border-right: 1px solid #000000; border-left: 1px solid #000000; padding: 0px; }
.customsubmenu { border: 1px solid #000000; background-color: #303030; background-image: url(http://209.85.12.231/11034/187/upload/p2533822.gif); background-repeat: repeat-x; padding: 5px; text-align: center; }
.customsubmenu a:link, .customsubmenu  a:visited, .customsubmenu a:active { font-weight: bold; font-size: 10px; text-decoration: none; color: #000000; }

input { background-color: #535353; background-image: url(http://209.85.12.231/11034/187/upload/p2709181.gif); background-repeat: repeat-x; border: 1px solid #000000; color: #000000; }
select { background-color: #535353; background-image: url(http://209.85.12.231/11034/187/upload/p2709181.gif); background-repeat: repeat-x; border: 1px solid #000000; color: #000000; }
textarea { background-color: #535353; background-image: url(http://209.85.12.231/11034/187/upload/p2709181.gif); background-repeat: repeat-x; border: 1px solid #000000; color: #000000; }

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

.adspace { background-color: #404040; border: 1px solid #000000; margin-top: 5px; margin-bottom: 5px; padding: 0px; }

#ipbwrapper { width: 800px; margin-left: auto; margin-right: auto; }
#ipbwrapper .row2 { border-right: 0px solid #000000; border-bottom: 1px solid #000000; border-left: 0px solid #000000; }
#ipbwrapper .row4 { border: 0px solid #000000; }
#ipbwrapper .maintitle { background-position: center; border-bottom: 1px solid #000000; padding: 7px; }
#ipbwrapper .tableborder { background-color: #535353; background-image: url(http://209.85.12.231/11034/187/upload/p2709181.gif); background-repeat: repeat-x; border: 1px solid #000000; }
#ipbwrapper .tablepad { border: 0px solid #000000; }
Posted Image Posted Image Posted Image
Goto Top
 
Skyvale
Member Avatar
Thanks for the avatar, TTO!
Nice skin. :) I really like it. Good job.
Posted ImageDog-eat-dog world - [Blog Post]
Goto Top
 
Seraphim.
Member Avatar
Possible Bot
Looks good except next time use a lighter color for the text.
A Premier Gaming Social Network
Posted Image
Goto Top
 
Crossfire.
Member Avatar
TZ Obsessed
Thank you both.

@ .Seraphim: Yea, hehe, I was thinking the same thing, but I asked some people, and they said it was easy to read. I guess it's just the varying monitor brightness. :/
Posted Image Posted Image Posted Image
Goto Top
 
iambreezybee
Member Avatar
New Member
Well, at least it looks good. The text seems to be the only problem. I like it still.
Posted Image
Goto Top
 
Beaumont
Member Avatar
TZ Obsessed
Very nice. Although I don't like the maintitle, with the black on it. And again, I say the text should be lighter.
Posted Image
Goto Top
 
Crossfire.
Member Avatar
TZ Obsessed
Thanks, Taz. What do you mean about the maintitle?
Posted Image Posted Image Posted Image
Goto Top
 
Beaumont
Member Avatar
TZ Obsessed
Well, it looks really good, and what I was saying that I don't like how the gradient goes to black where, no where else on your skin, does a gradient go to black. But it doesn't look too bad.
Posted Image
Goto Top
 
Crossfire.
Member Avatar
TZ Obsessed
Ah, ok, thank you.
Posted Image Posted Image Posted Image
Goto Top
 
Fraust
Louder than Thunder
I love the darkness. -_- It somehow easy on my eyes to read black on dark-black. Very nice skin.
Goto Top
 
Crossfire.
Member Avatar
TZ Obsessed
Very interesting...thanks, Joey.
Posted Image Posted Image Posted Image
Goto Top
 
.sionthede
Theme Zone

I am just randomly reviewing skins to help people improve ^_^ I hope you don't mind.
Quote:
 
<span style='font-size:7pt;line-height:100%'>
Appearance: 6/10
Coding: 7/10
Defaults: 6/10
Graphics: 6/10
Originality: 3/10
Usability: 5/10
Overall: 5/10


When I first viewed your skin I instantly knew that you have practiced and skinned quite a bit.  Your skin mixed a bit of what everyone likes these days with your own style.  Its always great to see skinners blossoming out. ^_^  There are a few areas of the skin which need some touch ups though.  The first thing that really stood out to me was the text....why?  You can't see it all that well in many places.  It should be lightened up.  Perhaps try something around #555555.

Overall the colors you used a very nicely put together, but if I do say so myself a bit bland.  Perhaps getting some color in there instead of just a monotone skin.  I would suggest just experimenting and trying to find a nice soft color that blends with the blackish gray you have selected.

Your coding is very well done.  You have even coded such sections as the portal and the search page.  It really shows that you know what you are doing.  I did see unnecessary bits of JavaScript used in your footer though.  The Google ads can always be skinned by using div.row4.

You have quite a few defaults you haven't cleared.  13 in all.  I suggest you run your CSS through a Default Checker and fix those areas up.  It would great way to help you become familiar with the less worried about parts when skinning.

Your graphics are very well made.  You are improving with every skin you make. :)  I would suggest experimenting with different mixtures of gradients and blending options to make your gradient a little softer.  It is a bit over glossed and could do with some darkening at the top.  Also the ending of your background gradient is a bit abrupt, perhaps you could ease it into the background with a fade in the bottom to make it less...abrupt.

Your skin is nothing new although it is nice and could be used by many people.  It is always great to see some of the same styles being done so that people have a choice of usable skins.  Although I would love to see some originality I know that is hard to come by these days.  Just practice and work with everything you can think of.

Overall your skin was about an average skin you can find on many boards today.  Keep up the spectacular work and I hope to see more from you soon. ;)
I will just leave you with a few helpful suggestions and some quick links for skinning. :)


-----------------
Suggestions:


  • Lighten the text on your submenu and userlinks,  the blend in with the background making them hard to see.

  • Get rid of unneeded JavaScript in your footer.  Try viewing these topics to fix your Google ads using CSS. Google Ads Background and Copyright/Google  Ads Border.

  • Get rid of your defaults.  You can view a default checker Here.

  • It also never hurts to work on your graphics.  So always keep practicing.  Try looking for some tutorials in the Graphics Tutorials Forum


-----------------

Skinning Quick Links:


  • IFSZ Skinning Documentations -  This section of the forum has help myself countless times.  It is full of descriptive documentations to help the skinner in need.

  • IFSZ Skin Support  -  If you are still having questions or problems post a topic here and I am sure that a Support staff member will be glad to help you out.

  • Skindev.org - This site has an automatic default checker, an Invisionfree skinning guide, and much more to help the beginning skinner.

  • Helpful Skin Hints - Another quick links topic for skinners.

  • Invisionfree CSS Guide - This is a very descriptive guide that tells you which CSS class controls what part of the forum.  It is a very helpful item that can help even the most advanced skinners.


-----------------
[/font]</span>


I hope this review helps you improve your skinning skills and gives you a desire to keep improving. I know you have it in you. ;)
Posted Image
Goto Top
 
Sayf Udeen
Member Avatar
Proud Muslim
Wow! Crossfire. You really nailed it with this skin!
I love the maintitle.
But, [Okay, this may be my browser...] I'm only getting the diagonal stripe background once. Is it meant to continue?

~~xBif
Posted Image

Semiotic Forums - General chat. Politics. Religion. Issues. Headline News. Lifestyle. Join Today!


Posted Image
Goto Top
 
Crossfire.
Member Avatar
TZ Obsessed
@ .sionthede: o_O Wow...thanks, man. :) Just one thing: There is no background gradient. Thanks for all of that. I'll definitely use the default checker.

@ xBifnepasu: Thank you. Yes, it is meant to repeat.
Posted Image Posted Image Posted Image
Goto Top
 
Sayf Udeen
Member Avatar
Proud Muslim
Crossfire.
Jul 9 2007, 03:50 PM
@ xBifnepasu: Thank you. Yes, it is meant to repeat.

Okay. Odd. I can't get it to.
Oh well! I also like the submenu!
Posted Image

Semiotic Forums - General chat. Politics. Religion. Issues. Headline News. Lifestyle. Join Today!


Posted Image
Goto Top
 
.sionthede
Theme Zone

I'm just glad I could help. :D

Btw, I was just talking about this image
http://209.85.12.231/11034/187/upload/p2533713.gif
Posted Image
Goto Top
 
Crossfire.
Member Avatar
TZ Obsessed
Yea, it's not a gradient.
Posted Image Posted Image Posted Image
Goto Top
 
Handen
Member Avatar
Settled In
I think it's pretty good, but I would obviously like to see more originality. I think the graphics and the matching of the colors is all done really well, but it just doesn't have anything that sets it apart from another skin [ at least in my opinion ] if you could find that little thing to make it pop I think your skins would look much better :D

EDIT: Yet then again the PA! skin is quite beautiful :hehe:
Posted Image
Posted Image
Pip sets submitted |
24
Goto Top
 
Crossfire.
Member Avatar
TZ Obsessed
Thanks, Handen.
Posted Image Posted Image Posted Image
Goto Top
 
<dR>Sinion Kabe
Member Avatar
Settled In
Nice maintitle and overall feel.
Posted Image

[ General Chat | Advertisement | Graphics | Skins | Reviews | Support & More! ]

Posted Image
Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
Go to Next Page
« Previous Topic · Grayscale · Next Topic »
  • Pages:
  • 1