slitaz-forge rev 154
mf: Add CSS style slitaz.css
author | Christophe Lincoln <pankso@slitaz.org> |
---|---|
date | Tue Mar 20 11:12:34 2012 +0100 (2012-03-20) |
parents | 6bc411448935 |
children | 0bc15e17d001 |
files | mf/css/slitaz.css |
line diff
1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000 1.2 +++ b/mf/css/slitaz.css Tue Mar 20 11:12:34 2012 +0100 1.3 @@ -0,0 +1,346 @@ 1.4 +/* 1.5 + CSS style for SliTaz Network - (C) 2012 SliTaz GNU/Linux 1.6 +*/ 1.7 + 1.8 +html { 1.9 + min-height: 102%; 1.10 +} 1.11 + 1.12 +body { 1.13 + background: #ffffff; 1.14 + color: black; 1.15 + font: 13px sans-serif, vernada, arial; 1.16 + margin: 0; 1.17 + min-width: 780px; 1.18 + height: 100%; 1.19 +} 1.20 + 1.21 +a { text-decoration: underline; color: #215090; } 1.22 +a:hover { text-decoration: none; color: blue; } 1.23 +img { border: 0pt none; vertical-align: middle; } 1.24 +h2 { color: #444; } 1.25 +h3 { color: #666; font-size: 140%; } 1.26 +h4 { color: #888; font-size: 120%; } 1.27 +pre { 1.28 + background-color: #f8f8f8; 1.29 + border: 1px solid #ddd; 1.30 + padding: 10px; 1.31 +} 1.32 +table { 1.33 + background-color: #f8f8f8; 1.34 + border: 1px solid #ddd; 1.35 + width: 100%; 1.36 + margin: 0px 0px 20px 0px; 1.37 + padding: 10px; 1.38 +} 1.39 + 1.40 +/* Header */ 1.41 + 1.42 +#header { 1.43 + height: 40px; 1.44 + background: #351a0a; 1.45 +} 1.46 + 1.47 +#header h1 { 1.48 + margin: 0; 1.49 + padding: 8px 0 0 42px; 1.50 + width: 250px; 1.51 +} 1.52 + 1.53 +#header h1 a { 1.54 + color: white; 1.55 + text-decoration: none; 1.56 + font-size: 20px; 1.57 + font-style: italic; 1.58 +} 1.59 + 1.60 +#header h1 a:hover, #network a:hover { 1.61 + color: #d66018; 1.62 +} 1.63 + 1.64 +/* Logo */ 1.65 + 1.66 +#logo { 1.67 + background: url(/images/logo.png) no-repeat left; 1.68 + position: absolute; 1.69 + float: left; 1.70 + left: 0px; 1.71 + top: 0px; 1.72 + width: 40px; 1.73 + height: 40px; 1.74 +} 1.75 + 1.76 +/* SliTaz Network */ 1.77 + 1.78 +#network { 1.79 + float: right; 1.80 + padding: 10px 5px 0; 1.81 + font-size: 12px; 1.82 +} 1.83 + 1.84 +#network a { padding: 0 6px; } 1.85 + 1.86 +/* Block */ 1.87 + 1.88 +#block { 1.89 + min-height: 200px; 1.90 + background: #d66018; 1.91 + padding: 26px 10% 0px; 1.92 + text-align: center; 1.93 + color: #333; 1.94 + border-bottom: 1px solid #f5f5f5; 1.95 +} 1.96 + 1.97 +#block_info { 1.98 + text-align: justify; 1.99 + width: 48%; 1.100 + padding: 10px 10px 0 0; 1.101 +} 1.102 + 1.103 +#block a, #network a { 1.104 + color: #fff; 1.105 + font-weight: bold; 1.106 + text-decoration: none; 1.107 +} 1.108 + 1.109 +#block h4 { 1.110 + color: #351a0a; 1.111 + margin: 0px; 1.112 + font-weight: bold; 1.113 + font-size: 110%; 1.114 +} 1.115 + 1.116 +#block_info p { margin: 6px 0; padding: 0 12px 0 0; } 1.117 +#block_info a { font-weight: normal; } 1.118 +#block ul { list-style-type: square; } 1.119 +#block a:hover { color: #351a0a; } 1.120 + 1.121 +/* Navigation */ 1.122 + 1.123 +#block_nav { 1.124 + background: #cc5b17; 1.125 + padding: 10px 10px 40px; 1.126 + text-align: justify; 1.127 + width: 48%; 1.128 + float: right; 1.129 +} 1.130 + 1.131 +#block_nav ul { 1.132 + list-style-type: none; 1.133 + margin: 6px 0; 1.134 + padding: 0; 1.135 +} 1.136 + 1.137 +#block_nav h4 img { 1.138 + margin: 0 4px 0 0; 1.139 + padding: 0; 1.140 +} 1.141 + 1.142 +/* Languages */ 1.143 + 1.144 +#lang { 1.145 + position: absolute; 1.146 + right: 0; 1.147 + padding: 6px; 1.148 + font-size: 11px; 1.149 +} 1.150 + 1.151 +#lang a { 1.152 + text-decoration: none; 1.153 + padding: 0 2px; 1.154 +} 1.155 + 1.156 +#lang a:hover { 1.157 + text-decoration: underline; 1.158 +} 1.159 + 1.160 +/* Content */ 1.161 + 1.162 +#content { 1.163 + padding: 30px 80px; 1.164 + text-align: justify; 1.165 +} 1.166 + 1.167 +.news li { 1.168 + list-style-type: square; 1.169 + border-bottom: 1px dotted #BEBEBE; 1.170 + margin-left: -25px; 1.171 + padding: 4px 0px 4px 0px; 1.172 +} 1.173 + 1.174 +.news a, .feed-grid a { text-decoration: none; } 1.175 +.news p a { text-decoration: underline; } 1.176 +.news p a:hover { text-decoration: none; } 1.177 +#twitter { margin: 20px 0; } 1.178 +#gallery { text-align: center; } 1.179 + 1.180 +#sponsor { 1.181 + font-size: 90%; 1.182 + background-color: #fbfbfb; 1.183 + border: 2px solid #ddd; 1.184 + width: 200px; 1.185 + height: 160px; 1.186 + float: right; 1.187 + text-align: center; 1.188 + margin: 10px 0px 20px 20px; 1.189 +} 1.190 + 1.191 +/* Classes */ 1.192 + 1.193 +.right_box { width: 48%; float: right; } 1.194 +.left_box { width: 48%; float: left; } 1.195 + 1.196 +.box { 1.197 + margin: 20px 60px; 1.198 + padding: 12px; 1.199 + background: #efefef; 1.200 + border: 1px solid #ddd; 1.201 +} 1.202 + 1.203 +.searchbox { 1.204 + margin: 20px 80px; 1.205 + padding: 12px; 1.206 + background: #f8f8f8; 1.207 + text-align: center; 1.208 + border: 1px solid #ddd; 1.209 +} 1.210 + 1.211 +/* Activity Box */ 1.212 + 1.213 +.activity { 1.214 + margin: 0 0 20px; 1.215 + background: #efefef; 1.216 + padding: 5px 2px 0; 1.217 + border: 1px solid #ddd; 1.218 +} 1.219 +.activity div { padding: 5px 10px; background: #fff; margin-top: 5px; } 1.220 +.activity p { margin: 0; padding: 5px 10px; font-weight: bold; } 1.221 +.activity a { text-decoration: none; } 1.222 +.activity ul { list-style-type: none; 1.223 + margin: 4px 0; padding: 0 4px; line-height: 150%; } 1.224 +.activity_more { text-align: right; } 1.225 +.activity_more a { font-weight: normal; color: #000; padding: 0 4px; } 1.226 +.activity_more a:hover { text-decoration: underline; } 1.227 + 1.228 +.activity span, .news span { 1.229 + color: #666; 1.230 + font-size: 11px; 1.231 + font-weight: normal; 1.232 +} 1.233 + 1.234 +/* Button */ 1.235 + 1.236 +.button a { 1.237 + background-color: #b64b22; 1.238 + color: #ffffff; 1.239 + margin-right: 6px; 1.240 + padding: 6px 10px; 1.241 + font-size: 12px; 1.242 + text-decoration: none; 1.243 + font-weight: bold; 1.244 +} 1.245 +.button a:hover, input[type=submit]:hover { 1.246 + background-color: #a3431f; 1.247 + color: #ffffff; 1.248 +} 1.249 + 1.250 +/* Round corner */ 1.251 + 1.252 +#block_nav, pre, .box, .searchbox, .button a, #twitter, .activity, 1.253 +.activity div, #sponsor, table, input, textarea, select { 1.254 + -moz-border-radius: 4px; 1.255 + -webkit-border-radius: 4px; 1.256 + border-radius: 4px; 1.257 +} 1.258 + 1.259 +/* Form */ 1.260 + 1.261 +form { display: inline; } 1.262 +input[type="submit"], input[type="text"], textarea, select { 1.263 + color: #444444; 1.264 + border: 1px solid #cccccc; 1.265 + padding: 4px; 1.266 + margin: 4px 0px; 1.267 + font-size: 14px; 1.268 + line-height: 1.2em; 1.269 + background-image: -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5); 1.270 + background-image: -moz-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5); 1.271 + -webkit-appearance: none; 1.272 + -webkit-padding-end: 6px; 1.273 + -webkit-padding-start: 6px; 1.274 +} 1.275 + 1.276 +input[type="text"], textarea { background: #fefefe; border: 2px solid #ccc; 1.277 + width: 460px; } 1.278 +/*input[type="file"] { border: 2px solid #ddd; }*/ 1.279 +/*input[type="checkbox"] { background: #fefefe; }*/ 1.280 + 1.281 +/* Be compatible with old FF and Webkit version. */ 1.282 +input[type="submit"] { 1.283 + -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); 1.284 + -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); 1.285 + box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); 1.286 +} 1.287 + 1.288 +input[type="submit"]:hover { 1.289 + cursor: pointer; 1.290 + color: black; 1.291 +} 1.292 + 1.293 +select { 1.294 + background-image: url(images/down.png), 1.295 + -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5); 1.296 + background-position: center right; 1.297 + background-repeat: no-repeat; 1.298 +} 1.299 + 1.300 +.searchbox input[type=submit] { 1.301 + border: 1px solid #b64b22; 1.302 + background-color: #b64b22; 1.303 + color: white; 1.304 + font-weight: bold; 1.305 + cursor: pointer; 1.306 + padding: 4px 10px; 1.307 + font-size: 14px; 1.308 + margin-left: -5px; 1.309 + -webkit-border-top-right-radius: 4px; 1.310 + -webkit-border-bottom-right-radius: 4px; 1.311 + -moz-border-radius-topright: 4px; 1.312 + -moz-border-radius-bottomright: 4px; 1.313 + border-top-right-radius: 4px; 1.314 + border-bottom-right-radius: 4px; 1.315 +} 1.316 + 1.317 +.searchbox input[type=submit]:hover { background-color: #a3431f; } 1.318 + 1.319 +.searchbox input[type=text] { 1.320 + border: 1px solid #333333; 1.321 + padding: 4px; 1.322 + height: 17px; 1.323 + width: 100%; 1.324 + -webkit-border-top-left-radius: 4px; 1.325 + -webkit-border-bottom-left-radius: 4px; 1.326 + -moz-border-radius-topleft: 4px; 1.327 + -moz-border-radius-bottomleft: 4px; 1.328 + border-top-left-radius: 4px; 1.329 + border-bottom-left-radius: 4px; 1.330 +} 1.331 + 1.332 +/* Footer */ 1.333 + 1.334 +#footer { 1.335 + background: #f1f1f1; 1.336 + text-align: center; 1.337 + border-top: 1px solid #ddd; 1.338 + padding: 40px; 1.339 + color: #666; 1.340 + clear: both; 1.341 + margin-bottom: -2%; 1.342 +} 1.343 + 1.344 +#footer a { color: #666; padding: 0 2px; } 1.345 + 1.346 +.year:after { 1.347 + /* content: "2007-2012"; */ 1.348 + content: "2012"; 1.349 +}