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
Skin Request!; Music Site
Topic Started: May 3 2004, 03:29 PM (197 Views)
Hassan
Member
[ * ]
Hello,

I am very new here and I dont know how skin works but I have tried to follow the Guidelines.

Background Color = EFF0F0
Border Color = 980E0E
Font Color = 000000
Link Color = EF9800
Hover Color = 980E0E
Row 1 and 2 colors = EFF0F0
Row 3 and 4 Colors = EFF0F0
Dark Row 1 = FFBF7F
Dark Row 2 & 3 = FFBF7F
Category (.maintitle) Color = EF9800
Sub Category (.titlemedium) Color = FFBF7F
Post 1 Color = EFF0F0
Post 2 Color = EFF0F0

Additional Details,

I want skin for my upcomin music website and I tried to choose the colours according to my layout may be above colours will not match according to my layout but I want skin match to my website's layout, may these 2 links will help you to make my skin.

1) My Home Page
2) My Music Page

Thanks in advance.

Best Regards
Hassan
Offline Profile Quote Post Goto Top
 
Kazuki-ZNR
...
Ok I am on this one. :D
Offline Profile Quote Post Goto Top
 
Kazuki-ZNR
...
Skin In Creation

Your skin is currently being worked on. Please do not PM/IM about the status of this work. Your skin will be ready within 48 hours (max).

When it is completed, it will be located in the Completed Forum.

Thanks for choosing the IF Skin Zone!
SZ Skin Team

This is an automated message
Offline Profile Quote Post Goto Top
 
Kazuki-ZNR
...
Ok I am done, sorry if you don't like it and feel free to ask for bits to be changed.

Preview Using this.

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

#ipbwrapper { text-align:left; width:95%; margin-left:auto;margin-right:auto }
#ipbwrapper img { vertical-align:middle; border: 0px }

