1/* Button Styles 2---------------------------------------- */ 3 4/* Rollover buttons 5 Based on: http://wellstyled.com/css-nopreload-rollovers.html 6----------------------------------------*/ 7.buttons { 8 float: left; 9 width: auto; 10 height: auto; 11} 12 13/* Rollover state */ 14.buttons div { 15 float: left; 16 margin: 0 5px 0 0; 17 background-position: 0 100%; 18} 19 20/* Rolloff state */ 21.buttons div a { 22 display: block; 23 width: 100%; 24 height: 100%; 25 background-position: 0 0; 26 position: relative; 27 overflow: hidden; 28} 29 30/* Hide <a> text and hide off-state image when rolling over (prevents flicker in IE) */ 31/*.buttons div span { display: none; }*/ 32/*.buttons div a:hover { background-image: none; }*/ 33.buttons div span { position: absolute; width: 100%; height: 100%; cursor: pointer;} 34.buttons div a:hover span { background-position: 0 100%; } 35 36/* Big button images */ 37.reply-icon span { background: transparent none 0 0 no-repeat; } 38.post-icon span { background: transparent none 0 0 no-repeat; } 39.locked-icon span { background: transparent none 0 0 no-repeat; } 40.pmreply-icon span { background: none 0 0 no-repeat; } 41.newpm-icon span { background: none 0 0 no-repeat; } 42.forwardpm-icon span { background: none 0 0 no-repeat; } 43 44/* Set big button dimensions */ 45.buttons div.reply-icon { width: {IMG_BUTTON_TOPIC_REPLY_WIDTH}px; height: {IMG_BUTTON_TOPIC_REPLY_HEIGHT}px; } 46.buttons div.post-icon { width: {IMG_BUTTON_TOPIC_NEW_WIDTH}px; height: {IMG_BUTTON_TOPIC_NEW_HEIGHT}px; } 47.buttons div.locked-icon { width: {IMG_BUTTON_TOPIC_LOCKED_WIDTH}px; height: {IMG_BUTTON_TOPIC_LOCKED_HEIGHT}px; } 48.buttons div.pmreply-icon { width: {IMG_BUTTON_PM_REPLY_WIDTH}px; height: {IMG_BUTTON_PM_REPLY_HEIGHT}px; } 49.buttons div.newpm-icon { width: {IMG_BUTTON_PM_NEW_WIDTH}px; height: {IMG_BUTTON_PM_NEW_HEIGHT}px; } 50.buttons div.forwardpm-icon { width: {IMG_BUTTON_PM_FORWARD_WIDTH}px; height: {IMG_BUTTON_PM_FORWARD_HEIGHT}px; } 51 52/* Sub-header (navigation bar) 53--------------------------------------------- */ 54a.print, a.sendemail, a.fontsize { 55 display: block; 56 overflow: hidden; 57 height: 18px; 58 text-indent: -5000px; 59 text-align: left; 60 background-repeat: no-repeat; 61} 62 63a.print { 64 background-image: none; 65 width: 22px; 66} 67 68a.sendemail { 69 background-image: none; 70 width: 22px; 71} 72 73a.fontsize { 74 background-image: none; 75 background-position: 0 -1px; 76 width: 29px; 77} 78 79a.fontsize:hover { 80 background-position: 0 -20px; 81 text-decoration: none; 82} 83 84/* Icon images 85---------------------------------------- */ 86.sitehome, .icon-faq, .icon-members, .icon-home, .icon-ucp, .icon-register, .icon-logout, 87.icon-bookmark, .icon-bump, .icon-subscribe, .icon-unsubscribe, .icon-pages, .icon-search { 88 background-position: 0 50%; 89 background-repeat: no-repeat; 90 background-image: none; 91 padding: 1px 0 0 17px; 92} 93 94/* Poster profile icons 95----------------------------------------*/ 96ul.profile-icons { 97 padding-top: 10px; 98 list-style: none; 99} 100 101/* Rollover state */ 102ul.profile-icons li { 103 float: left; 104 margin: 0 6px 3px 0; 105 background-position: 0 100%; 106} 107 108/* Rolloff state */ 109ul.profile-icons li a { 110 display: block; 111 width: 100%; 112 height: 100%; 113 background-position: 0 0; 114} 115 116/* Hide <a> text and hide off-state image when rolling over (prevents flicker in IE) */ 117ul.profile-icons li span { display:none; } 118ul.profile-icons li a:hover { background: none; } 119 120/* Positioning of moderator icons */ 121.postbody ul.profile-icons { 122 float: right; 123 width: auto; 124 padding: 0; 125} 126 127.postbody ul.profile-icons li { 128 margin: 0 3px; 129} 130 131/* Profile & navigation icons */ 132.email-icon, .email-icon a { background: none top left no-repeat; } 133.aim-icon, .aim-icon a { background: none top left no-repeat; } 134.yahoo-icon, .yahoo-icon a { background: none top left no-repeat; } 135.web-icon, .web-icon a { background: none top left no-repeat; } 136.msnm-icon, .msnm-icon a { background: none top left no-repeat; } 137.icq-icon, .icq-icon a { background: none top left no-repeat; } 138.jabber-icon, .jabber-icon a { background: none top left no-repeat; } 139.pm-icon, .pm-icon a { background: none top left no-repeat; } 140.quote-icon, .quote-icon a { background: none top left no-repeat; } 141 142/* Moderator icons */ 143.report-icon, .report-icon a { background: none top left no-repeat; } 144.warn-icon, .warn-icon a { background: none top left no-repeat; } 145.edit-icon, .edit-icon a { background: none top left no-repeat; } 146.delete-icon, .delete-icon a { background: none top left no-repeat; } 147.info-icon, .info-icon a { background: none top left no-repeat; } 148 149/* Set profile icon dimensions */ 150ul.profile-icons li.email-icon { width: {IMG_ICON_CONTACT_EMAIL_WIDTH}px; height: {IMG_ICON_CONTACT_EMAIL_HEIGHT}px; } 151ul.profile-icons li.aim-icon { width: {IMG_ICON_CONTACT_AIM_WIDTH}px; height: {IMG_ICON_CONTACT_AIM_HEIGHT}px; } 152ul.profile-icons li.yahoo-icon { width: {IMG_ICON_CONTACT_YAHOO_WIDTH}px; height: {IMG_ICON_CONTACT_YAHOO_HEIGHT}px; } 153ul.profile-icons li.web-icon { width: {IMG_ICON_CONTACT_WWW_WIDTH}px; height: {IMG_ICON_CONTACT_WWW_HEIGHT}px; } 154ul.profile-icons li.msnm-icon { width: {IMG_ICON_CONTACT_MSNM_WIDTH}px; height: {IMG_ICON_CONTACT_MSNM_HEIGHT}px; } 155ul.profile-icons li.icq-icon { width: {IMG_ICON_CONTACT_ICQ_WIDTH}px; height: {IMG_ICON_CONTACT_ICQ_HEIGHT}px; } 156ul.profile-icons li.jabber-icon { width: {IMG_ICON_CONTACT_JABBER_WIDTH}px; height: {IMG_ICON_CONTACT_JABBER_HEIGHT}px; } 157ul.profile-icons li.pm-icon { width: {IMG_ICON_CONTACT_PM_WIDTH}px; height: {IMG_ICON_CONTACT_PM_HEIGHT}px; } 158ul.profile-icons li.quote-icon { width: {IMG_ICON_POST_QUOTE_WIDTH}px; height: {IMG_ICON_POST_QUOTE_HEIGHT}px; } 159ul.profile-icons li.report-icon { width: {IMG_ICON_POST_REPORT_WIDTH}px; height: {IMG_ICON_POST_REPORT_HEIGHT}px; } 160ul.profile-icons li.edit-icon { width: {IMG_ICON_POST_EDIT_WIDTH}px; height: {IMG_ICON_POST_EDIT_HEIGHT}px; } 161ul.profile-icons li.delete-icon { width: {IMG_ICON_POST_DELETE_WIDTH}px; height: {IMG_ICON_POST_DELETE_HEIGHT}px; } 162ul.profile-icons li.info-icon { width: {IMG_ICON_POST_INFO_WIDTH}px; height: {IMG_ICON_POST_INFO_HEIGHT}px; } 163ul.profile-icons li.warn-icon { width: {IMG_ICON_USER_WARN_WIDTH}px; height: {IMG_ICON_USER_WARN_HEIGHT}px; } 164 165/* Fix profile icon default margins */ 166ul.profile-icons li.edit-icon { margin: 0 0 0 3px; } 167ul.profile-icons li.quote-icon { margin: 0 0 0 10px; } 168ul.profile-icons li.info-icon, ul.profile-icons li.report-icon { margin: 0 3px 0 0; } 169 170