slitaz-forge diff pangolin/web/slitaz.css @ rev 434
Add pangolin web interface and update pangolin tool
author | Christophe Lincoln <pankso@slitaz.org> |
---|---|
date | Sun Jan 19 19:34:21 2014 +0100 (2014-01-19) |
parents | |
children | c1ac675db867 |
line diff
1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000 1.2 +++ b/pangolin/web/slitaz.css Sun Jan 19 19:34:21 2014 +0100 1.3 @@ -0,0 +1,374 @@ 1.4 +/* 1.5 + CSS style for SliTaz Network - (C) 2014 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 + 1.33 +/* Header */ 1.34 + 1.35 +#header { 1.36 + height: 40px; 1.37 + background: #222; 1.38 +} 1.39 + 1.40 +#header h1 { 1.41 + margin: 0; 1.42 + padding: 8px 0 0 42px; 1.43 + width: 250px; 1.44 +} 1.45 + 1.46 +#header h1 a { 1.47 + color: white; 1.48 + text-decoration: none; 1.49 + font-size: 20px; 1.50 + font-style: italic; 1.51 +} 1.52 + 1.53 +#header h1 a:hover, #network a:hover, #network span { 1.54 + color: #afafaf; 1.55 +} 1.56 + 1.57 +/* Logo */ 1.58 + 1.59 +#logo { 1.60 + background: url(images/logo.png) no-repeat left; 1.61 + position: absolute; 1.62 + float: left; 1.63 + left: 0px; 1.64 + top: 0px; 1.65 + width: 40px; 1.66 + height: 40px; 1.67 +} 1.68 + 1.69 +/* SliTaz Network */ 1.70 + 1.71 +#network { 1.72 + float: right; 1.73 + padding: 14px 5px 0; 1.74 + font-size: 12px; 1.75 +} 1.76 + 1.77 +#network a, #network span { padding: 0 4px; } 1.78 +#network span { font-weight: bold; } 1.79 + 1.80 +/* Block */ 1.81 + 1.82 +#block { 1.83 + min-height: 180px; 1.84 + background: #ccc; 1.85 + padding: 20px 10% 0px; 1.86 + text-align: center; 1.87 + color: #222; 1.88 + border-bottom: 1px solid #afafaf; 1.89 +} 1.90 + 1.91 +#block_info { 1.92 + text-align: justify; 1.93 + width: 48%; 1.94 + padding: 10px 10px 0 0; 1.95 +} 1.96 + 1.97 +#block a, #network a { 1.98 + color: #fff; 1.99 + font-weight: bold; 1.100 + text-decoration: none; 1.101 +} 1.102 + 1.103 +#block h4 { 1.104 + color: #222; 1.105 + margin: 0px; 1.106 + font-weight: bold; 1.107 + font-size: 110%; 1.108 +} 1.109 + 1.110 +#block_info p { margin: 6px 0; padding: 0 12px 0 0; } 1.111 +#block_info a { font-weight: normal; color: #215090; } 1.112 +#block_info a:hover { text-decoration: underline; } 1.113 +#block ul { list-style-type: square; } 1.114 +#block_nav a:hover { color: #afafaf; } 1.115 + 1.116 +/* Navigation */ 1.117 + 1.118 +#block_nav { 1.119 + background: #666; 1.120 + padding: 10px 10px 20px; 1.121 + text-align: justify; 1.122 + width: 48%; 1.123 + float: right; 1.124 +} 1.125 + 1.126 +#block_nav ul { 1.127 + list-style-type: none; 1.128 + margin: 6px 0; 1.129 + padding: 0; 1.130 +} 1.131 + 1.132 +#block_nav h4 img { 1.133 + margin: 0 4px 0 0; 1.134 + padding: 0; 1.135 +} 1.136 + 1.137 +/* Languages */ 1.138 + 1.139 +#lang { 1.140 + padding: 6px; 1.141 + font-size: 11px; 1.142 + position: absolute; 1.143 + right: 0px; 1.144 +} 1.145 + 1.146 +#lang a { 1.147 + text-decoration: none; 1.148 + padding: 0 2px; 1.149 +} 1.150 + 1.151 +#lang a:hover { 1.152 + text-decoration: underline; 1.153 +} 1.154 + 1.155 +.box #lang { text-align: center; position: relative; 1.156 + font-size: 13px; } /* for /i18n page */ 1.157 + 1.158 +/* Content */ 1.159 + 1.160 +#content { 1.161 + padding: 30px 80px; 1.162 + text-align: justify; 1.163 +} 1.164 + 1.165 +.news li { 1.166 + list-style-type: square; 1.167 + border-bottom: 1px dotted #BEBEBE; 1.168 + margin-left: -25px; 1.169 + padding: 4px 0px 4px 0px; 1.170 +} 1.171 + 1.172 +.news a, .feed-grid a { text-decoration: none; } 1.173 +.news p a { text-decoration: underline; } 1.174 +.news p a:hover { text-decoration: none; } 1.175 +#twitter { margin: 20px 0; text-align: center; } 1.176 +#gallery { text-align: center; } 1.177 + 1.178 +#sponsor { 1.179 + font-size: 90%; 1.180 + background-color: #fbfbfb; 1.181 + border: 2px solid #ddd; 1.182 + width: 200px; 1.183 + height: 160px; 1.184 + float: right; 1.185 + text-align: center; 1.186 + margin: 10px 0px 20px 20px; 1.187 +} 1.188 + 1.189 +/* Classes */ 1.190 + 1.191 +.right_box { width: 48%; float: right; } 1.192 +.left_box { width: 48%; float: left; } 1.193 + 1.194 +.box { 1.195 + margin: 20px 60px; 1.196 + padding: 12px; 1.197 + background: #efefef; 1.198 + border: 1px solid #ddd; 1.199 +} 1.200 + 1.201 +.box-dl, .box-up { 1.202 + margin: 20px 60px; 1.203 + padding: 12px 12px 12px 66px; 1.204 + min-height: 48px; 1.205 + border: 1px solid #ddd; 1.206 + vertical-align: middle; 1.207 +} 1.208 +.box-dl { 1.209 + background: url("/images/download.png") no-repeat 12px 12px #efefef; 1.210 +} 1.211 +.box-up { 1.212 + background: url("/images/update.png") no-repeat center left #efefef; 1.213 +} 1.214 +.box-dl p { color: #456; } 1.215 + 1.216 +.searchbox { 1.217 + margin: 20px 80px; 1.218 + padding: 12px; 1.219 + background: #f8f8f8; 1.220 + text-align: center; 1.221 + border: 1px solid #ddd; 1.222 +} 1.223 + 1.224 +/* Activity Box */ 1.225 + 1.226 +.activity { 1.227 + margin: 0 0 20px; 1.228 + background: #efefef; 1.229 + padding: 5px 2px 0; 1.230 + border: 1px solid #ddd; 1.231 +} 1.232 +.activity div { padding: 5px 10px; background: #fff; margin-top: 5px; } 1.233 +.activity p { margin: 0; padding: 5px 10px; font-weight: bold; } 1.234 +.activity a { text-decoration: none; } 1.235 +.activity ul { list-style-type: none; 1.236 + margin: 4px 0; padding: 0 4px; line-height: 150%; } 1.237 +.activity_more { text-align: right; } 1.238 +.activity_more a { font-weight: normal; color: #000; padding: 0 4px; } 1.239 +.activity_more a:hover { text-decoration: underline; } 1.240 + 1.241 +.activity span, .news span { 1.242 + color: #666; 1.243 + font-size: 11px; 1.244 + font-weight: normal; 1.245 +} 1.246 + 1.247 +/* Button */ 1.248 + 1.249 +#block_info .button a { 1.250 + background-color: #666; 1.251 + color: #ffffff; 1.252 + margin: 0px 4px; 1.253 + padding: 6px 10px; 1.254 + font-size: 12px; 1.255 + text-decoration: none; 1.256 + font-weight: bold; 1.257 +} 1.258 +#block_info .button a:hover, input[type=submit]:hover { 1.259 + background-color: #444; 1.260 + color: #ffffff; 1.261 +} 1.262 + 1.263 +/* Round corner */ 1.264 + 1.265 +#block_nav, pre, .box, .box-dl, .box-up, .searchbox, .button a, #twitter, .activity, 1.266 +.activity div, #sponsor { 1.267 + -moz-border-radius: 4px; 1.268 + -webkit-border-radius: 4px; 1.269 + border-radius: 4px; 1.270 +} 1.271 + 1.272 +/* Form */ 1.273 + 1.274 +input[type=submit] { 1.275 + border: 1px solid #666; 1.276 + background-color: #666; 1.277 + color: white; 1.278 + font-weight: bold; 1.279 + cursor: pointer; 1.280 + padding: 4px 10px; 1.281 + font-size: 14px; 1.282 + margin-left: -5px; 1.283 + -webkit-border-top-right-radius: 4px; 1.284 + -webkit-border-bottom-right-radius: 4px; 1.285 + -moz-border-radius-topright: 4px; 1.286 + -moz-border-radius-bottomright: 4px; 1.287 + border-top-right-radius: 4px; 1.288 + border-bottom-right-radius: 4px; 1.289 +} 1.290 + 1.291 +input[type=submit]:hover { background-color: #444; } 1.292 + 1.293 +input[type=text] { 1.294 + border: 1px solid #333333; 1.295 + padding: 4px; 1.296 + height: 17px; 1.297 + width: 100%; 1.298 + -webkit-border-top-left-radius: 4px; 1.299 + -webkit-border-bottom-left-radius: 4px; 1.300 + -moz-border-radius-topleft: 4px; 1.301 + -moz-border-radius-bottomleft: 4px; 1.302 + border-top-left-radius: 4px; 1.303 + border-bottom-left-radius: 4px; 1.304 +} 1.305 + 1.306 +/* Footer */ 1.307 + 1.308 +#footer { 1.309 + background: #f1f1f1; 1.310 + text-align: center; 1.311 + border-top: 1px solid #ddd; 1.312 + padding: 40px; 1.313 + color: #666; 1.314 + clear: both; 1.315 + margin-bottom: -2%; 1.316 +} 1.317 + 1.318 +#footer a { color: #666; padding: 0 2px; } 1.319 + 1.320 +.year:after { 1.321 + /* content: "2007-2014"; */ 1.322 + content: "2014"; 1.323 +} 1.324 + 1.325 +p, li { 1.326 + -moz-hyphens: auto; 1.327 + -webkit-hyphens: auto; 1.328 + hyphens: auto; 1.329 +} 1.330 + 1.331 + 1.332 +/* --- SEARCH --- */ 1.333 + 1.334 +input.gsc-search-button { 1.335 + border: 1px solid #b64b22; 1.336 + background-color: #b64b22; 1.337 + color: white; 1.338 + font-weight: bold; 1.339 + cursor: pointer; 1.340 + padding: 2px 10px; 1.341 + font-size: 14px; 1.342 + margin-left: -4px; 1.343 + -webkit-border-top-right-radius: 4px; 1.344 + -webkit-border-bottom-right-radius: 4px; 1.345 + -moz-border-radius-topright: 4px; 1.346 + -moz-border-radius-bottomright: 4px; 1.347 + border-top-right-radius: 4px; 1.348 + border-bottom-right-radius: 4px; 1.349 +} 1.350 + 1.351 +.gs-webResult.gs-result a.gs-title:link, 1.352 +.gs-webResult.gs-result a.gs-title:link b { 1.353 + color: #103a5e; 1.354 +} 1.355 + 1.356 +#cse { 1.357 + margin-bottom: 120px; 1.358 + width:100%; 1.359 +} 1.360 + 1.361 + 1.362 +/* --- GALLERY --- */ 1.363 + 1.364 +#gallery div { 1.365 + width: 496px; 1.366 + border: none; 1.367 + border-radius: 12px; 1.368 + padding-bottom: 8px; 1.369 + margin: 12px auto; 1.370 + webkit-box-shadow: 0 0 6px rgba(0,0,0,0.5); 1.371 + -moz-box-shadow: 0 0 6px rgba(0,0,0,0.5); 1.372 + box-shadow: 0 0 6px rgba(0,0,0,0.5); 1.373 +} 1.374 +#gallery img { 1.375 + width: 480px; 1.376 + margin: 8px; 1.377 +}