form { display:inline; }
img { vertical-align:middle; border:0px }
BODY { font-family: Verdana, Tahoma; Arial; sans-serif; font-size: 11px; color: #000; margin: px px px px; background-color:#EFF0F0; background-image: url(http://) }
TABLE, TR, TD { font-family: Verdana, Tahoma; Arial; sans-serif; font-size: 11px; color: #000; }
a:link, a:visited, a:active { text-decoration: underline; color: #000 }
a:hover { color: #980E0E; text-decoration:none }

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:#000;background-color:#EF9800; background-image: url(http://);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 #980E0E;background-color: #EFF0F0; background-image: url(http://) }
#ucpmenu p { padding:2px 5px 6px 9px;margin:0px; }
#ucpcontent { background-color: #EFF0F0; background-image: url(http://); border:1px solid #980E0E;line-height:150%; width:auto }
#ucpcontent p { padding:10px;margin:0px; }

#ipsbanner { position:absolute;top:1px;right:5%; }
#logostrip { border:1px solid #980E0E;background-color: #980E0E;background-image:url(http://);padding:0px;margin:0px; }
/* Skin Created using the AIO CSS Generator at http://ifskinzone.net/main.php */
#submenu { border:1px solid #980E0E;background-color: #980E0E; background-image: url(http://); font-size:10px;margin:3px 0px 3px 0px;color:#000;font-weight:bold;}
#submenu a:link, #submenu a:visited, #submenu a:active { font-weight:bold;font-size:10px;text-decoration: none; color: #EF9800; }
#userlinks { border:1px solid #980E0E; background-color: #980E0E; background-image: url(http://) }

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

.activeuserstrip { background-color:#FFBF7F; background-image: url(http://); padding:6px }

.pformstrip { background-color: #980E0E; background-image: url(http://); color:#fff;font-weight:bold;padding:4px;margin-top:1px }
.pformleft { background-color: #EFF0F0; background-image: url(http://); padding:6px; margin-top:1px;width:25%; border-top:1px solid #980E0E; border-right:1px solid #980E0E; }
.pformleftw { background-color: #EFF0F0; background-image: url(http://); padding:6px; margin-top:1px;width:40%; border-top:1px solid #980E0E; border-right:1px solid #980E0E; }
.pformright { background-color: #EFF0F0; background-image: url(http://); padding:6px; margin-top:1px;border-top:1px solid #980E0E; }

.post1 { background-color: #EFF0F0; background-image: url(http://) }
.post2 { background-color: #EFF0F0; background-image: url(http://) }
.postlinksbar { background-color:#FFBF7F;padding:4px;margin-top:1px;font-size:10px; background-image: url(http://) }

.row1 { background-color: #EFF0F0; background-image: url(http://) }
.row2 { background-color: #EFF0F0; background-image: url(http://) }
.row3 { background-color: #EFF0F0; background-image: url(http://) }
.row4 { background-color: #EFF0F0; background-image: url(http://) }

.darkrow1 { background-color: #FFBF7F; background-image: url(http://); color:#000; }
.darkrow2 { background-color: #FFBF7F; background-image: url(http://); color:#000; }
.darkrow3 { background-color: #FFBF7F; background-image: url(http://); color:#000; }

.hlight { background-color: #EFF0F0; background-image: url(http://) }
.dlight { background-color: #EFF0F0; background-image: url(http://) }

.titlemedium { font-weight:bold; color:#000; padding:4px; margin:0px; background-color: #FFBF7F; background-image: url(http://) }
.titlemedium a:link, .titlemedium a:visited, .titlemedium a:active { text-decoration: underline; color: #000 }

.maintitle { vertical-align:middle;font-weight:bold; color:#fff; letter-spacing:1px; padding:4px 0px 8px 5px; background-color: #980E0E; background-image: url(http://) }
.maintitle a:link, .maintitle a:visited, .maintitle a:active { text-decoration: none; color: #fff }
.maintitle a:hover { text-decoration: none }

.plainborder { border:1px solid transparent;background-color:transparent }
.tableborder { border:1px solid #980E0E;background-color:#980E0E; padding:0px; margin:0px; width:100% }
.tablefill { border:1px solid #980E0E;background-color:#EFF0F0; background-image: url(http://);padding:6px; }
.tablepad { background-color:#EFF0F0; background-image: url(http://);padding:6px }
.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:#000 }
.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: #000; background-color: #FFBF7F; background-image: url(http://); border: 1px solid #980E0E; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }
#CODE { font-family: Courier, Courier New, Verdana, Arial; font-size: 11px; color: #000; background-color: #FFBF7F; background-image: url(http://); border: 1px solid #980E0E; 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 #980E0E;border-bottom:1px solid #980E0E }

.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
 
Kazuki-ZNR
...
Skinned & Ready To Roll

Your skin has been completed to your specifications.

We hope you enjoy your new skin. If you have any problems with your skin please go to the Skinning Support Board and open a new topic.

Thanks for choosing the IF Skin Zone!
SZ Skin Team

This is an automated message
Offline Profile Quote Post Goto Top
 
Hassan
Member
[ * ]
Hello,

I would like to thanks IFskinzone and azuki,

the skin is mostly okay but there is some thing need to be changed :-

1) In member bar colour of text and links is 000000 and background and hover colour is 980E0E. It will look better if you can set text and links colour ffffff and hover EF9700

2) In main title background is 980E0E and text is ffffff ist okay but its hover is same as background colour its hover should EF9700

3) In Board Statistics area the background colour of Board Statistics and 1 user(s) active in the past 15 minutes is same if you can change the background colour of text Board Statistics it will look more good.

4) In the bottom of post page there is text {« Next Oldest | Test 1 | Next Newest »}
if you can change its colour 000000 to ffffff and its background colour from FFB870 to 980E0E

I hope you will do it as soon as possible and I would like to thank you again.

Best Regards
Hassan
Offline Profile Quote Post Goto Top
 
Hassan
Member
[ * ]
Hello,

I have installed forum on my website and upload your Stylesheet but size and face of fonts are not looking fine, please take a look at : http://www.musicfunda.com/forum

Best Regards
Hassan
Offline Profile Quote Post Goto Top
 
Kazuki-ZNR
...
Ok I'll sort this out as soon as I can, I have exams tommorow so I have a lot of work to do. sorry. :[
Offline Profile Quote Post Goto Top
 
Hassan
Member
[ * ]
Okay No Problem :) but try to sort it out as soon as possible.

Best Regards
Hassan
Offline Profile Quote Post Goto Top
 
Kazuki-ZNR
...
I have done what you have asked.

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

#ipbwrapper { text-align:left; width:95%; margin-left:auto;margin-right:auto }
#ipbwrapper img { vertical-align:middle; border: 0px }

form { display:inline; }
img { vertical-align:middle; border:0px }
BODY { font-family: Verdana, Tahoma; Arial; sans-serif; font-size: 11px; color: #000; margin: px px px px; background-color:#EFF0F0; background-image: url(http://) }
TABLE, TR, TD { font-family: Verdana, Tahoma; Arial; sans-serif; font-size: 11px; color: #000; }
a:link, a:visited, a:active { text-decoration: none; color: #000 }
a:hover { color: #980E0E; text-decoration:none;  }

</style><center>This skin was created by request by <b>Kazuki</b> of the <b><a href="http://ifskinzone.net" target="_blank">IF Skin Zone</a></b></center><style type="text/css">
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:#000;background-color:#EF9800; background-image: url(http://);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 #980E0E;background-color: #EFF0F0; background-image: url(http://) }
#ucpmenu p { padding:2px 5px 6px 9px;margin:0px; }
#ucpcontent { background-color: #EFF0F0; background-image: url(http://); border:1px solid #980E0E;line-height:150%; width:auto }
#ucpcontent p { padding:10px;margin:0px; }

#ipsbanner { position:absolute;top:1px;right:5%; }
#logostrip { border:1px solid #980E0E;background-color: #980E0E;background-image:url(http://);padding:0px;margin:0px; }
/* Skin Created using the AIO CSS Generator at http://ifskinzone.net/main.php */
#submenu { border:1px solid #980E0E;background-color: #980E0E; background-image: url(http://); font-size:10px;margin:3px 0px 3px 0px;color:#000;font-weight:bold;}
#submenu a:link, #submenu a:visited, #submenu a:active { font-weight:bold;font-size:10px;text-decoration: none; color: #EF9800; }
#userlinks { border:1px solid #980E0E; background-color: #FFBF7F; text-color: #fff; background-image: url(http://) }

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

.activeuserstrip { background-color:#980E0E
; background-image: url(http://); color: #fff; padding:6px }
.activeuserstrip a:link, .activeuserstrip a:visited, .activeuserstrip a:active { text-decoration:; color: #fff }

.pformstrip { background-color: #FFBF7F; background-image: url(http://); color:#000;font-weight:bold;padding:4px;margin-top:1px }
.pformleft { background-color: #EFF0F0; background-image: url(http://); padding:6px; margin-top:1px;width:25%; border-top:1px solid #980E0E; border-right:1px solid #980E0E; }
.pformleftw { background-color: #EFF0F0; background-image: url(http://); padding:6px; margin-top:1px;width:40%; border-top:1px solid #980E0E; border-right:1px solid #980E0E; }
.pformright { background-color: #EFF0F0; background-image: url(http://); padding:6px; margin-top:1px;border-top:1px solid #980E0E; }

.post1 { background-color: #EFF0F0; background-image: url(http://) }
.post2 { background-color: #EFF0F0; background-image: url(http://) }
.postlinksbar { background-color:#FFBF7F;padding:4px;margin-top:1px;font-size:10px; background-image: url(http://) }

.row1 { background-color: #EFF0F0; background-image: url(http://) }
.row2 { background-color: #EFF0F0; background-image: url(http://) }
.row3 { background-color: #EFF0F0; background-image: url(http://) }
.row4 { background-color: #EFF0F0; background-image: url(http://) }

.darkrow1 { background-color: #FFBF7F; background-image: url(http://); color:#000; }
.darkrow2 { background-color: #FFBF7F; background-image: url(http://); color:#000; }
.darkrow3 { background-color: #FFBF7F; background-image: url(http://); color:#000; }

.hlight { background-color: #EFF0F0; background-image: url(http://) }
.dlight { background-color: #EFF0F0; background-image: url(http://) }

.titlemedium { font-weight:bold; color:#000; padding:4px; margin:0px; background-color: #FFBF7F; background-image: url(http://) }
.titlemedium a:link, .titlemedium a:visited, .titlemedium a:active { text-decoration: underline; color: #000 }

.maintitle { vertical-align:middle;font-weight:bold; color:#fff; letter-spacing:1px; padding:4px 0px 8px 5px; background-color: #980E0E; background-image: url(http://) }
.maintitle a:link, .maintitle a:visited, .maintitle a:active { text-decoration:; color: #fff }
.maintitle a:hover { text-decoration: none; color: #EF9700 }

.plainborder { border:1px solid transparent;background-color:transparent }
.tableborder { border:1px solid #980E0E;background-color:#980E0E; padding:0px; margin:0px; width:100% }
.tablefill { border:1px solid #980E0E;background-color:#EFF0F0; background-image: url(http://);padding:6px; }
.tablepad { background-color:#EFF0F0; background-image: url(http://);padding:6px }
.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:#000 }
.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: #000; background-color: #FFBF7F; background-image: url(http://); border: 1px solid #980E0E; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px }
#CODE { font-family: Courier, Courier New, Verdana, Arial; font-size: 11px; color: #000; background-color: #FFBF7F; background-image: url(http://); border: 1px solid #980E0E; 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 #980E0E;border-bottom:1px solid #980E0E }

.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
 
Hassan
Member
[ * ]
Please look at http://www.musicfunda.com/forum/
why the its looking not fine, most of font size are big.

Best Regards
Hassan
Offline Profile Quote Post Goto Top
 
Kazuki-ZNR
...
It looks normal to me, can I see a screenshot of what you see? v_v
Offline Profile Quote Post Goto Top
 
RagingFuryBlack
Member Avatar
Member
[ *  *  *  *  *  *  * ]
nothing looks wrong with it Kazuki
Offline Profile Quote Post Goto Top
 
Hassan
Member
[ * ]
Okay! below are the links of screen shoots!

(on my site where its not looking fine) http://www.musicfunda.com/screen1.gif
(on CSS preview where its looking fine.) http://www.musicfunda.com/screen2.gif

Best Regards
Hassan
Offline Profile Quote Post Goto Top
 
RagingFuryBlack
Member Avatar
Member
[ *  *  *  *  *  *  * ]
Wow thats really odd.
Offline Profile Quote Post Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
Go to Next Page
« Previous Topic · Closed Requests · Next Topic »
Add Reply
  • Pages:
  • 1