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

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