slitaz-forge diff pkgs/pkgs.css @ rev 603

Update to the current state of "mirror" and "pkgs"
author Aleksej Bobylev <al.bobylev@gmail.com>
date Sun Oct 25 06:47:13 2015 +0200 (2015-10-25)
parents 3927a22b609e
children fd79a2207aed
line diff
     1.1 --- a/pkgs/pkgs.css	Sun Feb 16 18:20:41 2014 +0100
     1.2 +++ b/pkgs/pkgs.css	Sun Oct 25 06:47:13 2015 +0200
     1.3 @@ -1,44 +1,10 @@
     1.4 -
     1.5 -/* Be compatible with old FF and Webkit version. */
     1.6 -/*input[type="submit"] {
     1.7 -	-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
     1.8 -	-moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
     1.9 -	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
    1.10 -}*/
    1.11 -
    1.12 -#header { border-bottom: 4px solid #ccc; background: #222; }
    1.13 -#header h1 { padding: 3px 0 0 42px; }
    1.14 -#footer { background-color: #FFF; }
    1.15 -
    1.16 -/* COMMON STYLES */
    1.17 -select:focus, select:hover, input:focus, input[type]:hover {
    1.18 -	color: #000;
    1.19 -	-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.3);
    1.20 -	-moz-box-shadow: 0 0 4px rgba(0,0,0,0.3);
    1.21 -}
    1.22 -input, select {
    1.23 -	-webkit-transition: all 0.3s ease-in-out;
    1.24 -	-moz-transition: all 0.3s ease-in-out;
    1.25 -	-o-transition: all 0.3s ease-in-out;
    1.26 -	-ms-transition: all 0.3s ease-in-out;
    1.27 -	transition: all 0.3s ease-in-out;
    1.28 -}
    1.29 -select, input[type="text"], input[type="submit"] {
    1.30 -	font-size: 14px;
    1.31 -	border: 1px solid #CCC;
    1.32 -	-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
    1.33 -	color: #444;
    1.34 -	outline: 0 none;
    1.35 -}
    1.36 -
    1.37  /* TABLE */
    1.38  table {
    1.39  	width: 100%;
    1.40 -	font-size: 12px;
    1.41  	border: 1px solid #CCC;
    1.42  	-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
    1.43  	border-spacing: 0;
    1.44 -	padding: 2px;
    1.45 +	padding: 0;
    1.46  }
    1.47  tr {
    1.48  	margin: 0;
    1.49 @@ -49,33 +15,21 @@
    1.50  	padding: 6px;
    1.51  	vertical-align: top;
    1.52  }
    1.53 -tr.even {
    1.54 -	background-color: #F0F0F0;
    1.55 -}
    1.56 -td.first {
    1.57 +.first {
    1.58  	width: 1%;
    1.59  	white-space: nowrap;
    1.60  }
    1.61 -td.pre {
    1.62 +.pre {
    1.63  	padding-left: 2em;
    1.64  	white-space: nowrap;
    1.65 +	border-bottom: 1px solid #CCC;
    1.66  }
    1.67 +.bugs tr:nth-child(even) { border-bottom: 1px solid #CCC; }
    1.68  
    1.69  
    1.70  /* --- */
    1.71  
    1.72 -input[type="submit"] {
    1.73 -	padding: 4px;
    1.74 -	margin: 0;
    1.75 -	font-size: 14px;
    1.76 -	background-image: -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
    1.77 -	background-image: -moz-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
    1.78 -/*	-webkit-appearance: none;
    1.79 -	-webkit-padding-end: 6px;
    1.80 -	-webkit-padding-start: 6px;*/
    1.81 -}
    1.82 -
    1.83 -div.form {
    1.84 +.form {
    1.85  	display: table;
    1.86  	table-layout: auto;
    1.87  	width: 100%;
    1.88 @@ -85,10 +39,9 @@
    1.89  
    1.90  #s_form {
    1.91  	display: table-row;
    1.92 -	padding: 0;
    1.93 +	padding: 6px;
    1.94  	margin: 0;
    1.95  	text-align: center;
    1.96 -	border: 1pt solid yellow;
    1.97  }
    1.98  
    1.99  .small {
   1.100 @@ -96,44 +49,81 @@
   1.101  	display: table-cell;
   1.102  	width: 10%;
   1.103  }
   1.104 -
   1.105 -select {
   1.106 -	padding: 4px;
   1.107 -	margin: 0 4px;
   1.108 -	background-image: -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
   1.109 -	background-position: center right;
   1.110 -	background-repeat: no-repeat;
   1.111 -	-webkit-appearance: none;
   1.112 -	cursor: pointer;
   1.113 +select, input, button {
   1.114 +	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
   1.115 +	height: 2rem;
   1.116 +	min-height: 2rem;
   1.117 +	font-size: 1rem;
   1.118  }
   1.119 -
   1.120  span.stretch {
   1.121  	display: table-cell;
   1.122  	width: 100%;
   1.123 -	padding: 0 4px;
   1.124 +	padding: 0;
   1.125  	margin: 0;
   1.126  }
   1.127 +#query { width: 100%; }
   1.128  
   1.129 -input[type="text"] {
   1.130 -	padding: 4px 0;
   1.131 -	margin: 0;
   1.132 -	border: 1px solid #CCC;
   1.133 -	background-color: #FEFEFE;
   1.134 +#ticker {
   1.135 +	padding: 12px 0;
   1.136  }
   1.137 -
   1.138 -div#ticker img {
   1.139 +#ticker img {
   1.140  	float: right;
   1.141 +	width: 16px;
   1.142 +	height: 16px;
   1.143 +}
   1.144 +#ticker progress {
   1.145 +	width: 100%;
   1.146 +	box-sizing: border-box;
   1.147  }
   1.148  
   1.149  .summary {
   1.150 -	margin-top: 12px;
   1.151  	text-align: center;
   1.152  	font-style: italic;
   1.153  }
   1.154 -.match {
   1.155 +mark {
   1.156 +	background: #FF8;
   1.157 +	border: 1px solid #EB7;
   1.158 +	border-radius: 50%;
   1.159 +}
   1.160 +.err::before {
   1.161 +	display: inline-block;
   1.162 +	vertical-align: middle;
   1.163 +	content: url(icons/dialog-error.png);
   1.164 +	padding: 1ex;
   1.165 +}
   1.166 +
   1.167 +
   1.168 +
   1.169 +
   1.170 +/* Tags cloud (and other "clouds") */
   1.171 +
   1.172 +/* tag - Number of elements */
   1.173 +.tagn {
   1.174 +	color: #99F;
   1.175 +	font-size: 9pt;
   1.176 +	padding-left: 5px;
   1.177 +	padding-right: 2px;
   1.178 +}
   1.179 +/* tag - Anchor */
   1.180 +.taga {
   1.181  	font-weight: bold;
   1.182 -	color: #F33;
   1.183 +	color: #222;
   1.184 +	text-decoration: none;
   1.185  }
   1.186 +.tag1 { font-size:  8pt; color: #005E80; /*#222222*/ }
   1.187 +.tag2 { font-size:  9pt; color: #4A5C79; /*#383432*/ }
   1.188 +.tag3 { font-size: 10pt; color: #6F5A71; /*#4E433F*/ }
   1.189 +.tag4 { font-size: 11pt; color: #8A5769; /*#644E46*/ }
   1.190 +.tag5 { font-size: 12pt; color: #A05561; /*#7A5749*/ }
   1.191 +.tag6 { font-size: 13pt; color: #B45357; /*#905C48*/ }
   1.192 +.tag7 { font-size: 14pt; color: #C5504C; /*#A75E43*/ }
   1.193 +.tag8 { font-size: 15pt; color: #D54E40; /*#BD5D39*/ }
   1.194 +.tag9 { font-size: 16pt; color: #E44B31; /*#D3582A*/ }
   1.195 +.tag10{ font-size: 17pt; color: #F2491D; /*#E95117*/ }
   1.196 +.tag11{ font-size: 18pt; color: #FF4600; /*#FF4600*/ }
   1.197 +
   1.198 +
   1.199 +
   1.200  
   1.201  /* SYNTAX HIGHLIGHTER */
   1.202  .r-comment { color: #888; }
   1.203 @@ -144,3 +134,147 @@
   1.204  .r-com, .r-scom { color: #4895DD; font-weight: bold; /*background-color: #cde;*/ }
   1.205  .r-path { text-decoration: underline; color: brown; }
   1.206  .r-param { font-weight: bold; color: #444; }
   1.207 +
   1.208 +
   1.209 +
   1.210 +
   1.211 +/* Actions icons */
   1.212 +
   1.213 +.last { text-align: right; white-space: nowrap; }
   1.214 +
   1.215 +.dl, .rc, .co {
   1.216 +	height: 16px;
   1.217 +	background-repeat: no-repeat; background-position: left top; background-size: contain;
   1.218 +	display: inline-block; vertical-align: middle;
   1.219 +	white-space: nowrap; overflow: hidden; width: 0;
   1.220 +	padding-left: 16px;
   1.221 +	font-size: smaller;
   1.222 +	/*transition: all 0.3s cubic-bezier(.5, .51, .4, 1) 0s;*/
   1.223 +}
   1.224 +.dl { background-image: url(icons/a-dl.png); }
   1.225 +.rc { background-image: url(icons/a-rc.png); }
   1.226 +.co { background-image: url(icons/a-co.png); }
   1.227 +@media
   1.228 +	(-webkit-min-device-pixel-ratio: 1.5),
   1.229 +	(min--moz-device-pixel-ratio: 1.5),
   1.230 +	(-o-min-device-pixel-ratio: 3/2),
   1.231 +	(min-device-pixel-ratio: 1.5),
   1.232 +	(min-resolution: 144dpi),
   1.233 +	(min-resolution: 1.5dppx)
   1.234 +	{
   1.235 +	.dl { background-image: url(icons1.5/a-dl.png); }
   1.236 +	.rc { background-image: url(icons1.5/a-rc.png); }
   1.237 +	.co { background-image: url(icons1.5/a-co.png); }
   1.238 +}
   1.239 +@media
   1.240 +	(-webkit-min-device-pixel-ratio: 2),
   1.241 +	(min--moz-device-pixel-ratio: 2),
   1.242 +	(-o-min-device-pixel-ratio: 2/1),
   1.243 +	(min-device-pixel-ratio: 2),
   1.244 +	(min-resolution: 192dpi),
   1.245 +	(min-resolution: 2dppx)
   1.246 +	{
   1.247 +	.dl { background-image: url(icons2/a-dl.png); }
   1.248 +	.rc { background-image: url(icons2/a-rc.png); }
   1.249 +	.co { background-image: url(icons2/a-co.png); }
   1.250 +}
   1.251 +/*td:hover .dl, td:hover .rc, td:hover .co { width: inherit; }*/
   1.252 +
   1.253 +
   1.254 +
   1.255 +/* Levels for tree */
   1.256 +
   1.257 +.l1, .l2, .l3, .l4, .l5, .l6, .l7, .l8 { display: table; }
   1.258 +.l1 { margin-left:  3ex; }
   1.259 +.l2 { margin-left:  6ex; }
   1.260 +.l3 { margin-left:  9ex; }
   1.261 +.l4 { margin-left: 12ex; }
   1.262 +.l5 { margin-left: 15ex; }
   1.263 +.l6 { margin-left: 18ex; }
   1.264 +.l7 { margin-left: 21ex; }
   1.265 +.l8 { margin-left: 24ex; }
   1.266 +
   1.267 +
   1.268 +footer a+a::before { display: inline-block; content: '• '; color: #E81; }
   1.269 +
   1.270 +table.info { position: relative; }
   1.271 +table.info a+a::before { display: inline-block; content: '· '; color: #222; }
   1.272 +
   1.273 +.appImg {
   1.274 +	display: inline-block;
   1.275 +	position: absolute; right: 0.3rem; top: 0.3rem;
   1.276 +	width: 64px; height: 64px;
   1.277 +}
   1.278 +
   1.279 +.desc {
   1.280 +	-moz-border-radius: 4px;
   1.281 +	-webkit-border-radius: 4px;
   1.282 +	border-radius: 4px;
   1.283 +	border: 1px solid #CCC;
   1.284 +	padding: 6px;
   1.285 +}
   1.286 +
   1.287 +.lang select { vertical-align: middle; }
   1.288 +
   1.289 +
   1.290 +/* Responsive */
   1.291 +
   1.292 +@media (max-width: 480px) {
   1.293 +	.form, #s_form, .small, .stretch {
   1.294 +		display: block;
   1.295 +		width: inherit;
   1.296 +		max-width: 100%;
   1.297 +	}
   1.298 +	.list td:nth-child(2) {
   1.299 +		display: inline-block;
   1.300 +		clear: both;
   1.301 +	}
   1.302 +	.list td:nth-child(3) {
   1.303 +		display: block;
   1.304 +		text-align: right;
   1.305 +		width: inherit;
   1.306 +		font-size: 11px;
   1.307 +		border-top: 1px dotted #CCC;
   1.308 +	}
   1.309 +	.small, .stretch, form select, input, button {
   1.310 +		display: block !important;
   1.311 +		-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
   1.312 +		width: 100%;
   1.313 +		height: 2rem;
   1.314 +		min-height: 2rem;
   1.315 +		margin: 6px 0;
   1.316 +		font-size: 1rem;
   1.317 +	}
   1.318 +	.dl, .rc, .co {
   1.319 +		white-space: normal; width: inherit;
   1.320 +	}
   1.321 +}
   1.322 +
   1.323 +@media (max-device-width: 480px) {
   1.324 +	body {
   1.325 +		background-color: #DDD;
   1.326 +	}
   1.327 +	select, input, button {
   1.328 +		-webkit-appearance: none;
   1.329 +		display: inline-block;
   1.330 +		border: 1px solid #666;
   1.331 +		border-radius: 4px;
   1.332 +		margin: 12px 0;
   1.333 +		padding: 0 6px;
   1.334 +	}
   1.335 +	select {
   1.336 +		background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAGAQMAAAAv/Pa7AAAABlBMVEUAAABJSUn0lwL4AAAAAXRSTlMAQObYZgAAABpJREFUCB1j+P+Aof4Ag30DgzwDAx8DAwsDADiuBA9DaVFpAAAAAElFTkSuQmCC');
   1.337 +		background-position: 98% 50%;
   1.338 +		background-repeat: no-repeat;
   1.339 +		margin: 12px 0;
   1.340 +	}
   1.341 +	input, button {
   1.342 +		margin: 16px 0 8px;
   1.343 +	}
   1.344 +	/* Remove the dots between links */
   1.345 +	footer a+a::before { content: ' '; }
   1.346 +}
   1.347 +
   1.348 +
   1.349 +
   1.350 +*::-moz-selection, *::selection { background-color: #FFA500; color: #000; }