I suppose everyone has to start somewhere so here is my first "finished" skin made using RunBoard hosted images... Now in version 3.0 since making some major changes in both the CSS and HTML I call it... Purple Squares v3.0
Purple Squares
The CSS
@media all and min-width0 {
/* start opera hack */
head~body .ak_msgform_newtopic_submit_button,head~body .ak_msgform_postreply_submit_button,head~body .ak_msgform_editpost_submit_button
{
margin-left:70px;
}
}
/* THE BACKGROUND COLOR SHOWN WHILST IMAGE IS LOADING */
body
{
background-color:#ccf;
margin:6px 0;
}
/* IMAGES NEVER HAVE BORDERS! */
img
{
border:0;
}
/* BANNER CLASS */
.banner
{
width:780px;
height:44px;
background:#959ab0 url(http://img.runboard.com/img/layouts/smackdown5_1/samplebanner.jpg) repeat-x;
font-size:2px;
color:#e2e7e0;
margin:6px auto 0;
}
/* BOARD NAME PARAMETERS */
h1
{
font:bold 22px georgia,'times new roman',serif;
text-align:center;
color:#fff;
padding-left:25px;
line-height:44px;
vertical-align:middle;
margin:0;
}
/* DECO TABLE BACKGROUND DEFINITIONS */
.td1,.td2
{
border:1px solid;
height:20px;
font-size:1px;
border-color:#96F;
padding:0;
}
.td1
{
background:#99f;
}
.td2
{
background:#36c url(http://img.runboard.com/img/layouts/impaqt_1/separator.gif) top repeat-x;
}
/* DECO TABLE BORDER DEFINITIONS */
.deco
{
border:2px solid;
border-color:#99F #303 #303 #99F;
margin:0 auto;
}
/* SETS THE OUTER TABLES WIDTH TO KEEP NON-TABLE CONTENT WITHIN A MAX WIDTH*/
.ak_msg_master_table
{
background-color:#99F;
width:774px;
font-family:verdana;
font-size:10px;
border-color:#63F;
border-width:4px;
}
/* SETS THE WIDTH AND BORDERS OF THE FORUM/TOPIC/POST/MEMBER LIST TABLES */
.forum_list_table,.topic_list_table
{
width:754px;
border-color:#66c;
border-style:solid;
border-width:1px;
}
.ak_msg_post_master_table,.ak_msg_seememberlist_table,.forumlistboardstatstable,.forumlistwhosonlinetable
{
width:754px;
background-color:#99F;
border-color:#66c;
border-style:solid;
border-width:1px;
}
.ak_tl_topicrow_mouseover_on,.ak_tl_topicrow_mouseover_off
{
padding:5px;
}
/* SETS THE HEADER CELLS OF MOST TABLES */
.ak_msgform_poll_options_head_td,.ak_msg_seememberlist_head_user_td,.ak_msg_seememberlist_head_date_td,.ak_msg_seememberlist_head_im_td,.ak_msg_seememberlist_head_pm_td,.ak_msg_seememberlist_head_email_td,.ak_poll_table_header,.forum_list_header_newtext_td,.forum_list_header_forum_td,.forum_list_header_topics_td,.forum_list_header_posts_td,.forum_list_header_lastpost_td,.forumlistboardstatsheader,.forumlist_separator_td,.topic_list_header_modbox_td,.topic_list_header_newtext_td,.topic_list_header_posticon_td,.topic_list_header_topic_td,.topic_list_header_startedby_td,.topic_list_header_replies_td,.topic_list_header_views_td,.topic_list_header_lastpost_td,.msgform_clickable_smiley_box_h,.ak_subject_posticon_head_td
{
font-family:verdana;
font-size:10px;
height:22px;
padding-top:0;
padding-bottom:0;
color:#000;
background-color:#99F;
}
/* CHANGES AND ADJUSTS THE WHO IS ONLINE TABLE */
.forumlistwhosonlinetable
{
background-color:#707dbc;
}
.forumlistwhosonlinetd
{
padding:6px;
}
/* SETTINGS FONT TYPE, COLOR AND SIZE TO REMAINING ELEMENTS */
span.locationboard,span.locationforum,span.locationtopic
{
font-size:10px;
font-family:verdana;
}
span.forumlistnumtopics,span.forumlistnumposts
{
font-size:10px;
font-family:verdana;
font-weight:400;
}
/* BOARD STATS TABLE */
.forumlistboardstatsheader
{
font-family:verdana;
font-size:10px;
color:#000;
background-color:#707dbc;
border-color:#66c;
border-style:solid;
border-width:0 0 1px;
}
span.topiclistlastpost
{
font-family:verdana;
font-size:10px;
}
span.forumlistdescription
{
color:#404040;
}
span.topiclisttopicclosed,span.topiclisttopicsticky,span.topiclisttopichidden
{
font-size:10px;
font-weight:400;
font-family:verdana;
}
/* WRITE MESSAGE */
.ak_msgform_master_table
{
background-color:#CCF;
border:1px solid #09F;
font-family:verdana;
font-size:10px;
}
.ak_msgform_newtopic_submit_button,.ak_msgform_newtopic_preview_button,.ak_msgform_postreply_submit_button,.ak_msgform_postreply_preview_button,.ak_msgform_editpost_submit_button,.ak_msgform_editpost_preview_button
{
font-family:verdana;
font-size:10px;
border:1px solid #66c;
background-color:#99F;
}
.ak_msgform_subject_right_td input,.ak_msgform_message_right_td textarea,textarea
{
background-color:#99F;
color:#000;
width:340px;
font-family:verdana;
font-size:10px;
border-color:#66c;
border-style:solid;
border-width:1px;
}
.ak_msgform_poll_options_table
{
border-color:#66c;
border-style:solid;
border-width:1px;
}
.ak_msgform_poll_options_right_td input
{
background-color:#99F;
padding-top:2px;
padding-bottom:2px;
font-family:verdana;
font-size:10px;
color:#000;
border-color:#66c;
border-style:solid;
border-width:1px;
margin:2px;
}
.qcode_bar_but
{
font-size:10px;
background-color:#99F;
margin-top:1px;
border-color:#66c;
border-style:solid;
border-width:1px;
}
/* HORIZONTAL RULE FOR CROSS COMPATIBILITY REASONS WE USE THE BORDER TO GIVE THE LINE EFFECT */
hr
{
height:0;
width:100%;
border:none;
border-bottom:1px solid #66c;
}
/* DEFAULT 'FORUM READY' MSGS ARE MADE SCROLL INSTEAD OF DISTORTING TABLES */
.postlistpostbody pre
{
font-size:10px;
font-family:verdana;
font-weight:400;
overflow:scroll;
width:500px;
border:1px solid #66c;
}
/* end opera hack */
.ak_msg_post_master_table
{
font-family:verdana;
font-size:10px;
position:relative;
}
span.postlistusertitle font
{
color:#66c;
font-family:verdana;
font-size:10px;
}
blockquote
{
background-color:#99F;
font-family:verdana;
font-size:10px;
color:#000;
border-color:#66c;
border-style:solid;
border-width:1px;
}
/* POLL TABLE AND ITS PARTS */
.ak_poll_table
{
font-size:10px;
font-family:verdana;
text-align:center;
background-color:#ccf;
margin-bottom:15px;
border-color:#66c;
border-style:solid;
border-width:1px;
}
.ak_poll_table_header
{
height:22px;
font-size:10px;
padding:0 25px;
}
.ak_poll_table_button_cell input
{
background-color:#99F;
height:22px;
font-family:verdana;
font-size:10px;
border-color:#66c;
border-style:solid;
border-width:1px;
}
.ak_poll_table_header a
{
padding-left:10px;
}
.ak_poll_table_option_rcell1 input,.ak_poll_table_option_rcell2 input
{
border:none;
}
.ak_poll_table_viewres_cell
{
font-weight:700;
font-size:10px;
}
/* MEMBERSHIP LIST */
.ak_msg_seememberlist_table td
{
text-align:center;
border-width:0;
}
.ak_msg_seememberlist_table
{
font-size:10px;
}
.ak_msg_seememberlist_head_user_td,.ak_msg_seememberlist_head_date_td,.ak_msg_seememberlist_head_im_td,.ak_msg_seememberlist_head_pm_td,.ak_msg_seememberlist_head_email_td
{
color:#000;
font-family:verdana;
font-size:10px;
text-align:center;
padding:1px;
}
.ak_msg_seememberlist_showing
{
font-size:10px;
font-family:verdana;
color:#000;
}
/* SPREAD OUT THE POST-ICON BOX */
.ak_subject_posticon_table
{
text-align:center;
font-family:verdana,tahoma,arial;
font-size:10px;
border:1px solid #66c;
background-color:#ccf;
width:98%;
margin:0 auto;
padding:0;
}
.ak_subject_posticon_head_td
{
text-align:center;
font-family:verdana;
font-size:10px;
color:#000;
background-color:#99F;
}
.msgform_clickable_smiley_box_h,.msgform_clickable_smiley_box_b,.msgform_clickable_smiley_box_b td,.msgform_clickable_smiley_box_b_td,.msgform_clickable_smiley_box_b_td td
{
border:0 solid #66c;
background:none;
}
/* POSTING OPTIONS POSTING POSITIONS*/
.ak_msgform_subject_right_td input,textarea,textarea
{
background-color:#99f;
}
.ak_msgform_newtopic_submit_button,.ak_msgform_postreply_submit_button,.ak_msgform_editpost_submit_button
{
position:absolute;
margin-left:10px;
margin-top:-0.8em;
}
* html .ak_msgform_newtopic_submit_button,* html .ak_msgform_postreply_submit_button,* html .ak_msgform_editpost_submit_button
{
margin-top:-17px;
margin-left:10px;
}
.ak_msgform_newtopic_preview_button,.ak_msgform_postreply_preview_button,.ak_msgform_editpost_preview_button
{
margin-left:40%;
}
.forumlistforumname,.topiclisttopicname,span.topiclistnewswitch,span.forumlistnewswitch,.topiclistpostnewtopic a,.postlistaddareply a
{
color:#000;
font-size:10px;
font-family:verdana;
}
span.forumlistheader,span.topiclistheader,span.forumlistseparator,span.topiclisttopicname,span.topiclistreplies,span.topiclistviews,span.topicliststartedby,span.postlistusername,span.postlistpostname,span.postlistpostbody
{
color:#000;
font-family:verdana;
font-size:10px;
}
.ak_msgform_master_table td,.ak_msgform_poll_options_table td,.ak_msg_post_master_table td
{
border:1px solid #66c;
}
blockquote hr,.ak_poll_table_header br
{
display:none;
}
.ak_poll_table td,.ak_subject_posticon_table td
{
border-width:0;
}
.ak_poll_table_option_gback1,.ak_poll_table_option_gback2,.ak_tl_topicrow_mouseover_on,.ak_fl_forumrow_mouseover_on
{
background-color:#99F;
}
Last edited by Pastor Rick, 6/26/2011, 4:49 pm
