slitaz-forge view pkgs/pkgs.css @ rev 612

tank, pangolin: add console link
author Pascal Bellard <pascal.bellard@slitaz.org>
date Wed Feb 03 18:29:16 2016 +0100 (2016-02-03)
parents d50b1e11ce39
children 401b2efda7ed
line source
1 body {
2 background: #FBFBFB;
3 /* url(/lib/bg.png) */
4 /* word-wrap: break-word; */
5 }
6 main {
7 background: #FFF;
8 border-radius: 6px;
9 }
10 .hidden { display: none; }
11
12 /* TABLE */
13 table {
14 width: 100%;
15 border: 1px solid #CCC;
16 -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;
17 border-spacing: 0;
18 padding: 0;
19 }
20 tr {
21 margin: 0;
22 padding: 4px;
23 }
24 td {
25 margin: 0;
26 padding: 6px;
27 vertical-align: top;
28 line-height: 1.3;
29 }
30 [dir="rtl"] td {
31 text-align: right;
32 }
33 .first {
34 width: 1%;
35 white-space: nowrap;
36 }
37 /*.first img:hover {
38 border: none; border-radius: 4px;
39 box-shadow: 0 0 1px #888;
40 }*/
41 .pre {
42 padding-left: 2em;
43 white-space: nowrap;
44 border-bottom: 1px solid #CCC;
45 }
46 .bugs tr:nth-child(even) {
47 border-bottom: 1px solid #CCC;
48 }
49 .list tr:last-child td {
50 border-bottom: none;
51 }
52
53
54 /* --- */
55
56 .form {
57 display: table;
58 table-layout: auto;
59 width: 100%;
60 padding: 0;
61 margin: 0 0 20px 0; /* t r b l */
62 }
63
64 #s_form {
65 display: table-row;
66 padding: 6px;
67 margin: 0;
68 text-align: center;
69 }
70
71 .small {
72 white-space: nowrap;
73 display: table-cell;
74 width: 10%;
75 }
76 select, input, button {
77 -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
78 height: 2rem;
79 min-height: 2rem;
80 font-size: 1rem;
81 }
82 span.stretch {
83 display: table-cell;
84 width: 100%;
85 padding: 0;
86 margin: 0;
87 }
88 #query { width: 100%; }
89
90 #ticker {
91 padding: 12px 0;
92 }
93 #ticker img {
94 float: right;
95 width: 16px;
96 height: 16px;
97 }
98 #ticker progress {
99 width: 100%;
100 box-sizing: border-box;
101 }
102
103 .summary {
104 text-align: center;
105 font-style: italic;
106 }
107 mark {
108 background: #FF8;
109 border: solid #EB7;
110 border-radius: 4px;
111 border-width: 1px 0;
112
113 }
114 .err::before {
115 display: inline-block;
116 vertical-align: middle;
117 content: url(icons/dialog-error.png);
118 padding: 1ex;
119 }
120
121
122
123
124 /* Tags cloud (and other "clouds") */
125
126 /* tag - Number of elements */
127 .tagn {
128 color: #99F;
129 font-size: 9pt;
130 padding-left: 5px;
131 padding-right: 2px;
132 }
133 /* tag - Anchor */
134 .tagn + a {
135 font-weight: bold;
136 text-decoration: none;
137 }
138
139 .tag1 { font-size: 10pt; color: #005E80; /*#222222*/ }
140 .tag2 { font-size: 11pt; color: #4A5C79; /*#383432*/ }
141 .tag3 { font-size: 12pt; color: #6F5A71; /*#4E433F*/ }
142 .tag4 { font-size: 13pt; color: #8A5769; /*#644E46*/ }
143 .tag5 { font-size: 14pt; color: #A05561; /*#7A5749*/ }
144 .tag6 { font-size: 15pt; color: #B45357; /*#905C48*/ }
145 .tag7 { font-size: 16pt; color: #C5504C; /*#A75E43*/ }
146 .tag8 { font-size: 17pt; color: #D54E40; /*#BD5D39*/ }
147 .tag9 { font-size: 18pt; color: #E44B31; /*#D3582A*/ }
148 .tag10{ font-size: 19pt; color: #F2491D; /*#E95117*/ }
149 .tag11{ font-size: 20pt; color: #FF4600; /*#FF4600*/ }
150
151
152
153
154 /* SYNTAX HIGHLIGHTER */
155 .r-comment { color: #888; }
156 .r-literal { color: #f35a00; }
157 .r-var { font-weight: 600; color: #070; }
158 .r-func { color: #4895DD; }
159 .r-url { text-decoration: none; }
160 .r-com, .r-scom { color: #4895DD; font-weight: bold; /*background-color: #cde;*/ }
161 .r-path { text-decoration: underline; color: brown; }
162 .r-param { font-weight: bold; color: #444; }
163
164
165
166
167 /* Actions icons */
168
169 .last { text-align: right; white-space: nowrap; }
170
171 .dl, .rc, .co {
172 height: 16px;
173 background-repeat: no-repeat; background-position: left top; background-size: contain;
174 display: inline-block; vertical-align: middle;
175 white-space: nowrap; overflow: hidden; width: 0;
176 padding-left: 16px;
177 font-size: smaller;
178 /*transition: all 0.3s cubic-bezier(.5, .51, .4, 1) 0s;*/
179 direction: initial;
180 }
181 .dl { background-image: url(icons/a-dl.png); }
182 .rc { background-image: url(icons/a-rc.png); }
183 .co { background-image: url(icons/a-co.png); }
184
185 .avatar::before { content: url(icons16/authors.png); }
186 .license::before { content: url(icons16/text-x-copying.png); }
187 .web::before { content: url(icons16/text-html.png); }
188 .receipt::before { content: url(icons16/text-x-source.png); }
189 .dep::before { content: url(icons16/x-dia-diagram.png); }
190 .description::before { content: url(icons16/text-x-readme.png); }
191 .bugs::before { content: url(icons16/bug-buddy.png); }
192 .arch::before { content: url(icons16/jockey.png); }
193 .category::before { content: url(icons16/applications-graphics.png); }
194 .file::before { content: url(icons16/multipart-encrypted.png); }
195 .common::before { content: url(icons16/edit-cut.png); }
196 .pkgi::before { content: url(icons16/package-install.png); }
197 .pkgr::before { content: url(icons16/package-remove.png); }
198 .download::before { content: url(icons16/emblem-downloads.png); }
199 .files-list::before { content: url(icons16/files-list.png); }
200 .cooker::before { content: url(icons16/text-x-makefile.png); }
201 .tag::before { content: url(icons16/easytag.png); }
202 .pkg::before { content: url(icons16/package-x-generic.png); }
203
204 .avatar::before, .license::before, .web::before, .receipt::before, .dep::before,
205 .description::before, .bugs::before, .arch::before, .category::before, .file::before,
206 .common::before, .pkgi::before, .pkgr::before, .download::before, .files-list::before,
207 .cooker::before, .tag::before, .pkg::before {
208 display: inline-block; vertical-align: middle; padding: 0 0.5ex 0 0; }
209
210 @media
211 (-webkit-min-device-pixel-ratio: 1.5),
212 (min--moz-device-pixel-ratio: 1.5),
213 (-o-min-device-pixel-ratio: 3/2),
214 (min-device-pixel-ratio: 1.5),
215 (min-resolution: 144dpi),
216 (min-resolution: 1.5dppx)
217 {
218 .dl { background-image: url(icons1.5/a-dl.png); }
219 .rc { background-image: url(icons1.5/a-rc.png); }
220 .co { background-image: url(icons1.5/a-co.png); }
221 }
222 @media
223 (-webkit-min-device-pixel-ratio: 2),
224 (min--moz-device-pixel-ratio: 2),
225 (-o-min-device-pixel-ratio: 2/1),
226 (min-device-pixel-ratio: 2),
227 (min-resolution: 192dpi),
228 (min-resolution: 2dppx)
229 {
230 .dl { background-image: url(icons2/a-dl.png); }
231 .rc { background-image: url(icons2/a-rc.png); }
232 .co { background-image: url(icons2/a-co.png); }
233 }
234 /*td:hover .dl, td:hover .rc, td:hover .co { width: inherit; }*/
235
236
237
238 /* Levels for tree */
239
240 .l1, .l2, .l3, .l4, .l5, .l6, .l7, .l8 { display: table; }
241 .l1 { margin-left: 3ex; }
242 .l2 { margin-left: 6ex; }
243 .l3 { margin-left: 9ex; }
244 .l4 { margin-left: 12ex; }
245 .l5 { margin-left: 15ex; }
246 .l6 { margin-left: 18ex; }
247 .l7 { margin-left: 21ex; }
248 .l8 { margin-left: 24ex; }
249
250
251 footer a+a::before { display: inline-block; content: '• '; color: #E81; }
252
253
254
255
256 table.info { position: relative; }
257
258 .appImg {
259 display: inline-block;
260 position: absolute; top: 0.3rem;
261 width: 64px; height: 64px;
262 }
263 [dir="ltr"] .appImg { right: 0.3rem; }
264 [dir="rtl"] .appImg { left: 0.3rem; }
265
266 .info a { display: inline-block; }
267 .spkg img { width: 16px; height: 16px; padding: 0 0.5ex 0 0;}
268
269 .desc {
270 -moz-border-radius: 4px;
271 -webkit-border-radius: 4px;
272 border-radius: 4px;
273 border: 1px solid #CCC;
274 padding: 6px;
275 }
276
277 .lang select { vertical-align: middle; }
278
279 .center { text-align: center; }
280
281
282 /* Conditional blocks */
283
284 /* Show on Small Screens - hide by default */
285 .sssi, .sssb, .sssc { display: none; }
286 /* Hide on Small Screens - show by default */
287 .hssi { display: inline-block; } .hssb { display: block; } .hssc { display: table-cell; }
288
289 @media (max-width: 480px) {
290 .sssi { display: inline-block; } .sssb { display: block; }
291 .hssi, .hssb, .hssc { display: none; }
292 }
293
294
295 /* Responsive */
296
297 @media (max-width: 480px) {
298 .form, #s_form, .small, .stretch {
299 display: block;
300 width: inherit;
301 max-width: 100%;
302 }
303 .list td:nth-child(2) {
304 display: inline-block;
305 clear: both;
306 }
307 .list td:nth-child(3) {
308 display: block;
309 text-align: right;
310 width: inherit;
311 font-size: 11px;
312 border-top: 1px dotted #CCC;
313 }
314 .small, .stretch, form select, input, button {
315 display: block !important;
316 -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
317 width: 100%;
318 height: 2rem;
319 min-height: 2rem;
320 margin: 6px 0;
321 font-size: 1rem;
322 }
323 .dl, .rc, .co {
324 white-space: normal; width: inherit;
325 }
326 .pre {
327 white-space: normal;
328 }
329 }
330
331 @media (max-device-width: 480px) {
332 body {
333 background-color: #DDD;
334 }
335 /* Custom look of standard controls */
336 select, input, button {
337 -webkit-appearance: none;
338 display: inline-block;
339 border: 1px solid #666;
340 border-radius: 4px;
341 margin: 12px 0;
342 padding: 0 6px;
343 }
344 /* Add an arrow to the "select" control */
345 select {
346 background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAAGAQMAAAAv/Pa7AAAABlBMVEUAAABJSUn0lwL4AAAAAXRSTlMAQObYZgAAABpJREFUCB1j+P+Aof4Ag30DgzwDAx8DAwsDADiuBA9DaVFpAAAAAElFTkSuQmCC');
347 background-position: 98% 50%;
348 background-repeat: no-repeat;
349 margin: 12px 0;
350 }
351 input, button {
352 margin: 16px 0 8px;
353 }
354 /* Remove the dots between links */
355 footer a+a::before { content: ' '; }
356 }
357
358
359
360 *::-moz-selection, *::selection { background-color: #FFA500; color: #000; }