|
byeee
|
Aug 6 2007, 07:25 AM
Post #1
|
- Posts:
- 688
- Group:
- Members
- Member
- #61,731
- Joined:
- March 21, 2005
|
Name: Bubbleboo Author: byeee Skin Number: Uh... I'd say 5 or 6. I've made more but they were mostly quick adaptations of one skin to different colours. Date Created: 1-3 August, approximately. Light changes on August 7th. Side Notes: I know the buttons aren't ready, they will be ready once I release the button set. It was also meant to be a dark skin.
Preview of Bubbleboo! Due to demands, I've changed the text colours a bit so everyone's happy. Preview of Bubbleboo Light! Scroll down for the lighter CSS.
Board Wrappers -> Header & Body
- Code:
-
<body> <div id="ipbwrapper"> <% BOARD HEADER %> <% NAVIGATION %> <% BOARD %> <% STATS %> <p style="text-align:center">Skin created by <b>byeee</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>.</p>
Board Wrappers -> Footer
- Code:
-
</div>
CSS - original (dark) colours
- Code:
-
form { display:inline } img { border:0; vertical-align:middle } BODY { margin:5px; background:#05262c url(http://i5.ifrm.com/11617/115/pip/b.gif) top center repeat-y fixed; font-family:Verdana, Helvetica, Arial, sans-serif; font-size:11px; color:#305558 } TABLE, TD, textarea, input, select { font-family:inherit; font-size:100% } a:link, a:visited { text-decoration:none; color:#306566 } a:hover, a:active { text-decoration:underline; color:#346c6b } #ipbwrapper { width:782px; margin:auto }
fieldset.search { padding:6px; line-height:150% } label { cursor:pointer }
img.attach { border:1px outset #093639; padding:2px }
.googleroot { padding:6px; line-height:130% } .googlechild { margin-left:30px; padding:6px; line-height:130% } .googlebottom, .googlebottom a:link, .googlebottom a:visited, .googlebottom a:active { color: #306566 } .googlish, .googlish a:link, .googlish a:visited, .googlish a:active { font-size:130%; font-weight:bold; color:#306566 } .googlepagelinks { font-size:1.1em; letter-spacing:1px } .googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited { font-size:90%; color:#104c4b }
.caldate { margin:0; padding:4px; background:#0e3338; font-size:100%; font-weight:bold; text-align:right; color:#1b5958 }
.warngood { color:green } .warnbad { color:red }
#padandcenter { margin:auto; padding:14px 0px; text-align:center }
#profilename { font-size:250%; font-weight:bold } #calendarname { font-size:200%; font-weight:bold }
#photowrap { padding:6px } #phototitle { border-bottom:1px solid #093639; font-size:220% } #photoimg { margin-top:15px; text-align:center }
#ucpmenu { width:23%; border:1px solid #093639; background:#083034;line-height:150% } #ucpmenu p { margin:0; padding:2px 3px 6px 5px } #ucpcontent { width:auto; border:1px solid #093639; background:#083034; line-height:150% } #ucpcontent p { margin:0; padding:10px }
#ipsbanner { position:absolute; top:1px; right:5% } #logostrip { margin:0; padding:0; border:1px solid #093639 } #submenu { margin:3px 0px; border:1px solid #093639; background:url(http://i5.ifrm.com/11617/115/pip/s.gif); font-size:90%; font-weight:bold } #submenu a:link, #submenu a:visited { font-size:90%; text-decoration:none; color:#305558 } #submenu a:hover, #submenu a:active { font-size:90%; text-decoration:none; color:#327074 } #userlinks { border:1px solid #093639; background:url(http://i5.ifrm.com/11617/115/pip/s.gif) center left }
#navstrip { padding:6px 0px; font-weight:bold } #navstrip img { margin-bottom:2px }
.activeuserstrip { padding:6px; background:#083034 }
.pformstrip { margin-top:1px; padding:7px; background:url(http://i5.ifrm.com/11617/115/pip/t.gif) bottom left; font-size:90%; font-weight:bold; color:#246b6e } .pformstrip div { line-height:20px } .pformleft { width:25%; margin-top:1px; padding:6px; border-top:1px solid #093639; border-right:1px solid #093639; background: #083034 } .pformleftw { width:40%; margin-top:1px; padding:6px; border-top:1px solid #093639; border-right:1px solid #093639; background: #083034 } .pformright { margin-top:1px; padding:6px; border-top:1px solid #093639; background: #083034 }
.post1 { background: #0f3235 } .post2 { background: #0f3135 } .postlinksbar { margin-top:1px; padding:7px; font-size:90%; background:#0c3236 }
.row1 { padding:2px 8px; background:#093135 } input.row1{ background:#083034; color:#305558 } .row2 { background:#083034 } .row3 { background:#0c3135 } .row4 { background:#083034 }
.darkrow1 { background:#0a3638; color:#246b6e } .darkrow2 { background:url(http://i5.ifrm.com/11617/115/pip/i.gif); color:#305558 } .darkrow3 { background:#083034; color:#305558 }
.hlight { background: #0f3235 } .dlight { background: #0f3135 }
.titlemedium { margin:0px; padding:7px; background:url(http://i5.ifrm.com/11617/115/pip/t.gif) bottom left; font-size:90%; font-weight:bold; color:#246b6e }
.maintitle { height:13px; padding:8px 0px 9px 22px; background:url(http://i5.ifrm.com/11617/115/pip/m.gif) 1px 0px; vertical-align:middle; font-weight:bold; letter-spacing:1px; color:#032325 } .maintitle a:link, .maintitle a:visited, .maintitle a:hover, .maintitle a:active { text-decoration:none; color:#032325 }
.plainborder { border:0 } .plainborder table { background:#073f3e } .tableborder { margin:0; padding:0; border:1px solid #093639; background:#042c31 } div.tableborder { width:780px } #ucpcontent .tableborder, table .tableborder { width:auto } div.row4 { border-color:#093639!important } .tablefill { padding:6px; border:1px solid #0b3e41; background:#093338 } .tablepad { padding:6px; background:#093135 } div.tablepad, div.tablepad table { background:#093135!important } div.tablepad table td font { color:#306566!important } div.tablepad table td input { margin:1px 2px 4px; vertical-align:middle } .tablebasic { width:100%; margin:0; padding:0; border:0 }
.wrapmini { float:left; width:25%; margin:10px; line-height:1.5em } .pagelinks { float:left; width:35%; line-height:1.2em }
.desc { font-size:90%; color:#104c4b } .edit { margin-left:10px; font-size:80%; font-style:italic }
.signature { font-size:90%; color:#0e4445 } .postdetails { font-size:90% } .postcolor { font-size:110%; line-height:160% }
.normalname { font-size:110%; font-weight:bold } .unreg { color:#306566 }
.searchlite { background:#042c31; font-weight:bold; color:#305558 }
#QUOTE { padding:2px; border:1px solid #0b3e41; background:#093338; color:#2f5f5e } #CODE { padding:2px; border:1px solid #0b3e41; background:#093338; font-family:Courier, 'Courier New', Verdana, Arial; color:#2f5f5e }
.copyright { font-size:80%; line-height:12px }
.codebuttons { margin:1px 2px; padding:1px 3px; font-size:90% } .forminput, .textinput, .radiobutton, .checkbox { padding:2px } .forminput, .codebuttons, div.tablepad table input { border:1px solid #0b3e41; background:#093338; color:#2f5f5e } .textinput, .pformright textarea { border:1px solid #2e4a4a; background:#11373b; color:#345b5b } .radiobutton,.checkbox, .pformright input { margin:1px 2px 4px; vertical-align:middle } .row3 .forminput { margin-top:0; margin-bottom:0 }
.thin { margin:2px 0px; padding:6px 0px; border-top:1px solid #063d40; border-bottom:1px solid #063d40; line-height:140% }
.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:#F90 }
CSS - lighter colours
- Code:
-
form { display:inline } img { border:0; vertical-align:middle } BODY { margin:5px; background:#05262c url(http://i5.ifrm.com/11617/115/pip/b.gif) top center repeat-y fixed; font-family:Verdana, Helvetica, Arial, sans-serif; font-size:11px; color:#508d8e } TABLE, TD, textarea, input, select { font-family:inherit; font-size:100% } a:link, a:visited { text-decoration:none; color:#599b9a } a:hover, a:active { text-decoration:underline; color:#82b8b7 } #ipbwrapper { width:782px; margin:auto }
fieldset.search { padding:6px; line-height:150% } label { cursor:pointer }
img.attach { border:1px outset #093639; padding:2px }
.googleroot { padding:6px; line-height:130% } .googlechild { margin-left:30px; padding:6px; line-height:130% } .googlebottom, .googlebottom a:link, .googlebottom a:visited, .googlebottom a:active { color: #599b9a } .googlish, .googlish a:link, .googlish a:visited, .googlish a:active { font-size:130%; font-weight:bold; color:#599b9a } .googlepagelinks { font-size:1.1em; letter-spacing:1px } .googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited { font-size:90%; color:#2a8685 }
.caldate { margin:0; padding:4px; background:#0e3338; font-size:100%; font-weight:bold; text-align:right; color:#2c8887 }
.warngood { color:green } .warnbad { color:red }
#padandcenter { margin:auto; padding:14px 0px; text-align:center }
#profilename { font-size:250%; font-weight:bold } #calendarname { font-size:200%; font-weight:bold }
#photowrap { padding:6px } #phototitle { border-bottom:1px solid #093639; font-size:220% } #photoimg { margin-top:15px; text-align:center }
#ucpmenu { width:23%; border:1px solid #093639; background:#083034;line-height:150% } #ucpmenu p { margin:0; padding:2px 3px 6px 5px } #ucpcontent { width:auto; border:1px solid #093639; background:#083034; line-height:150% } #ucpcontent p { margin:0; padding:10px }
#ipsbanner { position:absolute; top:1px; right:5% } #logostrip { margin:0; padding:0; border:1px solid #093639 } #submenu { margin:3px 0px; border:1px solid #093639; background:url(http://i5.ifrm.com/11617/115/pip/s.gif); font-weight:bold } #submenu a:link, #submenu a:visited { font-size:90%; text-decoration:none; color:#508d8e } #submenu a:hover, #submenu a:active { font-size:90%; text-decoration:none; color:#599b9a } #userlinks { border:1px solid #093639; background:url(http://i5.ifrm.com/11617/115/pip/s.gif) center left }
#navstrip { padding:6px 0px; font-weight:bold } #navstrip img { margin-bottom:2px }
.activeuserstrip { padding:6px; background:#083034 }
.pformstrip { margin-top:1px; padding:7px; background:url(http://i5.ifrm.com/11617/115/pip/t.gif) bottom left; font-size:90%; font-weight:bold; color:#319293 } .pformstrip div { line-height:20px } .pformleft { width:25%; margin-top:1px; padding:6px; border-top:1px solid #093639; border-right:1px solid #093639; background: #083034 } .pformleftw { width:40%; margin-top:1px; padding:6px; border-top:1px solid #093639; border-right:1px solid #093639; background: #083034 } .pformright { margin-top:1px; padding:6px; border-top:1px solid #093639; background: #083034 }
.post1 { background: #0f3235 } .post2 { background: #0f3135 } .postlinksbar { margin-top:1px; padding:7px; font-size:90%; background:#0c3236 }
.row1 { padding:2px 8px; background:#093135 } input.row1{ background:#083034; color:#508d8e } .row2 { background:#083034 } .row3 { background:#0c3135 } .row4 { background:#083034 }
.darkrow1 { background:#0a3638; color:#319293 } .darkrow2 { background:url(http://i5.ifrm.com/11617/115/pip/i.gif); color:#508d8e } .darkrow3 { background:#083034; color:#508d8e }
.hlight { background: #0f3235 } .dlight { background: #0f3135 }
.titlemedium { margin:0px; padding:7px; background:url(http://i5.ifrm.com/11617/115/pip/t.gif) bottom left; font-size:90%; font-weight:bold; color:#319293 }
.maintitle { height:13px; padding:8px 0px 9px 22px; background:url(http://i5.ifrm.com/11617/115/pip/m.gif) 1px 0px; vertical-align:middle; font-weight:bold; letter-spacing:1px; color:#032325 } .maintitle a:link, .maintitle a:visited, .maintitle a:hover, .maintitle a:active { text-decoration:none; color:#031a1b }
.plainborder { border:0 } .plainborder table { background:#073f3e } .tableborder { margin:0; padding:0; border:1px solid #093639; background:#042c31 } div.tableborder { width:780px } #ucpcontent .tableborder, table .tableborder { width:auto } div.row4 { border-color:#093639!important } .tablefill { padding:6px; border:1px solid #0b3e41; background:#093338 } .tablepad { padding:6px; background:#093135 } div.tablepad, div.tablepad table { background:#093135!important } div.tablepad table td font { color:#599b9a!important } div.tablepad table td input { margin:1px 2px 4px; vertical-align:middle } .tablebasic { width:100%; margin:0; padding:0; border:0 }
.wrapmini { float:left; width:25%; margin:10px; line-height:1.5em } .pagelinks { float:left; width:35%; line-height:1.2em }
.desc { font-size:90%; color:#2a8685 } .edit { margin-left:10px; font-size:80%; font-style:italic }
.signature { font-size:90%; color:#1b8180 } .postdetails { font-size:90% } .postcolor { font-size:110%; line-height:160% }
.normalname { font-size:110%; font-weight:bold } .unreg { color:#599b9a }
.searchlite { background:#042c31; font-weight:bold; color:#508d8e }
#QUOTE { padding:2px; border:1px solid #0b3e41; background:#093338; color:#589897 } #CODE { padding:2px; border:1px solid #0b3e41; background:#093338; font-family:Courier, 'Courier New', Verdana, Arial; color:#589897 }
.copyright { font-size:80%; line-height:12px }
.codebuttons { margin:1px 2px; padding:1px 3px; font-size:90% } .forminput, .textinput, .radiobutton, .checkbox { padding:2px } .forminput, .codebuttons, div.tablepad table input { border:1px solid #0b3e41; background:#093338; color:#589897 } .textinput, .pformright textarea { border:1px solid #2e4a4a; background:#11373b; color:#539190 } .radiobutton,.checkbox, .pformright input { margin:1px 2px 4px; vertical-align:middle } .row3 .forminput { margin-top:0; margin-bottom:0 }
.thin { margin:2px 0px; padding:6px 0px; border-top:1px solid #063d40; border-bottom:1px solid #063d40; line-height:140% }
.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:#F90 }
Hope you like it!
Edited 7 August with the addition of the Light version.
|
|
byeee
|
Aug 6 2007, 08:13 PM
Post #6
|
|
Megume
|
Aug 7 2007, 07:04 PM
Post #7
|