SliTaz Repositories

     1.1 --- a/web/style.css	Fri Mar 24 17:29:16 2017 +0200
     1.2 +++ b/web/style.css	Sat Feb 02 13:36:54 2019 +0200
     1.3 @@ -1,93 +1,69 @@
     1.4  /* CSS style for SliTaz Cooker */
     1.5  
     1.6 -body {
     1.7 -	font-family: sans-serif;
     1.8 -	font-size: 13px;
     1.9 -	margin: 0;
    1.10 -	min-height: 100%;
    1.11 -/*	position: absolute;*/
    1.12 -	left: 0;
    1.13 -	right: 0;
    1.14 -}
    1.15 -#content2 h2 {
    1.16 -	color: #444;
    1.17 -	border-bottom: 2px solid #CCC;
    1.18 -	height: 100%;
    1.19 -}
    1.20 +html { min-height: 102%; }
    1.21 +body { font: 13px sans-serif, vernada, arial; margin: 0; }
    1.22 +h1 { margin: 0; padding: 8px; color: #fff; font-size: 20px; }
    1.23 +h1 a { color: #fff; text-decoration: none; }
    1.24 +h2 { color: #444; }
    1.25  h3 { color: #666; font-size: 140%; }
    1.26 -a { text-decoration: none; color: #215090; }
    1.27 -a:hover { text-decoration: underline; }
    1.28 -.files a { text-decoration: none; color: inherit; }
    1.29 -.files a:hover { text-decoration: underline; }
    1.30 +a { text-decoration: underline; color: #215090; }
    1.31 +a:hover { text-decoration: none; }
    1.32  hr { margin: 0; border: 1px solid #cfcfcf; }
    1.33  pre {
    1.34  	background-color: #f8f8f8;
    1.35  	border: 1px solid #ddd;
    1.36 -	padding: 8px;
    1.37 +	padding: 10px;
    1.38  	overflow: auto;
    1.39 +	font-size: 96%;
    1.40  }
    1.41  
    1.42  /* Header */
    1.43 -body>header {
    1.44 -	display:block;
    1.45 -	background:#444;
    1.46 -	text-align:justify;
    1.47 -	line-height:0;
    1.48 -	box-shadow:0 -8px 8px #333 inset
    1.49 +
    1.50 +#header {
    1.51 +	color: #fff;
    1.52 +	background: #222;
    1.53 +	height: 40px;
    1.54 +	border-bottom: 4px solid #afafaf;
    1.55  }
    1.56 -h1 {
    1.57 -	display:inline-block;
    1.58 -	margin:auto 0;
    1.59 -	height:40px;
    1.60 -	white-space:nowrap;
    1.61 -	vertical-align:middle
    1.62 +
    1.63 +#header h1 {
    1.64 +	margin: 0;
    1.65 +	/* padding: 8px 0 0 42px; */
    1.66 +	width: 250px;
    1.67  }
    1.68 -h1::before {
    1.69 -	display:inline-block;
    1.70 -	content:url(images/logo.png);
    1.71 -	vertical-align:middle
    1.72 +
    1.73 +#header h1 a {
    1.74 +	color: #fff;
    1.75 +	text-decoration: none;
    1.76 +	font-size: 20px;
    1.77 +	font-style: italic;
    1.78  }
    1.79 -h1 a {
    1.80 -	color:#FFF;
    1.81 -	font-size:20px;
    1.82 -	font-style:italic
    1.83 +
    1.84 +#header h1 a:hover, #network a:hover {
    1.85 +	color: #afafaf;
    1.86  }
    1.87 -body>header::before,body>header::after,.block>div::before,.block>div::after {
    1.88 -	display:inline-block;
    1.89 -	width:100%;
    1.90 -	height:0;
    1.91 -	visibility:hidden;
    1.92 -	overflow:hidden;
    1.93 -	content:''
    1.94 +
    1.95 +/* Header links */
    1.96 +
    1.97 +#network {
    1.98 +	float: right;
    1.99 +	padding: 14px 5px 0;
   1.100 +	font-size: 12px;
   1.101  }
   1.102 -.network {
   1.103 -	display:inline-block;
   1.104 -	text-align:left;
   1.105 -	vertical-align:middle;
   1.106 -	font-size:12px;
   1.107 -	line-height:normal;
   1.108 -	color:#999
   1.109 -}
   1.110 -.network a {
   1.111 -	display:inline-block;
   1.112 -	padding:0 6px;
   1.113 -	vertical-align:middle;
   1.114 -	color:#FFF
   1.115 +
   1.116 +#network a {
   1.117 +	padding: 0 4px;
   1.118 +	color: #fff;
   1.119 +	font-weight: bold;
   1.120 +	text-decoration: none;
   1.121  }
   1.122  
   1.123  /* Content */
   1.124  
   1.125  #content {
   1.126 -	margin: auto;
   1.127 -	padding: 0.5em;
   1.128 +	margin: 40px 80px;
   1.129 +	text-align: justify;
   1.130  }
   1.131 -#content2 {
   1.132 -	width: 100%; box-sizing: border-box;
   1.133 -	max-width: 700px;
   1.134 -	margin: auto;
   1.135 -	padding: 0.5em;
   1.136 -}
   1.137 -
   1.138  
   1.139  .span-ok    { color: #0a0; }
   1.140  .span-red   { color: red; }
   1.141 @@ -102,9 +78,9 @@
   1.142  /* Buttons */
   1.143  
   1.144  .button {
   1.145 -	display: inline-block;
   1.146 +	cursor: pointer;
   1.147  	padding: 4px;
   1.148 -	margin: 2px 0;
   1.149 +	margin: 4px 0px;
   1.150  }
   1.151  
   1.152  a.button, .pctbar  {
   1.153 @@ -112,154 +88,39 @@
   1.154  	color: #666;
   1.155  }
   1.156  
   1.157 -.pct {
   1.158 -	background: #9dff4a;
   1.159 -	background-image: -webkit-linear-gradient(#CDFFA3, #9DFF4A 40%, #87DB40);
   1.160 -	background-image:    -moz-linear-gradient(#CDFFA3, #9DFF4A 40%, #87DB40);
   1.161 -	padding: 2px 4px;
   1.162 +.button:hover {
   1.163 +	border: 1px solid #999;
   1.164  }
   1.165 +
   1.166 +.pct { background: #9dff4a; padding: 2px 4px; }
   1.167  .pctbar { overflow: hidden; }
   1.168  
   1.169 -.button {
   1.170 -	text-decoration: none;
   1.171 -	color: #444;
   1.172 -	border: 1px solid #666;
   1.173 +.button, .pctbar {
   1.174 +	border: 1px solid #cccccc;
   1.175  	font-size: 14px;
   1.176  	line-height: 1.2em;
   1.177 -}
   1.178 -.button:hover {
   1.179 -	color: #000;
   1.180 -	border-color: #000;
   1.181 -}
   1.182 -.button.active {
   1.183 -	/*outline: 1px solid #999;
   1.184 -	outline-offset: 1px;*/
   1.185 -	color: #000;
   1.186 -	border-color: #000;
   1.187 +	background-image: -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
   1.188 +	background-image: -moz-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
   1.189 +	-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
   1.190 +	-moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
   1.191 +	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
   1.192  }
   1.193  
   1.194 -.pctbar {
   1.195 -	border: 1px solid #AAA;
   1.196 -	font-size: 14px;
   1.197 -	line-height: 1.2em;
   1.198 -	background-image: -webkit-linear-gradient(#E5E5E5, #F4F4F4 40%, #FAFAFA);
   1.199 -	background-image: -moz-linear-gradient(#E5E5E5, #F4F4F4 40%, #FAFAFA);
   1.200 -}
   1.201  /* Round corner */
   1.202  
   1.203  pre, .button, .pctbar {
   1.204 -	border-radius: 2px;
   1.205 +	-moz-border-radius: 4px;
   1.206 +	-webkit-border-radius: 4px;
   1.207 +	border-radius: 4px;
   1.208  }
   1.209  
   1.210  /* Footer */
   1.211  
   1.212  #footer {
   1.213  	text-align: center;
   1.214 -	padding: 20px 0;
   1.215 +	padding: 20px;
   1.216  	border-top: 1px solid #ddd;
   1.217  	font-size: 90%;
   1.218 -/*	position: absolute;*/
   1.219 -	bottom: 0;
   1.220 -	left: 0;
   1.221 -	right: 0;
   1.222  }
   1.223  
   1.224  #footer a { padding: 0 2px; }
   1.225 -
   1.226 -body>footer {
   1.227 -	background:#f1f1f1;
   1.228 -	text-align:center;
   1.229 -	border-top:1px solid #CCC;
   1.230 -	padding:6px;
   1.231 -	color:#666;
   1.232 -	clear:both;
   1.233 -	box-shadow:0 4px 8px #CCC inset
   1.234 -}
   1.235 -
   1.236 -footer a+a::before { display: inline-block; content: '• '; color: #E81; }
   1.237 -
   1.238 -body>footer div {
   1.239 -	margin:12px
   1.240 -}
   1.241 -
   1.242 -
   1.243 -
   1.244 -.log a { text-decoration: none; color: #666; }
   1.245 -.log a:hover { color: #000; }
   1.246 -
   1.247 -.activity { padding-left: 0.5em; }
   1.248 -.activity li { list-style-type: none; }
   1.249 -.activity li:before { color: #666; content: "•"; padding-right: 0.5em; }
   1.250 -
   1.251 -.r { float: right; }
   1.252 -
   1.253 -.zebra tr:nth-child(odd)  { background-color: #FFFFFF; }
   1.254 -.zebra tr:nth-child(even) { background-color: #ECECEC; }
   1.255 -
   1.256 -.gray   { background-color: lightgray; }
   1.257 -.gold   { background-color: gold; }
   1.258 -.green  { background-color: greenyellow; }
   1.259 -.sky    { background-color: skyblue; }
   1.260 -.plum   { background-color: plum; }
   1.261 -.yellow { background-color: yellow; }
   1.262 -.khaki  { background-color: khaki; }
   1.263 -.brown  { background-color: sandybrown; }
   1.264 -
   1.265 -a:target {background-color: yellow; }
   1.266 -
   1.267 -
   1.268 -/*
   1.269 -table {
   1.270 -	border-spacing: 0;
   1.271 -	padding: 0 2px;
   1.272 -	border-width: 1px;
   1.273 -	border-color: #666;
   1.274 -	border-radius: 4px;
   1.275 -	border-style: solid;
   1.276 -}
   1.277 -th {
   1.278 -	background-color: #CCC;
   1.279 -}
   1.280 -td {
   1.281 -	border-bottom: 1px solid #79B;
   1.282 -	padding: 2px;
   1.283 -}
   1.284 -tr:last-child td {
   1.285 -	border-bottom: unset;
   1.286 -}
   1.287 -*/
   1.288 -
   1.289 -table {
   1.290 -	/*width: 100%;*/
   1.291 -	border: 1px solid #CCC;
   1.292 -	border-radius: 4px;
   1.293 -	border-spacing: 0;
   1.294 -	padding: 0;
   1.295 -}
   1.296 -tr {
   1.297 -	margin: 0;
   1.298 -	padding: 2px;
   1.299 -}
   1.300 -td {
   1.301 -	margin: 0;
   1.302 -	padding: 3px;
   1.303 -	vertical-align: top;
   1.304 -	line-height: 1.1;
   1.305 -}
   1.306 -thead tr {
   1.307 -	background-color:#DDD
   1.308 -}
   1.309 -thead th {
   1.310 -	border-bottom:1px solid #BBB
   1.311 -}
   1.312 -
   1.313 -tbody tr:nth-child(odd)  { background-color: #FFFFFF; }
   1.314 -tbody tr:nth-child(even) { background-color: #ECECEC; }
   1.315 -
   1.316 -#content, #content2 {
   1.317 -	min-height: 80vh;
   1.318 -}
   1.319 -
   1.320 -.texinfo pre { display: none; }
   1.321 -/*.texinfo pre.first:not(:target) { display: block; }*/
   1.322 -.texinfo pre:target { display: block; }