diff options
Diffstat (limited to 'tpl/default')
-rw-r--r-- | tpl/default/css/grids-responsive.css | 861 | ||||
-rw-r--r-- | tpl/default/css/grids-responsive.min.css | 7 | ||||
-rw-r--r-- | tpl/default/css/pure.css | 1475 | ||||
-rw-r--r-- | tpl/default/css/shaarli.css | 108 | ||||
-rw-r--r-- | tpl/default/img/noise.png | bin | 0 -> 4275 bytes | |||
-rw-r--r-- | tpl/default/includes.html | 3 | ||||
-rw-r--r-- | tpl/default/js/shaarli.js | 42 | ||||
-rw-r--r-- | tpl/default/linklist.html | 128 | ||||
-rw-r--r-- | tpl/default/linklist.paging.html | 25 | ||||
-rw-r--r-- | tpl/default/page.footer.html | 31 | ||||
-rw-r--r-- | tpl/default/page.header.html | 128 |
11 files changed, 2807 insertions, 1 deletions
diff --git a/tpl/default/css/grids-responsive.css b/tpl/default/css/grids-responsive.css new file mode 100644 index 00000000..dc9f7718 --- /dev/null +++ b/tpl/default/css/grids-responsive.css | |||
@@ -0,0 +1,861 @@ | |||
1 | /*! | ||
2 | Pure v0.6.0 | ||
3 | Copyright 2014 Yahoo! Inc. All rights reserved. | ||
4 | Licensed under the BSD License. | ||
5 | https://github.com/yahoo/pure/blob/master/LICENSE.md | ||
6 | */ | ||
7 | @media screen and (min-width: 35.5em) { | ||
8 | .pure-u-sm-1, | ||
9 | .pure-u-sm-1-1, | ||
10 | .pure-u-sm-1-2, | ||
11 | .pure-u-sm-1-3, | ||
12 | .pure-u-sm-2-3, | ||
13 | .pure-u-sm-1-4, | ||
14 | .pure-u-sm-3-4, | ||
15 | .pure-u-sm-1-5, | ||
16 | .pure-u-sm-2-5, | ||
17 | .pure-u-sm-3-5, | ||
18 | .pure-u-sm-4-5, | ||
19 | .pure-u-sm-5-5, | ||
20 | .pure-u-sm-1-6, | ||
21 | .pure-u-sm-5-6, | ||
22 | .pure-u-sm-1-8, | ||
23 | .pure-u-sm-3-8, | ||
24 | .pure-u-sm-5-8, | ||
25 | .pure-u-sm-7-8, | ||
26 | .pure-u-sm-1-12, | ||
27 | .pure-u-sm-5-12, | ||
28 | .pure-u-sm-7-12, | ||
29 | .pure-u-sm-11-12, | ||
30 | .pure-u-sm-1-24, | ||
31 | .pure-u-sm-2-24, | ||
32 | .pure-u-sm-3-24, | ||
33 | .pure-u-sm-4-24, | ||
34 | .pure-u-sm-5-24, | ||
35 | .pure-u-sm-6-24, | ||
36 | .pure-u-sm-7-24, | ||
37 | .pure-u-sm-8-24, | ||
38 | .pure-u-sm-9-24, | ||
39 | .pure-u-sm-10-24, | ||
40 | .pure-u-sm-11-24, | ||
41 | .pure-u-sm-12-24, | ||
42 | .pure-u-sm-13-24, | ||
43 | .pure-u-sm-14-24, | ||
44 | .pure-u-sm-15-24, | ||
45 | .pure-u-sm-16-24, | ||
46 | .pure-u-sm-17-24, | ||
47 | .pure-u-sm-18-24, | ||
48 | .pure-u-sm-19-24, | ||
49 | .pure-u-sm-20-24, | ||
50 | .pure-u-sm-21-24, | ||
51 | .pure-u-sm-22-24, | ||
52 | .pure-u-sm-23-24, | ||
53 | .pure-u-sm-24-24 { | ||
54 | display: inline-block; | ||
55 | *display: inline; | ||
56 | zoom: 1; | ||
57 | letter-spacing: normal; | ||
58 | word-spacing: normal; | ||
59 | vertical-align: top; | ||
60 | text-rendering: auto; | ||
61 | } | ||
62 | |||
63 | .pure-u-sm-1-24 { | ||
64 | width: 4.1667%; | ||
65 | *width: 4.1357%; | ||
66 | } | ||
67 | |||
68 | .pure-u-sm-1-12, | ||
69 | .pure-u-sm-2-24 { | ||
70 | width: 8.3333%; | ||
71 | *width: 8.3023%; | ||
72 | } | ||
73 | |||
74 | .pure-u-sm-1-8, | ||
75 | .pure-u-sm-3-24 { | ||
76 | width: 12.5000%; | ||
77 | *width: 12.4690%; | ||
78 | } | ||
79 | |||
80 | .pure-u-sm-1-6, | ||
81 | .pure-u-sm-4-24 { | ||
82 | width: 16.6667%; | ||
83 | *width: 16.6357%; | ||
84 | } | ||
85 | |||
86 | .pure-u-sm-1-5 { | ||
87 | width: 20%; | ||
88 | *width: 19.9690%; | ||
89 | } | ||
90 | |||
91 | .pure-u-sm-5-24 { | ||
92 | width: 20.8333%; | ||
93 | *width: 20.8023%; | ||
94 | } | ||
95 | |||
96 | .pure-u-sm-1-4, | ||
97 | .pure-u-sm-6-24 { | ||
98 | width: 25%; | ||
99 | *width: 24.9690%; | ||
100 | } | ||
101 | |||
102 | .pure-u-sm-7-24 { | ||
103 | width: 29.1667%; | ||
104 | *width: 29.1357%; | ||
105 | } | ||
106 | |||
107 | .pure-u-sm-1-3, | ||
108 | .pure-u-sm-8-24 { | ||
109 | width: 33.3333%; | ||
110 | *width: 33.3023%; | ||
111 | } | ||
112 | |||
113 | .pure-u-sm-3-8, | ||
114 | .pure-u-sm-9-24 { | ||
115 | width: 37.5000%; | ||
116 | *width: 37.4690%; | ||
117 | } | ||
118 | |||
119 | .pure-u-sm-2-5 { | ||
120 | width: 40%; | ||
121 | *width: 39.9690%; | ||
122 | } | ||
123 | |||
124 | .pure-u-sm-5-12, | ||
125 | .pure-u-sm-10-24 { | ||
126 | width: 41.6667%; | ||
127 | *width: 41.6357%; | ||
128 | } | ||
129 | |||
130 | .pure-u-sm-11-24 { | ||
131 | width: 45.8333%; | ||
132 | *width: 45.8023%; | ||
133 | } | ||
134 | |||
135 | .pure-u-sm-1-2, | ||
136 | .pure-u-sm-12-24 { | ||
137 | width: 50%; | ||
138 | *width: 49.9690%; | ||
139 | } | ||
140 | |||
141 | .pure-u-sm-13-24 { | ||
142 | width: 54.1667%; | ||
143 | *width: 54.1357%; | ||
144 | } | ||
145 | |||
146 | .pure-u-sm-7-12, | ||
147 | .pure-u-sm-14-24 { | ||
148 | width: 58.3333%; | ||
149 | *width: 58.3023%; | ||
150 | } | ||
151 | |||
152 | .pure-u-sm-3-5 { | ||
153 | width: 60%; | ||
154 | *width: 59.9690%; | ||
155 | } | ||
156 | |||
157 | .pure-u-sm-5-8, | ||
158 | .pure-u-sm-15-24 { | ||
159 | width: 62.5000%; | ||
160 | *width: 62.4690%; | ||
161 | } | ||
162 | |||
163 | .pure-u-sm-2-3, | ||
164 | .pure-u-sm-16-24 { | ||
165 | width: 66.6667%; | ||
166 | *width: 66.6357%; | ||
167 | } | ||
168 | |||
169 | .pure-u-sm-17-24 { | ||
170 | width: 70.8333%; | ||
171 | *width: 70.8023%; | ||
172 | } | ||
173 | |||
174 | .pure-u-sm-3-4, | ||
175 | .pure-u-sm-18-24 { | ||
176 | width: 75%; | ||
177 | *width: 74.9690%; | ||
178 | } | ||
179 | |||
180 | .pure-u-sm-19-24 { | ||
181 | width: 79.1667%; | ||
182 | *width: 79.1357%; | ||
183 | } | ||
184 | |||
185 | .pure-u-sm-4-5 { | ||
186 | width: 80%; | ||
187 | *width: 79.9690%; | ||
188 | } | ||
189 | |||
190 | .pure-u-sm-5-6, | ||
191 | .pure-u-sm-20-24 { | ||
192 | width: 83.3333%; | ||
193 | *width: 83.3023%; | ||
194 | } | ||
195 | |||
196 | .pure-u-sm-7-8, | ||
197 | .pure-u-sm-21-24 { | ||
198 | width: 87.5000%; | ||
199 | *width: 87.4690%; | ||
200 | } | ||
201 | |||
202 | .pure-u-sm-11-12, | ||
203 | .pure-u-sm-22-24 { | ||
204 | width: 91.6667%; | ||
205 | *width: 91.6357%; | ||
206 | } | ||
207 | |||
208 | .pure-u-sm-23-24 { | ||
209 | width: 95.8333%; | ||
210 | *width: 95.8023%; | ||
211 | } | ||
212 | |||
213 | .pure-u-sm-1, | ||
214 | .pure-u-sm-1-1, | ||
215 | .pure-u-sm-5-5, | ||
216 | .pure-u-sm-24-24 { | ||
217 | width: 100%; | ||
218 | } | ||
219 | } | ||
220 | |||
221 | @media screen and (min-width: 48em) { | ||
222 | .pure-u-md-1, | ||
223 | .pure-u-md-1-1, | ||
224 | .pure-u-md-1-2, | ||
225 | .pure-u-md-1-3, | ||
226 | .pure-u-md-2-3, | ||
227 | .pure-u-md-1-4, | ||
228 | .pure-u-md-3-4, | ||
229 | .pure-u-md-1-5, | ||
230 | .pure-u-md-2-5, | ||
231 | .pure-u-md-3-5, | ||
232 | .pure-u-md-4-5, | ||
233 | .pure-u-md-5-5, | ||
234 | .pure-u-md-1-6, | ||
235 | .pure-u-md-5-6, | ||
236 | .pure-u-md-1-8, | ||
237 | .pure-u-md-3-8, | ||
238 | .pure-u-md-5-8, | ||
239 | .pure-u-md-7-8, | ||
240 | .pure-u-md-1-12, | ||
241 | .pure-u-md-5-12, | ||
242 | .pure-u-md-7-12, | ||
243 | .pure-u-md-11-12, | ||
244 | .pure-u-md-1-24, | ||
245 | .pure-u-md-2-24, | ||
246 | .pure-u-md-3-24, | ||
247 | .pure-u-md-4-24, | ||
248 | .pure-u-md-5-24, | ||
249 | .pure-u-md-6-24, | ||
250 | .pure-u-md-7-24, | ||
251 | .pure-u-md-8-24, | ||
252 | .pure-u-md-9-24, | ||
253 | .pure-u-md-10-24, | ||
254 | .pure-u-md-11-24, | ||
255 | .pure-u-md-12-24, | ||
256 | .pure-u-md-13-24, | ||
257 | .pure-u-md-14-24, | ||
258 | .pure-u-md-15-24, | ||
259 | .pure-u-md-16-24, | ||
260 | .pure-u-md-17-24, | ||
261 | .pure-u-md-18-24, | ||
262 | .pure-u-md-19-24, | ||
263 | .pure-u-md-20-24, | ||
264 | .pure-u-md-21-24, | ||
265 | .pure-u-md-22-24, | ||
266 | .pure-u-md-23-24, | ||
267 | .pure-u-md-24-24 { | ||
268 | display: inline-block; | ||
269 | *display: inline; | ||
270 | zoom: 1; | ||
271 | letter-spacing: normal; | ||
272 | word-spacing: normal; | ||
273 | vertical-align: top; | ||
274 | text-rendering: auto; | ||
275 | } | ||
276 | |||
277 | .pure-u-md-1-24 { | ||
278 | width: 4.1667%; | ||
279 | *width: 4.1357%; | ||
280 | } | ||
281 | |||
282 | .pure-u-md-1-12, | ||
283 | .pure-u-md-2-24 { | ||
284 | width: 8.3333%; | ||
285 | *width: 8.3023%; | ||
286 | } | ||
287 | |||
288 | .pure-u-md-1-8, | ||
289 | .pure-u-md-3-24 { | ||
290 | width: 12.5000%; | ||
291 | *width: 12.4690%; | ||
292 | } | ||
293 | |||
294 | .pure-u-md-1-6, | ||
295 | .pure-u-md-4-24 { | ||
296 | width: 16.6667%; | ||
297 | *width: 16.6357%; | ||
298 | } | ||
299 | |||
300 | .pure-u-md-1-5 { | ||
301 | width: 20%; | ||
302 | *width: 19.9690%; | ||
303 | } | ||
304 | |||
305 | .pure-u-md-5-24 { | ||
306 | width: 20.8333%; | ||
307 | *width: 20.8023%; | ||
308 | } | ||
309 | |||
310 | .pure-u-md-1-4, | ||
311 | .pure-u-md-6-24 { | ||
312 | width: 25%; | ||
313 | *width: 24.9690%; | ||
314 | } | ||
315 | |||
316 | .pure-u-md-7-24 { | ||
317 | width: 29.1667%; | ||
318 | *width: 29.1357%; | ||
319 | } | ||
320 | |||
321 | .pure-u-md-1-3, | ||
322 | .pure-u-md-8-24 { | ||
323 | width: 33.3333%; | ||
324 | *width: 33.3023%; | ||
325 | } | ||
326 | |||
327 | .pure-u-md-3-8, | ||
328 | .pure-u-md-9-24 { | ||
329 | width: 37.5000%; | ||
330 | *width: 37.4690%; | ||
331 | } | ||
332 | |||
333 | .pure-u-md-2-5 { | ||
334 | width: 40%; | ||
335 | *width: 39.9690%; | ||
336 | } | ||
337 | |||
338 | .pure-u-md-5-12, | ||
339 | .pure-u-md-10-24 { | ||
340 | width: 41.6667%; | ||
341 | *width: 41.6357%; | ||
342 | } | ||
343 | |||
344 | .pure-u-md-11-24 { | ||
345 | width: 45.8333%; | ||
346 | *width: 45.8023%; | ||
347 | } | ||
348 | |||
349 | .pure-u-md-1-2, | ||
350 | .pure-u-md-12-24 { | ||
351 | width: 50%; | ||
352 | *width: 49.9690%; | ||
353 | } | ||
354 | |||
355 | .pure-u-md-13-24 { | ||
356 | width: 54.1667%; | ||
357 | *width: 54.1357%; | ||
358 | } | ||
359 | |||
360 | .pure-u-md-7-12, | ||
361 | .pure-u-md-14-24 { | ||
362 | width: 58.3333%; | ||
363 | *width: 58.3023%; | ||
364 | } | ||
365 | |||
366 | .pure-u-md-3-5 { | ||
367 | width: 60%; | ||
368 | *width: 59.9690%; | ||
369 | } | ||
370 | |||
371 | .pure-u-md-5-8, | ||
372 | .pure-u-md-15-24 { | ||
373 | width: 62.5000%; | ||
374 | *width: 62.4690%; | ||
375 | } | ||
376 | |||
377 | .pure-u-md-2-3, | ||
378 | .pure-u-md-16-24 { | ||
379 | width: 66.6667%; | ||
380 | *width: 66.6357%; | ||
381 | } | ||
382 | |||
383 | .pure-u-md-17-24 { | ||
384 | width: 70.8333%; | ||
385 | *width: 70.8023%; | ||
386 | } | ||
387 | |||
388 | .pure-u-md-3-4, | ||
389 | .pure-u-md-18-24 { | ||
390 | width: 75%; | ||
391 | *width: 74.9690%; | ||
392 | } | ||
393 | |||
394 | .pure-u-md-19-24 { | ||
395 | width: 79.1667%; | ||
396 | *width: 79.1357%; | ||
397 | } | ||
398 | |||
399 | .pure-u-md-4-5 { | ||
400 | width: 80%; | ||
401 | *width: 79.9690%; | ||
402 | } | ||
403 | |||
404 | .pure-u-md-5-6, | ||
405 | .pure-u-md-20-24 { | ||
406 | width: 83.3333%; | ||
407 | *width: 83.3023%; | ||
408 | } | ||
409 | |||
410 | .pure-u-md-7-8, | ||
411 | .pure-u-md-21-24 { | ||
412 | width: 87.5000%; | ||
413 | *width: 87.4690%; | ||
414 | } | ||
415 | |||
416 | .pure-u-md-11-12, | ||
417 | .pure-u-md-22-24 { | ||
418 | width: 91.6667%; | ||
419 | *width: 91.6357%; | ||
420 | } | ||
421 | |||
422 | .pure-u-md-23-24 { | ||
423 | width: 95.8333%; | ||
424 | *width: 95.8023%; | ||
425 | } | ||
426 | |||
427 | .pure-u-md-1, | ||
428 | .pure-u-md-1-1, | ||
429 | .pure-u-md-5-5, | ||
430 | .pure-u-md-24-24 { | ||
431 | width: 100%; | ||
432 | } | ||
433 | } | ||
434 | |||
435 | @media screen and (min-width: 64em) { | ||
436 | .pure-u-lg-1, | ||
437 | .pure-u-lg-1-1, | ||
438 | .pure-u-lg-1-2, | ||
439 | .pure-u-lg-1-3, | ||
440 | .pure-u-lg-2-3, | ||
441 | .pure-u-lg-1-4, | ||
442 | .pure-u-lg-3-4, | ||
443 | .pure-u-lg-1-5, | ||
444 | .pure-u-lg-2-5, | ||
445 | .pure-u-lg-3-5, | ||
446 | .pure-u-lg-4-5, | ||
447 | .pure-u-lg-5-5, | ||
448 | .pure-u-lg-1-6, | ||
449 | .pure-u-lg-5-6, | ||
450 | .pure-u-lg-1-8, | ||
451 | .pure-u-lg-3-8, | ||
452 | .pure-u-lg-5-8, | ||
453 | .pure-u-lg-7-8, | ||
454 | .pure-u-lg-1-12, | ||
455 | .pure-u-lg-5-12, | ||
456 | .pure-u-lg-7-12, | ||
457 | .pure-u-lg-11-12, | ||
458 | .pure-u-lg-1-24, | ||
459 | .pure-u-lg-2-24, | ||
460 | .pure-u-lg-3-24, | ||
461 | .pure-u-lg-4-24, | ||
462 | .pure-u-lg-5-24, | ||
463 | .pure-u-lg-6-24, | ||
464 | .pure-u-lg-7-24, | ||
465 | .pure-u-lg-8-24, | ||
466 | .pure-u-lg-9-24, | ||
467 | .pure-u-lg-10-24, | ||
468 | .pure-u-lg-11-24, | ||
469 | .pure-u-lg-12-24, | ||
470 | .pure-u-lg-13-24, | ||
471 | .pure-u-lg-14-24, | ||
472 | .pure-u-lg-15-24, | ||
473 | .pure-u-lg-16-24, | ||
474 | .pure-u-lg-17-24, | ||
475 | .pure-u-lg-18-24, | ||
476 | .pure-u-lg-19-24, | ||
477 | .pure-u-lg-20-24, | ||
478 | .pure-u-lg-21-24, | ||
479 | .pure-u-lg-22-24, | ||
480 | .pure-u-lg-23-24, | ||
481 | .pure-u-lg-24-24 { | ||
482 | display: inline-block; | ||
483 | *display: inline; | ||
484 | zoom: 1; | ||
485 | letter-spacing: normal; | ||
486 | word-spacing: normal; | ||
487 | vertical-align: top; | ||
488 | text-rendering: auto; | ||
489 | } | ||
490 | |||
491 | .pure-u-lg-1-24 { | ||
492 | width: 4.1667%; | ||
493 | *width: 4.1357%; | ||
494 | } | ||
495 | |||
496 | .pure-u-lg-1-12, | ||
497 | .pure-u-lg-2-24 { | ||
498 | width: 8.3333%; | ||
499 | *width: 8.3023%; | ||
500 | } | ||
501 | |||
502 | .pure-u-lg-1-8, | ||
503 | .pure-u-lg-3-24 { | ||
504 | width: 12.5000%; | ||
505 | *width: 12.4690%; | ||
506 | } | ||
507 | |||
508 | .pure-u-lg-1-6, | ||
509 | .pure-u-lg-4-24 { | ||
510 | width: 16.6667%; | ||
511 | *width: 16.6357%; | ||
512 | } | ||
513 | |||
514 | .pure-u-lg-1-5 { | ||
515 | width: 20%; | ||
516 | *width: 19.9690%; | ||
517 | } | ||
518 | |||
519 | .pure-u-lg-5-24 { | ||
520 | width: 20.8333%; | ||
521 | *width: 20.8023%; | ||
522 | } | ||
523 | |||
524 | .pure-u-lg-1-4, | ||
525 | .pure-u-lg-6-24 { | ||
526 | width: 25%; | ||
527 | *width: 24.9690%; | ||
528 | } | ||
529 | |||
530 | .pure-u-lg-7-24 { | ||
531 | width: 29.1667%; | ||
532 | *width: 29.1357%; | ||
533 | } | ||
534 | |||
535 | .pure-u-lg-1-3, | ||
536 | .pure-u-lg-8-24 { | ||
537 | width: 33.3333%; | ||
538 | *width: 33.3023%; | ||
539 | } | ||
540 | |||
541 | .pure-u-lg-3-8, | ||
542 | .pure-u-lg-9-24 { | ||
543 | width: 37.5000%; | ||
544 | *width: 37.4690%; | ||
545 | } | ||
546 | |||
547 | .pure-u-lg-2-5 { | ||
548 | width: 40%; | ||
549 | *width: 39.9690%; | ||
550 | } | ||
551 | |||
552 | .pure-u-lg-5-12, | ||
553 | .pure-u-lg-10-24 { | ||
554 | width: 41.6667%; | ||
555 | *width: 41.6357%; | ||
556 | } | ||
557 | |||
558 | .pure-u-lg-11-24 { | ||
559 | width: 45.8333%; | ||
560 | *width: 45.8023%; | ||
561 | } | ||
562 | |||
563 | .pure-u-lg-1-2, | ||
564 | .pure-u-lg-12-24 { | ||
565 | width: 50%; | ||
566 | *width: 49.9690%; | ||
567 | } | ||
568 | |||
569 | .pure-u-lg-13-24 { | ||
570 | width: 54.1667%; | ||
571 | *width: 54.1357%; | ||
572 | } | ||
573 | |||
574 | .pure-u-lg-7-12, | ||
575 | .pure-u-lg-14-24 { | ||
576 | width: 58.3333%; | ||
577 | *width: 58.3023%; | ||
578 | } | ||
579 | |||
580 | .pure-u-lg-3-5 { | ||
581 | width: 60%; | ||
582 | *width: 59.9690%; | ||
583 | } | ||
584 | |||
585 | .pure-u-lg-5-8, | ||
586 | .pure-u-lg-15-24 { | ||
587 | width: 62.5000%; | ||
588 | *width: 62.4690%; | ||
589 | } | ||
590 | |||
591 | .pure-u-lg-2-3, | ||
592 | .pure-u-lg-16-24 { | ||
593 | width: 66.6667%; | ||
594 | *width: 66.6357%; | ||
595 | } | ||
596 | |||
597 | .pure-u-lg-17-24 { | ||
598 | width: 70.8333%; | ||
599 | *width: 70.8023%; | ||
600 | } | ||
601 | |||
602 | .pure-u-lg-3-4, | ||
603 | .pure-u-lg-18-24 { | ||
604 | width: 75%; | ||
605 | *width: 74.9690%; | ||
606 | } | ||
607 | |||
608 | .pure-u-lg-19-24 { | ||
609 | width: 79.1667%; | ||
610 | *width: 79.1357%; | ||
611 | } | ||
612 | |||
613 | .pure-u-lg-4-5 { | ||
614 | width: 80%; | ||
615 | *width: 79.9690%; | ||
616 | } | ||
617 | |||
618 | .pure-u-lg-5-6, | ||
619 | .pure-u-lg-20-24 { | ||
620 | width: 83.3333%; | ||
621 | *width: 83.3023%; | ||
622 | } | ||
623 | |||
624 | .pure-u-lg-7-8, | ||
625 | .pure-u-lg-21-24 { | ||
626 | width: 87.5000%; | ||
627 | *width: 87.4690%; | ||
628 | } | ||
629 | |||
630 | .pure-u-lg-11-12, | ||
631 | .pure-u-lg-22-24 { | ||
632 | width: 91.6667%; | ||
633 | *width: 91.6357%; | ||
634 | } | ||
635 | |||
636 | .pure-u-lg-23-24 { | ||
637 | width: 95.8333%; | ||
638 | *width: 95.8023%; | ||
639 | } | ||
640 | |||
641 | .pure-u-lg-1, | ||
642 | .pure-u-lg-1-1, | ||
643 | .pure-u-lg-5-5, | ||
644 | .pure-u-lg-24-24 { | ||
645 | width: 100%; | ||
646 | } | ||
647 | } | ||
648 | |||
649 | @media screen and (min-width: 80em) { | ||
650 | .pure-u-xl-1, | ||
651 | .pure-u-xl-1-1, | ||
652 | .pure-u-xl-1-2, | ||
653 | .pure-u-xl-1-3, | ||
654 | .pure-u-xl-2-3, | ||
655 | .pure-u-xl-1-4, | ||
656 | .pure-u-xl-3-4, | ||
657 | .pure-u-xl-1-5, | ||
658 | .pure-u-xl-2-5, | ||
659 | .pure-u-xl-3-5, | ||
660 | .pure-u-xl-4-5, | ||
661 | .pure-u-xl-5-5, | ||
662 | .pure-u-xl-1-6, | ||
663 | .pure-u-xl-5-6, | ||
664 | .pure-u-xl-1-8, | ||
665 | .pure-u-xl-3-8, | ||
666 | .pure-u-xl-5-8, | ||
667 | .pure-u-xl-7-8, | ||
668 | .pure-u-xl-1-12, | ||
669 | .pure-u-xl-5-12, | ||
670 | .pure-u-xl-7-12, | ||
671 | .pure-u-xl-11-12, | ||
672 | .pure-u-xl-1-24, | ||
673 | .pure-u-xl-2-24, | ||
674 | .pure-u-xl-3-24, | ||
675 | .pure-u-xl-4-24, | ||
676 | .pure-u-xl-5-24, | ||
677 | .pure-u-xl-6-24, | ||
678 | .pure-u-xl-7-24, | ||
679 | .pure-u-xl-8-24, | ||
680 | .pure-u-xl-9-24, | ||
681 | .pure-u-xl-10-24, | ||
682 | .pure-u-xl-11-24, | ||
683 | .pure-u-xl-12-24, | ||
684 | .pure-u-xl-13-24, | ||
685 | .pure-u-xl-14-24, | ||
686 | .pure-u-xl-15-24, | ||
687 | .pure-u-xl-16-24, | ||
688 | .pure-u-xl-17-24, | ||
689 | .pure-u-xl-18-24, | ||
690 | .pure-u-xl-19-24, | ||
691 | .pure-u-xl-20-24, | ||
692 | .pure-u-xl-21-24, | ||
693 | .pure-u-xl-22-24, | ||
694 | .pure-u-xl-23-24, | ||
695 | .pure-u-xl-24-24 { | ||
696 | display: inline-block; | ||
697 | *display: inline; | ||
698 | zoom: 1; | ||
699 | letter-spacing: normal; | ||
700 | word-spacing: normal; | ||
701 | vertical-align: top; | ||
702 | text-rendering: auto; | ||
703 | } | ||
704 | |||
705 | .pure-u-xl-1-24 { | ||
706 | width: 4.1667%; | ||
707 | *width: 4.1357%; | ||
708 | } | ||
709 | |||
710 | .pure-u-xl-1-12, | ||
711 | .pure-u-xl-2-24 { | ||
712 | width: 8.3333%; | ||
713 | *width: 8.3023%; | ||
714 | } | ||
715 | |||
716 | .pure-u-xl-1-8, | ||
717 | .pure-u-xl-3-24 { | ||
718 | width: 12.5000%; | ||
719 | *width: 12.4690%; | ||
720 | } | ||
721 | |||
722 | .pure-u-xl-1-6, | ||
723 | .pure-u-xl-4-24 { | ||
724 | width: 16.6667%; | ||
725 | *width: 16.6357%; | ||
726 | } | ||
727 | |||
728 | .pure-u-xl-1-5 { | ||
729 | width: 20%; | ||
730 | *width: 19.9690%; | ||
731 | } | ||
732 | |||
733 | .pure-u-xl-5-24 { | ||
734 | width: 20.8333%; | ||
735 | *width: 20.8023%; | ||
736 | } | ||
737 | |||
738 | .pure-u-xl-1-4, | ||
739 | .pure-u-xl-6-24 { | ||
740 | width: 25%; | ||
741 | *width: 24.9690%; | ||
742 | } | ||
743 | |||
744 | .pure-u-xl-7-24 { | ||
745 | width: 29.1667%; | ||
746 | *width: 29.1357%; | ||
747 | } | ||
748 | |||
749 | .pure-u-xl-1-3, | ||
750 | .pure-u-xl-8-24 { | ||
751 | width: 33.3333%; | ||
752 | *width: 33.3023%; | ||
753 | } | ||
754 | |||
755 | .pure-u-xl-3-8, | ||
756 | .pure-u-xl-9-24 { | ||
757 | width: 37.5000%; | ||
758 | *width: 37.4690%; | ||
759 | } | ||
760 | |||
761 | .pure-u-xl-2-5 { | ||
762 | width: 40%; | ||
763 | *width: 39.9690%; | ||
764 | } | ||
765 | |||
766 | .pure-u-xl-5-12, | ||
767 | .pure-u-xl-10-24 { | ||
768 | width: 41.6667%; | ||
769 | *width: 41.6357%; | ||
770 | } | ||
771 | |||
772 | .pure-u-xl-11-24 { | ||
773 | width: 45.8333%; | ||
774 | *width: 45.8023%; | ||
775 | } | ||
776 | |||
777 | .pure-u-xl-1-2, | ||
778 | .pure-u-xl-12-24 { | ||
779 | width: 50%; | ||
780 | *width: 49.9690%; | ||
781 | } | ||
782 | |||
783 | .pure-u-xl-13-24 { | ||
784 | width: 54.1667%; | ||
785 | *width: 54.1357%; | ||
786 | } | ||
787 | |||
788 | .pure-u-xl-7-12, | ||
789 | .pure-u-xl-14-24 { | ||
790 | width: 58.3333%; | ||
791 | *width: 58.3023%; | ||
792 | } | ||
793 | |||
794 | .pure-u-xl-3-5 { | ||
795 | width: 60%; | ||
796 | *width: 59.9690%; | ||
797 | } | ||
798 | |||
799 | .pure-u-xl-5-8, | ||
800 | .pure-u-xl-15-24 { | ||
801 | width: 62.5000%; | ||
802 | *width: 62.4690%; | ||
803 | } | ||
804 | |||
805 | .pure-u-xl-2-3, | ||
806 | .pure-u-xl-16-24 { | ||
807 | width: 66.6667%; | ||
808 | *width: 66.6357%; | ||
809 | } | ||
810 | |||
811 | .pure-u-xl-17-24 { | ||
812 | width: 70.8333%; | ||
813 | *width: 70.8023%; | ||
814 | } | ||
815 | |||
816 | .pure-u-xl-3-4, | ||
817 | .pure-u-xl-18-24 { | ||
818 | width: 75%; | ||
819 | *width: 74.9690%; | ||
820 | } | ||
821 | |||
822 | .pure-u-xl-19-24 { | ||
823 | width: 79.1667%; | ||
824 | *width: 79.1357%; | ||
825 | } | ||
826 | |||
827 | .pure-u-xl-4-5 { | ||
828 | width: 80%; | ||
829 | *width: 79.9690%; | ||
830 | } | ||
831 | |||
832 | .pure-u-xl-5-6, | ||
833 | .pure-u-xl-20-24 { | ||
834 | width: 83.3333%; | ||
835 | *width: 83.3023%; | ||
836 | } | ||
837 | |||
838 | .pure-u-xl-7-8, | ||
839 | .pure-u-xl-21-24 { | ||
840 | width: 87.5000%; | ||
841 | *width: 87.4690%; | ||
842 | } | ||
843 | |||
844 | .pure-u-xl-11-12, | ||
845 | .pure-u-xl-22-24 { | ||
846 | width: 91.6667%; | ||
847 | *width: 91.6357%; | ||
848 | } | ||
849 | |||
850 | .pure-u-xl-23-24 { | ||
851 | width: 95.8333%; | ||
852 | *width: 95.8023%; | ||
853 | } | ||
854 | |||
855 | .pure-u-xl-1, | ||
856 | .pure-u-xl-1-1, | ||
857 | .pure-u-xl-5-5, | ||
858 | .pure-u-xl-24-24 { | ||
859 | width: 100%; | ||
860 | } | ||
861 | } \ No newline at end of file | ||
diff --git a/tpl/default/css/grids-responsive.min.css b/tpl/default/css/grids-responsive.min.css new file mode 100644 index 00000000..1df05db8 --- /dev/null +++ b/tpl/default/css/grids-responsive.min.css | |||
@@ -0,0 +1,7 @@ | |||
1 | /*! | ||
2 | Pure v0.6.0 | ||
3 | Copyright 2014 Yahoo! Inc. All rights reserved. | ||
4 | Licensed under the BSD License. | ||
5 | https://github.com/yahoo/pure/blob/master/LICENSE.md | ||
6 | */ | ||
7 | @media screen and (min-width:35.5em){.pure-u-sm-1,.pure-u-sm-1-1,.pure-u-sm-1-2,.pure-u-sm-1-3,.pure-u-sm-2-3,.pure-u-sm-1-4,.pure-u-sm-3-4,.pure-u-sm-1-5,.pure-u-sm-2-5,.pure-u-sm-3-5,.pure-u-sm-4-5,.pure-u-sm-5-5,.pure-u-sm-1-6,.pure-u-sm-5-6,.pure-u-sm-1-8,.pure-u-sm-3-8,.pure-u-sm-5-8,.pure-u-sm-7-8,.pure-u-sm-1-12,.pure-u-sm-5-12,.pure-u-sm-7-12,.pure-u-sm-11-12,.pure-u-sm-1-24,.pure-u-sm-2-24,.pure-u-sm-3-24,.pure-u-sm-4-24,.pure-u-sm-5-24,.pure-u-sm-6-24,.pure-u-sm-7-24,.pure-u-sm-8-24,.pure-u-sm-9-24,.pure-u-sm-10-24,.pure-u-sm-11-24,.pure-u-sm-12-24,.pure-u-sm-13-24,.pure-u-sm-14-24,.pure-u-sm-15-24,.pure-u-sm-16-24,.pure-u-sm-17-24,.pure-u-sm-18-24,.pure-u-sm-19-24,.pure-u-sm-20-24,.pure-u-sm-21-24,.pure-u-sm-22-24,.pure-u-sm-23-24,.pure-u-sm-24-24{display:inline-block;*display:inline;zoom:1;letter-spacing:normal;word-spacing:normal;vertical-align:top;text-rendering:auto}.pure-u-sm-1-24{width:4.1667%;*width:4.1357%}.pure-u-sm-1-12,.pure-u-sm-2-24{width:8.3333%;*width:8.3023%}.pure-u-sm-1-8,.pure-u-sm-3-24{width:12.5%;*width:12.469%}.pure-u-sm-1-6,.pure-u-sm-4-24{width:16.6667%;*width:16.6357%}.pure-u-sm-1-5{width:20%;*width:19.969%}.pure-u-sm-5-24{width:20.8333%;*width:20.8023%}.pure-u-sm-1-4,.pure-u-sm-6-24{width:25%;*width:24.969%}.pure-u-sm-7-24{width:29.1667%;*width:29.1357%}.pure-u-sm-1-3,.pure-u-sm-8-24{width:33.3333%;*width:33.3023%}.pure-u-sm-3-8,.pure-u-sm-9-24{width:37.5%;*width:37.469%}.pure-u-sm-2-5{width:40%;*width:39.969%}.pure-u-sm-5-12,.pure-u-sm-10-24{width:41.6667%;*width:41.6357%}.pure-u-sm-11-24{width:45.8333%;*width:45.8023%}.pure-u-sm-1-2,.pure-u-sm-12-24{width:50%;*width:49.969%}.pure-u-sm-13-24{width:54.1667%;*width:54.1357%}.pure-u-sm-7-12,.pure-u-sm-14-24{width:58.3333%;*width:58.3023%}.pure-u-sm-3-5{width:60%;*width:59.969%}.pure-u-sm-5-8,.pure-u-sm-15-24{width:62.5%;*width:62.469%}.pure-u-sm-2-3,.pure-u-sm-16-24{width:66.6667%;*width:66.6357%}.pure-u-sm-17-24{width:70.8333%;*width:70.8023%}.pure-u-sm-3-4,.pure-u-sm-18-24{width:75%;*width:74.969%}.pure-u-sm-19-24{width:79.1667%;*width:79.1357%}.pure-u-sm-4-5{width:80%;*width:79.969%}.pure-u-sm-5-6,.pure-u-sm-20-24{width:83.3333%;*width:83.3023%}.pure-u-sm-7-8,.pure-u-sm-21-24{width:87.5%;*width:87.469%}.pure-u-sm-11-12,.pure-u-sm-22-24{width:91.6667%;*width:91.6357%}.pure-u-sm-23-24{width:95.8333%;*width:95.8023%}.pure-u-sm-1,.pure-u-sm-1-1,.pure-u-sm-5-5,.pure-u-sm-24-24{width:100%}}@media screen and (min-width:48em){.pure-u-md-1,.pure-u-md-1-1,.pure-u-md-1-2,.pure-u-md-1-3,.pure-u-md-2-3,.pure-u-md-1-4,.pure-u-md-3-4,.pure-u-md-1-5,.pure-u-md-2-5,.pure-u-md-3-5,.pure-u-md-4-5,.pure-u-md-5-5,.pure-u-md-1-6,.pure-u-md-5-6,.pure-u-md-1-8,.pure-u-md-3-8,.pure-u-md-5-8,.pure-u-md-7-8,.pure-u-md-1-12,.pure-u-md-5-12,.pure-u-md-7-12,.pure-u-md-11-12,.pure-u-md-1-24,.pure-u-md-2-24,.pure-u-md-3-24,.pure-u-md-4-24,.pure-u-md-5-24,.pure-u-md-6-24,.pure-u-md-7-24,.pure-u-md-8-24,.pure-u-md-9-24,.pure-u-md-10-24,.pure-u-md-11-24,.pure-u-md-12-24,.pure-u-md-13-24,.pure-u-md-14-24,.pure-u-md-15-24,.pure-u-md-16-24,.pure-u-md-17-24,.pure-u-md-18-24,.pure-u-md-19-24,.pure-u-md-20-24,.pure-u-md-21-24,.pure-u-md-22-24,.pure-u-md-23-24,.pure-u-md-24-24{display:inline-block;*display:inline;zoom:1;letter-spacing:normal;word-spacing:normal;vertical-align:top;text-rendering:auto}.pure-u-md-1-24{width:4.1667%;*width:4.1357%}.pure-u-md-1-12,.pure-u-md-2-24{width:8.3333%;*width:8.3023%}.pure-u-md-1-8,.pure-u-md-3-24{width:12.5%;*width:12.469%}.pure-u-md-1-6,.pure-u-md-4-24{width:16.6667%;*width:16.6357%}.pure-u-md-1-5{width:20%;*width:19.969%}.pure-u-md-5-24{width:20.8333%;*width:20.8023%}.pure-u-md-1-4,.pure-u-md-6-24{width:25%;*width:24.969%}.pure-u-md-7-24{width:29.1667%;*width:29.1357%}.pure-u-md-1-3,.pure-u-md-8-24{width:33.3333%;*width:33.3023%}.pure-u-md-3-8,.pure-u-md-9-24{width:37.5%;*width:37.469%}.pure-u-md-2-5{width:40%;*width:39.969%}.pure-u-md-5-12,.pure-u-md-10-24{width:41.6667%;*width:41.6357%}.pure-u-md-11-24{width:45.8333%;*width:45.8023%}.pure-u-md-1-2,.pure-u-md-12-24{width:50%;*width:49.969%}.pure-u-md-13-24{width:54.1667%;*width:54.1357%}.pure-u-md-7-12,.pure-u-md-14-24{width:58.3333%;*width:58.3023%}.pure-u-md-3-5{width:60%;*width:59.969%}.pure-u-md-5-8,.pure-u-md-15-24{width:62.5%;*width:62.469%}.pure-u-md-2-3,.pure-u-md-16-24{width:66.6667%;*width:66.6357%}.pure-u-md-17-24{width:70.8333%;*width:70.8023%}.pure-u-md-3-4,.pure-u-md-18-24{width:75%;*width:74.969%}.pure-u-md-19-24{width:79.1667%;*width:79.1357%}.pure-u-md-4-5{width:80%;*width:79.969%}.pure-u-md-5-6,.pure-u-md-20-24{width:83.3333%;*width:83.3023%}.pure-u-md-7-8,.pure-u-md-21-24{width:87.5%;*width:87.469%}.pure-u-md-11-12,.pure-u-md-22-24{width:91.6667%;*width:91.6357%}.pure-u-md-23-24{width:95.8333%;*width:95.8023%}.pure-u-md-1,.pure-u-md-1-1,.pure-u-md-5-5,.pure-u-md-24-24{width:100%}}@media screen and (min-width:64em){.pure-u-lg-1,.pure-u-lg-1-1,.pure-u-lg-1-2,.pure-u-lg-1-3,.pure-u-lg-2-3,.pure-u-lg-1-4,.pure-u-lg-3-4,.pure-u-lg-1-5,.pure-u-lg-2-5,.pure-u-lg-3-5,.pure-u-lg-4-5,.pure-u-lg-5-5,.pure-u-lg-1-6,.pure-u-lg-5-6,.pure-u-lg-1-8,.pure-u-lg-3-8,.pure-u-lg-5-8,.pure-u-lg-7-8,.pure-u-lg-1-12,.pure-u-lg-5-12,.pure-u-lg-7-12,.pure-u-lg-11-12,.pure-u-lg-1-24,.pure-u-lg-2-24,.pure-u-lg-3-24,.pure-u-lg-4-24,.pure-u-lg-5-24,.pure-u-lg-6-24,.pure-u-lg-7-24,.pure-u-lg-8-24,.pure-u-lg-9-24,.pure-u-lg-10-24,.pure-u-lg-11-24,.pure-u-lg-12-24,.pure-u-lg-13-24,.pure-u-lg-14-24,.pure-u-lg-15-24,.pure-u-lg-16-24,.pure-u-lg-17-24,.pure-u-lg-18-24,.pure-u-lg-19-24,.pure-u-lg-20-24,.pure-u-lg-21-24,.pure-u-lg-22-24,.pure-u-lg-23-24,.pure-u-lg-24-24{display:inline-block;*display:inline;zoom:1;letter-spacing:normal;word-spacing:normal;vertical-align:top;text-rendering:auto}.pure-u-lg-1-24{width:4.1667%;*width:4.1357%}.pure-u-lg-1-12,.pure-u-lg-2-24{width:8.3333%;*width:8.3023%}.pure-u-lg-1-8,.pure-u-lg-3-24{width:12.5%;*width:12.469%}.pure-u-lg-1-6,.pure-u-lg-4-24{width:16.6667%;*width:16.6357%}.pure-u-lg-1-5{width:20%;*width:19.969%}.pure-u-lg-5-24{width:20.8333%;*width:20.8023%}.pure-u-lg-1-4,.pure-u-lg-6-24{width:25%;*width:24.969%}.pure-u-lg-7-24{width:29.1667%;*width:29.1357%}.pure-u-lg-1-3,.pure-u-lg-8-24{width:33.3333%;*width:33.3023%}.pure-u-lg-3-8,.pure-u-lg-9-24{width:37.5%;*width:37.469%}.pure-u-lg-2-5{width:40%;*width:39.969%}.pure-u-lg-5-12,.pure-u-lg-10-24{width:41.6667%;*width:41.6357%}.pure-u-lg-11-24{width:45.8333%;*width:45.8023%}.pure-u-lg-1-2,.pure-u-lg-12-24{width:50%;*width:49.969%}.pure-u-lg-13-24{width:54.1667%;*width:54.1357%}.pure-u-lg-7-12,.pure-u-lg-14-24{width:58.3333%;*width:58.3023%}.pure-u-lg-3-5{width:60%;*width:59.969%}.pure-u-lg-5-8,.pure-u-lg-15-24{width:62.5%;*width:62.469%}.pure-u-lg-2-3,.pure-u-lg-16-24{width:66.6667%;*width:66.6357%}.pure-u-lg-17-24{width:70.8333%;*width:70.8023%}.pure-u-lg-3-4,.pure-u-lg-18-24{width:75%;*width:74.969%}.pure-u-lg-19-24{width:79.1667%;*width:79.1357%}.pure-u-lg-4-5{width:80%;*width:79.969%}.pure-u-lg-5-6,.pure-u-lg-20-24{width:83.3333%;*width:83.3023%}.pure-u-lg-7-8,.pure-u-lg-21-24{width:87.5%;*width:87.469%}.pure-u-lg-11-12,.pure-u-lg-22-24{width:91.6667%;*width:91.6357%}.pure-u-lg-23-24{width:95.8333%;*width:95.8023%}.pure-u-lg-1,.pure-u-lg-1-1,.pure-u-lg-5-5,.pure-u-lg-24-24{width:100%}}@media screen and (min-width:80em){.pure-u-xl-1,.pure-u-xl-1-1,.pure-u-xl-1-2,.pure-u-xl-1-3,.pure-u-xl-2-3,.pure-u-xl-1-4,.pure-u-xl-3-4,.pure-u-xl-1-5,.pure-u-xl-2-5,.pure-u-xl-3-5,.pure-u-xl-4-5,.pure-u-xl-5-5,.pure-u-xl-1-6,.pure-u-xl-5-6,.pure-u-xl-1-8,.pure-u-xl-3-8,.pure-u-xl-5-8,.pure-u-xl-7-8,.pure-u-xl-1-12,.pure-u-xl-5-12,.pure-u-xl-7-12,.pure-u-xl-11-12,.pure-u-xl-1-24,.pure-u-xl-2-24,.pure-u-xl-3-24,.pure-u-xl-4-24,.pure-u-xl-5-24,.pure-u-xl-6-24,.pure-u-xl-7-24,.pure-u-xl-8-24,.pure-u-xl-9-24,.pure-u-xl-10-24,.pure-u-xl-11-24,.pure-u-xl-12-24,.pure-u-xl-13-24,.pure-u-xl-14-24,.pure-u-xl-15-24,.pure-u-xl-16-24,.pure-u-xl-17-24,.pure-u-xl-18-24,.pure-u-xl-19-24,.pure-u-xl-20-24,.pure-u-xl-21-24,.pure-u-xl-22-24,.pure-u-xl-23-24,.pure-u-xl-24-24{display:inline-block;*display:inline;zoom:1;letter-spacing:normal;word-spacing:normal;vertical-align:top;text-rendering:auto}.pure-u-xl-1-24{width:4.1667%;*width:4.1357%}.pure-u-xl-1-12,.pure-u-xl-2-24{width:8.3333%;*width:8.3023%}.pure-u-xl-1-8,.pure-u-xl-3-24{width:12.5%;*width:12.469%}.pure-u-xl-1-6,.pure-u-xl-4-24{width:16.6667%;*width:16.6357%}.pure-u-xl-1-5{width:20%;*width:19.969%}.pure-u-xl-5-24{width:20.8333%;*width:20.8023%}.pure-u-xl-1-4,.pure-u-xl-6-24{width:25%;*width:24.969%}.pure-u-xl-7-24{width:29.1667%;*width:29.1357%}.pure-u-xl-1-3,.pure-u-xl-8-24{width:33.3333%;*width:33.3023%}.pure-u-xl-3-8,.pure-u-xl-9-24{width:37.5%;*width:37.469%}.pure-u-xl-2-5{width:40%;*width:39.969%}.pure-u-xl-5-12,.pure-u-xl-10-24{width:41.6667%;*width:41.6357%}.pure-u-xl-11-24{width:45.8333%;*width:45.8023%}.pure-u-xl-1-2,.pure-u-xl-12-24{width:50%;*width:49.969%}.pure-u-xl-13-24{width:54.1667%;*width:54.1357%}.pure-u-xl-7-12,.pure-u-xl-14-24{width:58.3333%;*width:58.3023%}.pure-u-xl-3-5{width:60%;*width:59.969%}.pure-u-xl-5-8,.pure-u-xl-15-24{width:62.5%;*width:62.469%}.pure-u-xl-2-3,.pure-u-xl-16-24{width:66.6667%;*width:66.6357%}.pure-u-xl-17-24{width:70.8333%;*width:70.8023%}.pure-u-xl-3-4,.pure-u-xl-18-24{width:75%;*width:74.969%}.pure-u-xl-19-24{width:79.1667%;*width:79.1357%}.pure-u-xl-4-5{width:80%;*width:79.969%}.pure-u-xl-5-6,.pure-u-xl-20-24{width:83.3333%;*width:83.3023%}.pure-u-xl-7-8,.pure-u-xl-21-24{width:87.5%;*width:87.469%}.pure-u-xl-11-12,.pure-u-xl-22-24{width:91.6667%;*width:91.6357%}.pure-u-xl-23-24{width:95.8333%;*width:95.8023%}.pure-u-xl-1,.pure-u-xl-1-1,.pure-u-xl-5-5,.pure-u-xl-24-24{width:100%}} \ No newline at end of file | ||
diff --git a/tpl/default/css/pure.css b/tpl/default/css/pure.css new file mode 100644 index 00000000..a07d74cf --- /dev/null +++ b/tpl/default/css/pure.css | |||
@@ -0,0 +1,1475 @@ | |||
1 | /*! | ||
2 | Pure v0.6.0 | ||
3 | Copyright 2014 Yahoo! Inc. All rights reserved. | ||
4 | Licensed under the BSD License. | ||
5 | https://github.com/yahoo/pure/blob/master/LICENSE.md | ||
6 | */ | ||
7 | /*! | ||
8 | normalize.css v^3.0 | MIT License | git.io/normalize | ||
9 | Copyright (c) Nicolas Gallagher and Jonathan Neal | ||
10 | */ | ||
11 | /*! normalize.css v3.0.2 | MIT License | git.io/normalize */ | ||
12 | |||
13 | /** | ||
14 | * 1. Set default font family to sans-serif. | ||
15 | * 2. Prevent iOS text size adjust after orientation change, without disabling | ||
16 | * user zoom. | ||
17 | */ | ||
18 | |||
19 | html { | ||
20 | font-family: sans-serif; /* 1 */ | ||
21 | -ms-text-size-adjust: 100%; /* 2 */ | ||
22 | -webkit-text-size-adjust: 100%; /* 2 */ | ||
23 | } | ||
24 | |||
25 | /** | ||
26 | * Remove default margin. | ||
27 | */ | ||
28 | |||
29 | body { | ||
30 | margin: 0; | ||
31 | } | ||
32 | |||
33 | /* HTML5 display definitions | ||
34 | ========================================================================== */ | ||
35 | |||
36 | /** | ||
37 | * Correct `block` display not defined for any HTML5 element in IE 8/9. | ||
38 | * Correct `block` display not defined for `details` or `summary` in IE 10/11 | ||
39 | * and Firefox. | ||
40 | * Correct `block` display not defined for `main` in IE 11. | ||
41 | */ | ||
42 | |||
43 | article, | ||
44 | aside, | ||
45 | details, | ||
46 | figcaption, | ||
47 | figure, | ||
48 | footer, | ||
49 | header, | ||
50 | hgroup, | ||
51 | main, | ||
52 | menu, | ||
53 | nav, | ||
54 | section, | ||
55 | summary { | ||
56 | display: block; | ||
57 | } | ||
58 | |||
59 | /** | ||
60 | * 1. Correct `inline-block` display not defined in IE 8/9. | ||
61 | * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. | ||
62 | */ | ||
63 | |||
64 | audio, | ||
65 | canvas, | ||
66 | progress, | ||
67 | video { | ||
68 | display: inline-block; /* 1 */ | ||
69 | vertical-align: baseline; /* 2 */ | ||
70 | } | ||
71 | |||
72 | /** | ||
73 | * Prevent modern browsers from displaying `audio` without controls. | ||
74 | * Remove excess height in iOS 5 devices. | ||
75 | */ | ||
76 | |||
77 | audio:not([controls]) { | ||
78 | display: none; | ||
79 | height: 0; | ||
80 | } | ||
81 | |||
82 | /** | ||
83 | * Address `[hidden]` styling not present in IE 8/9/10. | ||
84 | * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. | ||
85 | */ | ||
86 | |||
87 | [hidden], | ||
88 | template { | ||
89 | display: none; | ||
90 | } | ||
91 | |||
92 | /* Links | ||
93 | ========================================================================== */ | ||
94 | |||
95 | /** | ||
96 | * Remove the gray background color from active links in IE 10. | ||
97 | */ | ||
98 | |||
99 | a { | ||
100 | background-color: transparent; | ||
101 | } | ||
102 | |||
103 | /** | ||
104 | * Improve readability when focused and also mouse hovered in all browsers. | ||
105 | */ | ||
106 | |||
107 | a:active, | ||
108 | a:hover { | ||
109 | outline: 0; | ||
110 | } | ||
111 | |||
112 | /* Text-level semantics | ||
113 | ========================================================================== */ | ||
114 | |||
115 | /** | ||
116 | * Address styling not present in IE 8/9/10/11, Safari, and Chrome. | ||
117 | */ | ||
118 | |||
119 | abbr[title] { | ||
120 | border-bottom: 1px dotted; | ||
121 | } | ||
122 | |||
123 | /** | ||
124 | * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. | ||
125 | */ | ||
126 | |||
127 | b, | ||
128 | strong { | ||
129 | font-weight: bold; | ||
130 | } | ||
131 | |||
132 | /** | ||
133 | * Address styling not present in Safari and Chrome. | ||
134 | */ | ||
135 | |||
136 | dfn { | ||
137 | font-style: italic; | ||
138 | } | ||
139 | |||
140 | /** | ||
141 | * Address variable `h1` font-size and margin within `section` and `article` | ||
142 | * contexts in Firefox 4+, Safari, and Chrome. | ||
143 | */ | ||
144 | |||
145 | h1 { | ||
146 | font-size: 2em; | ||
147 | margin: 0.67em 0; | ||
148 | } | ||
149 | |||
150 | /** | ||
151 | * Address styling not present in IE 8/9. | ||
152 | */ | ||
153 | |||
154 | mark { | ||
155 | background: #ff0; | ||
156 | color: #000; | ||
157 | } | ||
158 | |||
159 | /** | ||
160 | * Address inconsistent and variable font size in all browsers. | ||
161 | */ | ||
162 | |||
163 | small { | ||
164 | font-size: 80%; | ||
165 | } | ||
166 | |||
167 | /** | ||
168 | * Prevent `sub` and `sup` affecting `line-height` in all browsers. | ||
169 | */ | ||
170 | |||
171 | sub, | ||
172 | sup { | ||
173 | font-size: 75%; | ||
174 | line-height: 0; | ||
175 | position: relative; | ||
176 | vertical-align: baseline; | ||
177 | } | ||
178 | |||
179 | sup { | ||
180 | top: -0.5em; | ||
181 | } | ||
182 | |||
183 | sub { | ||
184 | bottom: -0.25em; | ||
185 | } | ||
186 | |||
187 | /* Embedded content | ||
188 | ========================================================================== */ | ||
189 | |||
190 | /** | ||
191 | * Remove border when inside `a` element in IE 8/9/10. | ||
192 | */ | ||
193 | |||
194 | img { | ||
195 | border: 0; | ||
196 | } | ||
197 | |||
198 | /** | ||
199 | * Correct overflow not hidden in IE 9/10/11. | ||
200 | */ | ||
201 | |||
202 | svg:not(:root) { | ||
203 | overflow: hidden; | ||
204 | } | ||
205 | |||
206 | /* Grouping content | ||
207 | ========================================================================== */ | ||
208 | |||
209 | /** | ||
210 | * Address margin not present in IE 8/9 and Safari. | ||
211 | */ | ||
212 | |||
213 | figure { | ||
214 | margin: 1em 40px; | ||
215 | } | ||
216 | |||
217 | /** | ||
218 | * Address differences between Firefox and other browsers. | ||
219 | */ | ||
220 | |||
221 | hr { | ||
222 | -moz-box-sizing: content-box; | ||
223 | box-sizing: content-box; | ||
224 | height: 0; | ||
225 | } | ||
226 | |||
227 | /** | ||
228 | * Contain overflow in all browsers. | ||
229 | */ | ||
230 | |||
231 | pre { | ||
232 | overflow: auto; | ||
233 | } | ||
234 | |||
235 | /** | ||
236 | * Address odd `em`-unit font size rendering in all browsers. | ||
237 | */ | ||
238 | |||
239 | code, | ||
240 | kbd, | ||
241 | pre, | ||
242 | samp { | ||
243 | font-family: monospace, monospace; | ||
244 | font-size: 1em; | ||
245 | } | ||
246 | |||
247 | /* Forms | ||
248 | ========================================================================== */ | ||
249 | |||
250 | /** | ||
251 | * Known limitation: by default, Chrome and Safari on OS X allow very limited | ||
252 | * styling of `select`, unless a `border` property is set. | ||
253 | */ | ||
254 | |||
255 | /** | ||
256 | * 1. Correct color not being inherited. | ||
257 | * Known issue: affects color of disabled elements. | ||
258 | * 2. Correct font properties not being inherited. | ||
259 | * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. | ||
260 | */ | ||
261 | |||
262 | button, | ||
263 | input, | ||
264 | optgroup, | ||
265 | select, | ||
266 | textarea { | ||
267 | color: inherit; /* 1 */ | ||
268 | font: inherit; /* 2 */ | ||
269 | margin: 0; /* 3 */ | ||
270 | } | ||
271 | |||
272 | /** | ||
273 | * Address `overflow` set to `hidden` in IE 8/9/10/11. | ||
274 | */ | ||
275 | |||
276 | button { | ||
277 | overflow: visible; | ||
278 | } | ||
279 | |||
280 | /** | ||
281 | * Address inconsistent `text-transform` inheritance for `button` and `select`. | ||
282 | * All other form control elements do not inherit `text-transform` values. | ||
283 | * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. | ||
284 | * Correct `select` style inheritance in Firefox. | ||
285 | */ | ||
286 | |||
287 | button, | ||
288 | select { | ||
289 | text-transform: none; | ||
290 | } | ||
291 | |||
292 | /** | ||
293 | * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` | ||
294 | * and `video` controls. | ||
295 | * 2. Correct inability to style clickable `input` types in iOS. | ||
296 | * 3. Improve usability and consistency of cursor style between image-type | ||
297 | * `input` and others. | ||
298 | */ | ||
299 | |||
300 | button, | ||
301 | html input[type="button"], /* 1 */ | ||
302 | input[type="reset"], | ||
303 | input[type="submit"] { | ||
304 | -webkit-appearance: button; /* 2 */ | ||
305 | cursor: pointer; /* 3 */ | ||
306 | } | ||
307 | |||
308 | /** | ||
309 | * Re-set default cursor for disabled elements. | ||
310 | */ | ||
311 | |||
312 | button[disabled], | ||
313 | html input[disabled] { | ||
314 | cursor: default; | ||
315 | } | ||
316 | |||
317 | /** | ||
318 | * Remove inner padding and border in Firefox 4+. | ||
319 | */ | ||
320 | |||
321 | button::-moz-focus-inner, | ||
322 | input::-moz-focus-inner { | ||
323 | border: 0; | ||
324 | padding: 0; | ||
325 | } | ||
326 | |||
327 | /** | ||
328 | * Address Firefox 4+ setting `line-height` on `input` using `!important` in | ||
329 | * the UA stylesheet. | ||
330 | */ | ||
331 | |||
332 | input { | ||
333 | line-height: normal; | ||
334 | } | ||
335 | |||
336 | /** | ||
337 | * It's recommended that you don't attempt to style these elements. | ||
338 | * Firefox's implementation doesn't respect box-sizing, padding, or width. | ||
339 | * | ||
340 | * 1. Address box sizing set to `content-box` in IE 8/9/10. | ||
341 | * 2. Remove excess padding in IE 8/9/10. | ||
342 | */ | ||
343 | |||
344 | input[type="checkbox"], | ||
345 | input[type="radio"] { | ||
346 | box-sizing: border-box; /* 1 */ | ||
347 | padding: 0; /* 2 */ | ||
348 | } | ||
349 | |||
350 | /** | ||
351 | * Fix the cursor style for Chrome's increment/decrement buttons. For certain | ||
352 | * `font-size` values of the `input`, it causes the cursor style of the | ||
353 | * decrement button to change from `default` to `text`. | ||
354 | */ | ||
355 | |||
356 | input[type="number"]::-webkit-inner-spin-button, | ||
357 | input[type="number"]::-webkit-outer-spin-button { | ||
358 | height: auto; | ||
359 | } | ||
360 | |||
361 | /** | ||
362 | * 1. Address `appearance` set to `searchfield` in Safari and Chrome. | ||
363 | * 2. Address `box-sizing` set to `border-box` in Safari and Chrome | ||
364 | * (include `-moz` to future-proof). | ||
365 | */ | ||
366 | |||
367 | input[type="search"] { | ||
368 | -webkit-appearance: textfield; /* 1 */ | ||
369 | -moz-box-sizing: content-box; | ||
370 | -webkit-box-sizing: content-box; /* 2 */ | ||
371 | box-sizing: content-box; | ||
372 | } | ||
373 | |||
374 | /** | ||
375 | * Remove inner padding and search cancel button in Safari and Chrome on OS X. | ||
376 | * Safari (but not Chrome) clips the cancel button when the search input has | ||
377 | * padding (and `textfield` appearance). | ||
378 | */ | ||
379 | |||
380 | input[type="search"]::-webkit-search-cancel-button, | ||
381 | input[type="search"]::-webkit-search-decoration { | ||
382 | -webkit-appearance: none; | ||
383 | } | ||
384 | |||
385 | /** | ||
386 | * Define consistent border, margin, and padding. | ||
387 | */ | ||
388 | |||
389 | fieldset { | ||
390 | border: 1px solid #c0c0c0; | ||
391 | margin: 0 2px; | ||
392 | padding: 0.35em 0.625em 0.75em; | ||
393 | } | ||
394 | |||
395 | /** | ||
396 | * 1. Correct `color` not being inherited in IE 8/9/10/11. | ||
397 | * 2. Remove padding so people aren't caught out if they zero out fieldsets. | ||
398 | */ | ||
399 | |||
400 | legend { | ||
401 | border: 0; /* 1 */ | ||
402 | padding: 0; /* 2 */ | ||
403 | } | ||
404 | |||
405 | /** | ||
406 | * Remove default vertical scrollbar in IE 8/9/10/11. | ||
407 | */ | ||
408 | |||
409 | textarea { | ||
410 | overflow: auto; | ||
411 | } | ||
412 | |||
413 | /** | ||
414 | * Don't inherit the `font-weight` (applied by a rule above). | ||
415 | * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. | ||
416 | */ | ||
417 | |||
418 | optgroup { | ||
419 | font-weight: bold; | ||
420 | } | ||
421 | |||
422 | /* Tables | ||
423 | ========================================================================== */ | ||
424 | |||
425 | /** | ||
426 | * Remove most spacing between table cells. | ||
427 | */ | ||
428 | |||
429 | table { | ||
430 | border-collapse: collapse; | ||
431 | border-spacing: 0; | ||
432 | } | ||
433 | |||
434 | td, | ||
435 | th { | ||
436 | padding: 0; | ||
437 | } | ||
438 | |||
439 | /*csslint important:false*/ | ||
440 | |||
441 | /* ========================================================================== | ||
442 | Pure Base Extras | ||
443 | ========================================================================== */ | ||
444 | |||
445 | /** | ||
446 | * Extra rules that Pure adds on top of Normalize.css | ||
447 | */ | ||
448 | |||
449 | /** | ||
450 | * Always hide an element when it has the `hidden` HTML attribute. | ||
451 | */ | ||
452 | |||
453 | .hidden, | ||
454 | [hidden] { | ||
455 | display: none !important; | ||
456 | } | ||
457 | |||
458 | /** | ||
459 | * Add this class to an image to make it fit within it's fluid parent wrapper while maintaining | ||
460 | * aspect ratio. | ||
461 | */ | ||
462 | .pure-img { | ||
463 | max-width: 100%; | ||
464 | height: auto; | ||
465 | display: block; | ||
466 | } | ||
467 | |||
468 | /*csslint regex-selectors:false, known-properties:false, duplicate-properties:false*/ | ||
469 | |||
470 | .pure-g { | ||
471 | letter-spacing: -0.31em; /* Webkit: collapse white-space between units */ | ||
472 | *letter-spacing: normal; /* reset IE < 8 */ | ||
473 | *word-spacing: -0.43em; /* IE < 8: collapse white-space between units */ | ||
474 | text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */ | ||
475 | |||
476 | /* | ||
477 | Sets the font stack to fonts known to work properly with the above letter | ||
478 | and word spacings. See: https://github.com/yahoo/pure/issues/41/ | ||
479 | |||
480 | The following font stack makes Pure Grids work on all known environments. | ||
481 | |||
482 | * FreeSans: Ships with many Linux distros, including Ubuntu | ||
483 | |||
484 | * Arimo: Ships with Chrome OS. Arimo has to be defined before Helvetica and | ||
485 | Arial to get picked up by the browser, even though neither is available | ||
486 | in Chrome OS. | ||
487 | |||
488 | * Droid Sans: Ships with all versions of Android. | ||
489 | |||
490 | * Helvetica, Arial, sans-serif: Common font stack on OS X and Windows. | ||
491 | */ | ||
492 | font-family: FreeSans, Arimo, "Droid Sans", Helvetica, Arial, sans-serif; | ||
493 | |||
494 | /* | ||
495 | Use flexbox when possible to avoid `letter-spacing` side-effects. | ||
496 | |||
497 | NOTE: Firefox (as of 25) does not currently support flex-wrap, so the | ||
498 | `-moz-` prefix version is omitted. | ||
499 | */ | ||
500 | |||
501 | display: -webkit-flex; | ||
502 | -webkit-flex-flow: row wrap; | ||
503 | |||
504 | /* IE10 uses display: flexbox */ | ||
505 | display: -ms-flexbox; | ||
506 | -ms-flex-flow: row wrap; | ||
507 | |||
508 | /* Prevents distributing space between rows */ | ||
509 | -ms-align-content: flex-start; | ||
510 | -webkit-align-content: flex-start; | ||
511 | align-content: flex-start; | ||
512 | } | ||
513 | |||
514 | /* Opera as of 12 on Windows needs word-spacing. | ||
515 | The ".opera-only" selector is used to prevent actual prefocus styling | ||
516 | and is not required in markup. | ||
517 | */ | ||
518 | .opera-only :-o-prefocus, | ||
519 | .pure-g { | ||
520 | word-spacing: -0.43em; | ||
521 | } | ||
522 | |||
523 | .pure-u { | ||
524 | display: inline-block; | ||
525 | *display: inline; /* IE < 8: fake inline-block */ | ||
526 | zoom: 1; | ||
527 | letter-spacing: normal; | ||
528 | word-spacing: normal; | ||
529 | vertical-align: top; | ||
530 | text-rendering: auto; | ||
531 | } | ||
532 | |||
533 | /* | ||
534 | Resets the font family back to the OS/browser's default sans-serif font, | ||
535 | this the same font stack that Normalize.css sets for the `body`. | ||
536 | */ | ||
537 | .pure-g [class *= "pure-u"] { | ||
538 | font-family: sans-serif; | ||
539 | } | ||
540 | |||
541 | .pure-u-1, | ||
542 | .pure-u-1-1, | ||
543 | .pure-u-1-2, | ||
544 | .pure-u-1-3, | ||
545 | .pure-u-2-3, | ||
546 | .pure-u-1-4, | ||
547 | .pure-u-3-4, | ||
548 | .pure-u-1-5, | ||
549 | .pure-u-2-5, | ||
550 | .pure-u-3-5, | ||
551 | .pure-u-4-5, | ||
552 | .pure-u-5-5, | ||
553 | .pure-u-1-6, | ||
554 | .pure-u-5-6, | ||
555 | .pure-u-1-8, | ||
556 | .pure-u-3-8, | ||
557 | .pure-u-5-8, | ||
558 | .pure-u-7-8, | ||
559 | .pure-u-1-12, | ||
560 | .pure-u-5-12, | ||
561 | .pure-u-7-12, | ||
562 | .pure-u-11-12, | ||
563 | .pure-u-1-24, | ||
564 | .pure-u-2-24, | ||
565 | .pure-u-3-24, | ||
566 | .pure-u-4-24, | ||
567 | .pure-u-5-24, | ||
568 | .pure-u-6-24, | ||
569 | .pure-u-7-24, | ||
570 | .pure-u-8-24, | ||
571 | .pure-u-9-24, | ||
572 | .pure-u-10-24, | ||
573 | .pure-u-11-24, | ||
574 | .pure-u-12-24, | ||
575 | .pure-u-13-24, | ||
576 | .pure-u-14-24, | ||
577 | .pure-u-15-24, | ||
578 | .pure-u-16-24, | ||
579 | .pure-u-17-24, | ||
580 | .pure-u-18-24, | ||
581 | .pure-u-19-24, | ||
582 | .pure-u-20-24, | ||
583 | .pure-u-21-24, | ||
584 | .pure-u-22-24, | ||
585 | .pure-u-23-24, | ||
586 | .pure-u-24-24 { | ||
587 | display: inline-block; | ||
588 | *display: inline; | ||
589 | zoom: 1; | ||
590 | letter-spacing: normal; | ||
591 | word-spacing: normal; | ||
592 | vertical-align: top; | ||
593 | text-rendering: auto; | ||
594 | } | ||
595 | |||
596 | .pure-u-1-24 { | ||
597 | width: 4.1667%; | ||
598 | *width: 4.1357%; | ||
599 | } | ||
600 | |||
601 | .pure-u-1-12, | ||
602 | .pure-u-2-24 { | ||
603 | width: 8.3333%; | ||
604 | *width: 8.3023%; | ||
605 | } | ||
606 | |||
607 | .pure-u-1-8, | ||
608 | .pure-u-3-24 { | ||
609 | width: 12.5000%; | ||
610 | *width: 12.4690%; | ||
611 | } | ||
612 | |||
613 | .pure-u-1-6, | ||
614 | .pure-u-4-24 { | ||
615 | width: 16.6667%; | ||
616 | *width: 16.6357%; | ||
617 | } | ||
618 | |||
619 | .pure-u-1-5 { | ||
620 | width: 20%; | ||
621 | *width: 19.9690%; | ||
622 | } | ||
623 | |||
624 | .pure-u-5-24 { | ||
625 | width: 20.8333%; | ||
626 | *width: 20.8023%; | ||
627 | } | ||
628 | |||
629 | .pure-u-1-4, | ||
630 | .pure-u-6-24 { | ||
631 | width: 25%; | ||
632 | *width: 24.9690%; | ||
633 | } | ||
634 | |||
635 | .pure-u-7-24 { | ||
636 | width: 29.1667%; | ||
637 | *width: 29.1357%; | ||
638 | } | ||
639 | |||
640 | .pure-u-1-3, | ||
641 | .pure-u-8-24 { | ||
642 | width: 33.3333%; | ||
643 | *width: 33.3023%; | ||
644 | } | ||
645 | |||
646 | .pure-u-3-8, | ||
647 | .pure-u-9-24 { | ||
648 | width: 37.5000%; | ||
649 | *width: 37.4690%; | ||
650 | } | ||
651 | |||
652 | .pure-u-2-5 { | ||
653 | width: 40%; | ||
654 | *width: 39.9690%; | ||
655 | } | ||
656 | |||
657 | .pure-u-5-12, | ||
658 | .pure-u-10-24 { | ||
659 | width: 41.6667%; | ||
660 | *width: 41.6357%; | ||
661 | } | ||
662 | |||
663 | .pure-u-11-24 { | ||
664 | width: 45.8333%; | ||
665 | *width: 45.8023%; | ||
666 | } | ||
667 | |||
668 | .pure-u-1-2, | ||
669 | .pure-u-12-24 { | ||
670 | width: 50%; | ||
671 | *width: 49.9690%; | ||
672 | } | ||
673 | |||
674 | .pure-u-13-24 { | ||
675 | width: 54.1667%; | ||
676 | *width: 54.1357%; | ||
677 | } | ||
678 | |||
679 | .pure-u-7-12, | ||
680 | .pure-u-14-24 { | ||
681 | width: 58.3333%; | ||
682 | *width: 58.3023%; | ||
683 | } | ||
684 | |||
685 | .pure-u-3-5 { | ||
686 | width: 60%; | ||
687 | *width: 59.9690%; | ||
688 | } | ||
689 | |||
690 | .pure-u-5-8, | ||
691 | .pure-u-15-24 { | ||
692 | width: 62.5000%; | ||
693 | *width: 62.4690%; | ||
694 | } | ||
695 | |||
696 | .pure-u-2-3, | ||
697 | .pure-u-16-24 { | ||
698 | width: 66.6667%; | ||
699 | *width: 66.6357%; | ||
700 | } | ||
701 | |||
702 | .pure-u-17-24 { | ||
703 | width: 70.8333%; | ||
704 | *width: 70.8023%; | ||
705 | } | ||
706 | |||
707 | .pure-u-3-4, | ||
708 | .pure-u-18-24 { | ||
709 | width: 75%; | ||
710 | *width: 74.9690%; | ||
711 | } | ||
712 | |||
713 | .pure-u-19-24 { | ||
714 | width: 79.1667%; | ||
715 | *width: 79.1357%; | ||
716 | } | ||
717 | |||
718 | .pure-u-4-5 { | ||
719 | width: 80%; | ||
720 | *width: 79.9690%; | ||
721 | } | ||
722 | |||
723 | .pure-u-5-6, | ||
724 | .pure-u-20-24 { | ||
725 | width: 83.3333%; | ||
726 | *width: 83.3023%; | ||
727 | } | ||
728 | |||
729 | .pure-u-7-8, | ||
730 | .pure-u-21-24 { | ||
731 | width: 87.5000%; | ||
732 | *width: 87.4690%; | ||
733 | } | ||
734 | |||
735 | .pure-u-11-12, | ||
736 | .pure-u-22-24 { | ||
737 | width: 91.6667%; | ||
738 | *width: 91.6357%; | ||
739 | } | ||
740 | |||
741 | .pure-u-23-24 { | ||
742 | width: 95.8333%; | ||
743 | *width: 95.8023%; | ||
744 | } | ||
745 | |||
746 | .pure-u-1, | ||
747 | .pure-u-1-1, | ||
748 | .pure-u-5-5, | ||
749 | .pure-u-24-24 { | ||
750 | width: 100%; | ||
751 | } | ||
752 | .pure-button { | ||
753 | /* Structure */ | ||
754 | display: inline-block; | ||
755 | zoom: 1; | ||
756 | line-height: normal; | ||
757 | white-space: nowrap; | ||
758 | vertical-align: middle; | ||
759 | text-align: center; | ||
760 | cursor: pointer; | ||
761 | -webkit-user-drag: none; | ||
762 | -webkit-user-select: none; | ||
763 | -moz-user-select: none; | ||
764 | -ms-user-select: none; | ||
765 | user-select: none; | ||
766 | -webkit-box-sizing: border-box; | ||
767 | -moz-box-sizing: border-box; | ||
768 | box-sizing: border-box; | ||
769 | } | ||
770 | |||
771 | /* Firefox: Get rid of the inner focus border */ | ||
772 | .pure-button::-moz-focus-inner { | ||
773 | padding: 0; | ||
774 | border: 0; | ||
775 | } | ||
776 | |||
777 | /*csslint outline-none:false*/ | ||
778 | |||
779 | .pure-button { | ||
780 | font-family: inherit; | ||
781 | font-size: 100%; | ||
782 | padding: 0.5em 1em; | ||
783 | color: #444; /* rgba not supported (IE 8) */ | ||
784 | color: rgba(0, 0, 0, 0.80); /* rgba supported */ | ||
785 | border: 1px solid #999; /*IE 6/7/8*/ | ||
786 | border: none rgba(0, 0, 0, 0); /*IE9 + everything else*/ | ||
787 | background-color: #E6E6E6; | ||
788 | text-decoration: none; | ||
789 | border-radius: 2px; | ||
790 | } | ||
791 | |||
792 | .pure-button-hover, | ||
793 | .pure-button:hover, | ||
794 | .pure-button:focus { | ||
795 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#1a000000',GradientType=0); | ||
796 | background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(40%, rgba(0,0,0, 0.05)), to(rgba(0,0,0, 0.10))); | ||
797 | background-image: -webkit-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10)); | ||
798 | background-image: -moz-linear-gradient(top, rgba(0,0,0, 0.05) 0%, rgba(0,0,0, 0.10)); | ||
799 | background-image: -o-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10)); | ||
800 | background-image: linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10)); | ||
801 | } | ||
802 | .pure-button:focus { | ||
803 | outline: 0; | ||
804 | } | ||
805 | .pure-button-active, | ||
806 | .pure-button:active { | ||
807 | box-shadow: 0 0 0 1px rgba(0,0,0, 0.15) inset, 0 0 6px rgba(0,0,0, 0.20) inset; | ||
808 | border-color: #000\9; | ||
809 | } | ||
810 | |||
811 | .pure-button[disabled], | ||
812 | .pure-button-disabled, | ||
813 | .pure-button-disabled:hover, | ||
814 | .pure-button-disabled:focus, | ||
815 | .pure-button-disabled:active { | ||
816 | border: none; | ||
817 | background-image: none; | ||
818 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); | ||
819 | filter: alpha(opacity=40); | ||
820 | -khtml-opacity: 0.40; | ||
821 | -moz-opacity: 0.40; | ||
822 | opacity: 0.40; | ||
823 | cursor: not-allowed; | ||
824 | box-shadow: none; | ||
825 | } | ||
826 | |||
827 | .pure-button-hidden { | ||
828 | display: none; | ||
829 | } | ||
830 | |||
831 | /* Firefox: Get rid of the inner focus border */ | ||
832 | .pure-button::-moz-focus-inner{ | ||
833 | padding: 0; | ||
834 | border: 0; | ||
835 | } | ||
836 | |||
837 | .pure-button-primary, | ||
838 | .pure-button-selected, | ||
839 | a.pure-button-primary, | ||
840 | a.pure-button-selected { | ||
841 | background-color: rgb(0, 120, 231); | ||
842 | color: #fff; | ||
843 | } | ||
844 | |||
845 | /*csslint box-model:false*/ | ||
846 | /* | ||
847 | Box-model set to false because we're setting a height on select elements, which | ||
848 | also have border and padding. This is done because some browsers don't render | ||
849 | the padding. We explicitly set the box-model for select elements to border-box, | ||
850 | so we can ignore the csslint warning. | ||
851 | */ | ||
852 | |||
853 | .pure-form input[type="text"], | ||
854 | .pure-form input[type="password"], | ||
855 | .pure-form input[type="email"], | ||
856 | .pure-form input[type="url"], | ||
857 | .pure-form input[type="date"], | ||
858 | .pure-form input[type="month"], | ||
859 | .pure-form input[type="time"], | ||
860 | .pure-form input[type="datetime"], | ||
861 | .pure-form input[type="datetime-local"], | ||
862 | .pure-form input[type="week"], | ||
863 | .pure-form input[type="number"], | ||
864 | .pure-form input[type="search"], | ||
865 | .pure-form input[type="tel"], | ||
866 | .pure-form input[type="color"], | ||
867 | .pure-form select, | ||
868 | .pure-form textarea { | ||
869 | padding: 0.5em 0.6em; | ||
870 | display: inline-block; | ||
871 | border: 1px solid #ccc; | ||
872 | box-shadow: inset 0 1px 3px #ddd; | ||
873 | border-radius: 4px; | ||
874 | vertical-align: middle; | ||
875 | -webkit-box-sizing: border-box; | ||
876 | -moz-box-sizing: border-box; | ||
877 | box-sizing: border-box; | ||
878 | } | ||
879 | |||
880 | /* | ||
881 | Need to separate out the :not() selector from the rest of the CSS 2.1 selectors | ||
882 | since IE8 won't execute CSS that contains a CSS3 selector. | ||
883 | */ | ||
884 | .pure-form input:not([type]) { | ||
885 | padding: 0.5em 0.6em; | ||
886 | display: inline-block; | ||
887 | border: 1px solid #ccc; | ||
888 | box-shadow: inset 0 1px 3px #ddd; | ||
889 | border-radius: 4px; | ||
890 | -webkit-box-sizing: border-box; | ||
891 | -moz-box-sizing: border-box; | ||
892 | box-sizing: border-box; | ||
893 | } | ||
894 | |||
895 | |||
896 | /* Chrome (as of v.32/34 on OS X) needs additional room for color to display. */ | ||
897 | /* May be able to remove this tweak as color inputs become more standardized across browsers. */ | ||
898 | .pure-form input[type="color"] { | ||
899 | padding: 0.2em 0.5em; | ||
900 | } | ||
901 | |||
902 | |||
903 | .pure-form input[type="text"]:focus, | ||
904 | .pure-form input[type="password"]:focus, | ||
905 | .pure-form input[type="email"]:focus, | ||
906 | .pure-form input[type="url"]:focus, | ||
907 | .pure-form input[type="date"]:focus, | ||
908 | .pure-form input[type="month"]:focus, | ||
909 | .pure-form input[type="time"]:focus, | ||
910 | .pure-form input[type="datetime"]:focus, | ||
911 | .pure-form input[type="datetime-local"]:focus, | ||
912 | .pure-form input[type="week"]:focus, | ||
913 | .pure-form input[type="number"]:focus, | ||
914 | .pure-form input[type="search"]:focus, | ||
915 | .pure-form input[type="tel"]:focus, | ||
916 | .pure-form input[type="color"]:focus, | ||
917 | .pure-form select:focus, | ||
918 | .pure-form textarea:focus { | ||
919 | outline: 0; | ||
920 | border-color: #129FEA; | ||
921 | } | ||
922 | |||
923 | /* | ||
924 | Need to separate out the :not() selector from the rest of the CSS 2.1 selectors | ||
925 | since IE8 won't execute CSS that contains a CSS3 selector. | ||
926 | */ | ||
927 | .pure-form input:not([type]):focus { | ||
928 | outline: 0; | ||
929 | border-color: #129FEA; | ||
930 | } | ||
931 | |||
932 | .pure-form input[type="file"]:focus, | ||
933 | .pure-form input[type="radio"]:focus, | ||
934 | .pure-form input[type="checkbox"]:focus { | ||
935 | outline: thin solid #129FEA; | ||
936 | outline: 1px auto #129FEA; | ||
937 | } | ||
938 | .pure-form .pure-checkbox, | ||
939 | .pure-form .pure-radio { | ||
940 | margin: 0.5em 0; | ||
941 | display: block; | ||
942 | } | ||
943 | |||
944 | .pure-form input[type="text"][disabled], | ||
945 | .pure-form input[type="password"][disabled], | ||
946 | .pure-form input[type="email"][disabled], | ||
947 | .pure-form input[type="url"][disabled], | ||
948 | .pure-form input[type="date"][disabled], | ||
949 | .pure-form input[type="month"][disabled], | ||
950 | .pure-form input[type="time"][disabled], | ||
951 | .pure-form input[type="datetime"][disabled], | ||
952 | .pure-form input[type="datetime-local"][disabled], | ||
953 | .pure-form input[type="week"][disabled], | ||
954 | .pure-form input[type="number"][disabled], | ||
955 | .pure-form input[type="search"][disabled], | ||
956 | .pure-form input[type="tel"][disabled], | ||
957 | .pure-form input[type="color"][disabled], | ||
958 | .pure-form select[disabled], | ||
959 | .pure-form textarea[disabled] { | ||
960 | cursor: not-allowed; | ||
961 | background-color: #eaeded; | ||
962 | color: #cad2d3; | ||
963 | } | ||
964 | |||
965 | /* | ||
966 | Need to separate out the :not() selector from the rest of the CSS 2.1 selectors | ||
967 | since IE8 won't execute CSS that contains a CSS3 selector. | ||
968 | */ | ||
969 | .pure-form input:not([type])[disabled] { | ||
970 | cursor: not-allowed; | ||
971 | background-color: #eaeded; | ||
972 | color: #cad2d3; | ||
973 | } | ||
974 | .pure-form input[readonly], | ||
975 | .pure-form select[readonly], | ||
976 | .pure-form textarea[readonly] { | ||
977 | background-color: #eee; /* menu hover bg color */ | ||
978 | color: #777; /* menu text color */ | ||
979 | border-color: #ccc; | ||
980 | } | ||
981 | |||
982 | .pure-form input:focus:invalid, | ||
983 | .pure-form textarea:focus:invalid, | ||
984 | .pure-form select:focus:invalid { | ||
985 | color: #b94a48; | ||
986 | border-color: #e9322d; | ||
987 | } | ||
988 | .pure-form input[type="file"]:focus:invalid:focus, | ||
989 | .pure-form input[type="radio"]:focus:invalid:focus, | ||
990 | .pure-form input[type="checkbox"]:focus:invalid:focus { | ||
991 | outline-color: #e9322d; | ||
992 | } | ||
993 | .pure-form select { | ||
994 | /* Normalizes the height; padding is not sufficient. */ | ||
995 | height: 2.25em; | ||
996 | border: 1px solid #ccc; | ||
997 | background-color: white; | ||
998 | } | ||
999 | .pure-form select[multiple] { | ||
1000 | height: auto; | ||
1001 | } | ||
1002 | .pure-form label { | ||
1003 | margin: 0.5em 0 0.2em; | ||
1004 | } | ||
1005 | .pure-form fieldset { | ||
1006 | margin: 0; | ||
1007 | padding: 0.35em 0 0.75em; | ||
1008 | border: 0; | ||
1009 | } | ||
1010 | .pure-form legend { | ||
1011 | display: block; | ||
1012 | width: 100%; | ||
1013 | padding: 0.3em 0; | ||
1014 | margin-bottom: 0.3em; | ||
1015 | color: #333; | ||
1016 | border-bottom: 1px solid #e5e5e5; | ||
1017 | } | ||
1018 | |||
1019 | .pure-form-stacked input[type="text"], | ||
1020 | .pure-form-stacked input[type="password"], | ||
1021 | .pure-form-stacked input[type="email"], | ||
1022 | .pure-form-stacked input[type="url"], | ||
1023 | .pure-form-stacked input[type="date"], | ||
1024 | .pure-form-stacked input[type="month"], | ||
1025 | .pure-form-stacked input[type="time"], | ||
1026 | .pure-form-stacked input[type="datetime"], | ||
1027 | .pure-form-stacked input[type="datetime-local"], | ||
1028 | .pure-form-stacked input[type="week"], | ||
1029 | .pure-form-stacked input[type="number"], | ||
1030 | .pure-form-stacked input[type="search"], | ||
1031 | .pure-form-stacked input[type="tel"], | ||
1032 | .pure-form-stacked input[type="color"], | ||
1033 | .pure-form-stacked input[type="file"], | ||
1034 | .pure-form-stacked select, | ||
1035 | .pure-form-stacked label, | ||
1036 | .pure-form-stacked textarea { | ||
1037 | display: block; | ||
1038 | margin: 0.25em 0; | ||
1039 | } | ||
1040 | |||
1041 | /* | ||
1042 | Need to separate out the :not() selector from the rest of the CSS 2.1 selectors | ||
1043 | since IE8 won't execute CSS that contains a CSS3 selector. | ||
1044 | */ | ||
1045 | .pure-form-stacked input:not([type]) { | ||
1046 | display: block; | ||
1047 | margin: 0.25em 0; | ||
1048 | } | ||
1049 | .pure-form-aligned input, | ||
1050 | .pure-form-aligned textarea, | ||
1051 | .pure-form-aligned select, | ||
1052 | /* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline instead. */ | ||
1053 | .pure-form-aligned .pure-help-inline, | ||
1054 | .pure-form-message-inline { | ||
1055 | display: inline-block; | ||
1056 | *display: inline; | ||
1057 | *zoom: 1; | ||
1058 | vertical-align: middle; | ||
1059 | } | ||
1060 | .pure-form-aligned textarea { | ||
1061 | vertical-align: top; | ||
1062 | } | ||
1063 | |||
1064 | /* Aligned Forms */ | ||
1065 | .pure-form-aligned .pure-control-group { | ||
1066 | margin-bottom: 0.5em; | ||
1067 | } | ||
1068 | .pure-form-aligned .pure-control-group label { | ||
1069 | text-align: right; | ||
1070 | display: inline-block; | ||
1071 | vertical-align: middle; | ||
1072 | width: 10em; | ||
1073 | margin: 0 1em 0 0; | ||
1074 | } | ||
1075 | .pure-form-aligned .pure-controls { | ||
1076 | margin: 1.5em 0 0 11em; | ||
1077 | } | ||
1078 | |||
1079 | /* Rounded Inputs */ | ||
1080 | .pure-form input.pure-input-rounded, | ||
1081 | .pure-form .pure-input-rounded { | ||
1082 | border-radius: 2em; | ||
1083 | padding: 0.5em 1em; | ||
1084 | } | ||
1085 | |||
1086 | /* Grouped Inputs */ | ||
1087 | .pure-form .pure-group fieldset { | ||
1088 | margin-bottom: 10px; | ||
1089 | } | ||
1090 | .pure-form .pure-group input, | ||
1091 | .pure-form .pure-group textarea { | ||
1092 | display: block; | ||
1093 | padding: 10px; | ||
1094 | margin: 0 0 -1px; | ||
1095 | border-radius: 0; | ||
1096 | position: relative; | ||
1097 | top: -1px; | ||
1098 | } | ||
1099 | .pure-form .pure-group input:focus, | ||
1100 | .pure-form .pure-group textarea:focus { | ||
1101 | z-index: 3; | ||
1102 | } | ||
1103 | .pure-form .pure-group input:first-child, | ||
1104 | .pure-form .pure-group textarea:first-child { | ||
1105 | top: 1px; | ||
1106 | border-radius: 4px 4px 0 0; | ||
1107 | margin: 0; | ||
1108 | } | ||
1109 | .pure-form .pure-group input:first-child:last-child, | ||
1110 | .pure-form .pure-group textarea:first-child:last-child { | ||
1111 | top: 1px; | ||
1112 | border-radius: 4px; | ||
1113 | margin: 0; | ||
1114 | } | ||
1115 | .pure-form .pure-group input:last-child, | ||
1116 | .pure-form .pure-group textarea:last-child { | ||
1117 | top: -2px; | ||
1118 | border-radius: 0 0 4px 4px; | ||
1119 | margin: 0; | ||
1120 | } | ||
1121 | .pure-form .pure-group button { | ||
1122 | margin: 0.35em 0; | ||
1123 | } | ||
1124 | |||
1125 | .pure-form .pure-input-1 { | ||
1126 | width: 100%; | ||
1127 | } | ||
1128 | .pure-form .pure-input-2-3 { | ||
1129 | width: 66%; | ||
1130 | } | ||
1131 | .pure-form .pure-input-1-2 { | ||
1132 | width: 50%; | ||
1133 | } | ||
1134 | .pure-form .pure-input-1-3 { | ||
1135 | width: 33%; | ||
1136 | } | ||
1137 | .pure-form .pure-input-1-4 { | ||
1138 | width: 25%; | ||
1139 | } | ||
1140 | |||
1141 | /* Inline help for forms */ | ||
1142 | /* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline instead. */ | ||
1143 | .pure-form .pure-help-inline, | ||
1144 | .pure-form-message-inline { | ||
1145 | display: inline-block; | ||
1146 | padding-left: 0.3em; | ||
1147 | color: #666; | ||
1148 | vertical-align: middle; | ||
1149 | font-size: 0.875em; | ||
1150 | } | ||
1151 | |||
1152 | /* Block help for forms */ | ||
1153 | .pure-form-message { | ||
1154 | display: block; | ||
1155 | color: #666; | ||
1156 | font-size: 0.875em; | ||
1157 | } | ||
1158 | |||
1159 | @media only screen and (max-width : 480px) { | ||
1160 | .pure-form button[type="submit"] { | ||
1161 | margin: 0.7em 0 0; | ||
1162 | } | ||
1163 | |||
1164 | .pure-form input:not([type]), | ||
1165 | .pure-form input[type="text"], | ||
1166 | .pure-form input[type="password"], | ||
1167 | .pure-form input[type="email"], | ||
1168 | .pure-form input[type="url"], | ||
1169 | .pure-form input[type="date"], | ||
1170 | .pure-form input[type="month"], | ||
1171 | .pure-form input[type="time"], | ||
1172 | .pure-form input[type="datetime"], | ||
1173 | .pure-form input[type="datetime-local"], | ||
1174 | .pure-form input[type="week"], | ||
1175 | .pure-form input[type="number"], | ||
1176 | .pure-form input[type="search"], | ||
1177 | .pure-form input[type="tel"], | ||
1178 | .pure-form input[type="color"], | ||
1179 | .pure-form label { | ||
1180 | margin-bottom: 0.3em; | ||
1181 | display: block; | ||
1182 | } | ||
1183 | |||
1184 | .pure-group input:not([type]), | ||
1185 | .pure-group input[type="text"], | ||
1186 | .pure-group input[type="password"], | ||
1187 | .pure-group input[type="email"], | ||
1188 | .pure-group input[type="url"], | ||
1189 | .pure-group input[type="date"], | ||
1190 | .pure-group input[type="month"], | ||
1191 | .pure-group input[type="time"], | ||
1192 | .pure-group input[type="datetime"], | ||
1193 | .pure-group input[type="datetime-local"], | ||
1194 | .pure-group input[type="week"], | ||
1195 | .pure-group input[type="number"], | ||
1196 | .pure-group input[type="search"], | ||
1197 | .pure-group input[type="tel"], | ||
1198 | .pure-group input[type="color"] { | ||
1199 | margin-bottom: 0; | ||
1200 | } | ||
1201 | |||
1202 | .pure-form-aligned .pure-control-group label { | ||
1203 | margin-bottom: 0.3em; | ||
1204 | text-align: left; | ||
1205 | display: block; | ||
1206 | width: 100%; | ||
1207 | } | ||
1208 | |||
1209 | .pure-form-aligned .pure-controls { | ||
1210 | margin: 1.5em 0 0 0; | ||
1211 | } | ||
1212 | |||
1213 | /* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline instead. */ | ||
1214 | .pure-form .pure-help-inline, | ||
1215 | .pure-form-message-inline, | ||
1216 | .pure-form-message { | ||
1217 | display: block; | ||
1218 | font-size: 0.75em; | ||
1219 | /* Increased bottom padding to make it group with its related input element. */ | ||
1220 | padding: 0.2em 0 0.8em; | ||
1221 | } | ||
1222 | } | ||
1223 | |||
1224 | /*csslint adjoining-classes: false, box-model:false*/ | ||
1225 | .pure-menu { | ||
1226 | -webkit-box-sizing: border-box; | ||
1227 | -moz-box-sizing: border-box; | ||
1228 | box-sizing: border-box; | ||
1229 | } | ||
1230 | |||
1231 | .pure-menu-fixed { | ||
1232 | position: fixed; | ||
1233 | left: 0; | ||
1234 | top: 0; | ||
1235 | z-index: 3; | ||
1236 | } | ||
1237 | |||
1238 | .pure-menu-list, | ||
1239 | .pure-menu-item { | ||
1240 | position: relative; | ||
1241 | } | ||
1242 | |||
1243 | .pure-menu-list { | ||
1244 | list-style: none; | ||
1245 | margin: 0; | ||
1246 | padding: 0; | ||
1247 | } | ||
1248 | |||
1249 | .pure-menu-item { | ||
1250 | padding: 0; | ||
1251 | margin: 0; | ||
1252 | height: 100%; | ||
1253 | } | ||
1254 | |||
1255 | .pure-menu-link, | ||
1256 | .pure-menu-heading { | ||
1257 | display: block; | ||
1258 | text-decoration: none; | ||
1259 | white-space: nowrap; | ||
1260 | } | ||
1261 | |||
1262 | /* HORIZONTAL MENU */ | ||
1263 | .pure-menu-horizontal { | ||
1264 | width: 100%; | ||
1265 | white-space: nowrap; | ||
1266 | } | ||
1267 | |||
1268 | .pure-menu-horizontal .pure-menu-list { | ||
1269 | display: inline-block; | ||
1270 | } | ||
1271 | |||
1272 | /* Initial menus should be inline-block so that they are horizontal */ | ||
1273 | .pure-menu-horizontal .pure-menu-item, | ||
1274 | .pure-menu-horizontal .pure-menu-heading, | ||
1275 | .pure-menu-horizontal .pure-menu-separator { | ||
1276 | display: inline-block; | ||
1277 | *display: inline; | ||
1278 | zoom: 1; | ||
1279 | vertical-align: middle; | ||
1280 | } | ||
1281 | |||
1282 | /* Submenus should still be display: block; */ | ||
1283 | .pure-menu-item .pure-menu-item { | ||
1284 | display: block; | ||
1285 | } | ||
1286 | |||
1287 | .pure-menu-children { | ||
1288 | display: none; | ||
1289 | position: absolute; | ||
1290 | left: 100%; | ||
1291 | top: 0; | ||
1292 | margin: 0; | ||
1293 | padding: 0; | ||
1294 | z-index: 3; | ||
1295 | } | ||
1296 | |||
1297 | .pure-menu-horizontal .pure-menu-children { | ||
1298 | left: 0; | ||
1299 | top: auto; | ||
1300 | width: inherit; | ||
1301 | } | ||
1302 | |||
1303 | .pure-menu-allow-hover:hover > .pure-menu-children, | ||
1304 | .pure-menu-active > .pure-menu-children { | ||
1305 | display: block; | ||
1306 | position: absolute; | ||
1307 | } | ||
1308 | |||
1309 | /* Vertical Menus - show the dropdown arrow */ | ||
1310 | .pure-menu-has-children > .pure-menu-link:after { | ||
1311 | padding-left: 0.5em; | ||
1312 | content: "\25B8"; | ||
1313 | font-size: small; | ||
1314 | } | ||
1315 | |||
1316 | /* Horizontal Menus - show the dropdown arrow */ | ||
1317 | .pure-menu-horizontal .pure-menu-has-children > .pure-menu-link:after { | ||
1318 | content: "\25BE"; | ||
1319 | } | ||
1320 | |||
1321 | /* scrollable menus */ | ||
1322 | .pure-menu-scrollable { | ||
1323 | overflow-y: scroll; | ||
1324 | overflow-x: hidden; | ||
1325 | } | ||
1326 | |||
1327 | .pure-menu-scrollable .pure-menu-list { | ||
1328 | display: block; | ||
1329 | } | ||
1330 | |||
1331 | .pure-menu-horizontal.pure-menu-scrollable .pure-menu-list { | ||
1332 | display: inline-block; | ||
1333 | } | ||
1334 | |||
1335 | .pure-menu-horizontal.pure-menu-scrollable { | ||
1336 | white-space: nowrap; | ||
1337 | overflow-y: hidden; | ||
1338 | overflow-x: auto; | ||
1339 | -ms-overflow-style: none; | ||
1340 | -webkit-overflow-scrolling: touch; | ||
1341 | /* a little extra padding for this style to allow for scrollbars */ | ||
1342 | padding: .5em 0; | ||
1343 | } | ||
1344 | |||
1345 | .pure-menu-horizontal.pure-menu-scrollable::-webkit-scrollbar { | ||
1346 | display: none; | ||
1347 | } | ||
1348 | |||
1349 | /* misc default styling */ | ||
1350 | |||
1351 | .pure-menu-separator { | ||
1352 | background-color: #ccc; | ||
1353 | height: 1px; | ||
1354 | margin: .3em 0; | ||
1355 | } | ||
1356 | |||
1357 | .pure-menu-horizontal .pure-menu-separator { | ||
1358 | width: 1px; | ||
1359 | height: 1.3em; | ||
1360 | margin: 0 .3em ; | ||
1361 | } | ||
1362 | |||
1363 | .pure-menu-heading { | ||
1364 | text-transform: uppercase; | ||
1365 | color: #565d64; | ||
1366 | } | ||
1367 | |||
1368 | .pure-menu-link { | ||
1369 | color: #777; | ||
1370 | } | ||
1371 | |||
1372 | .pure-menu-children { | ||
1373 | background-color: #fff; | ||
1374 | } | ||
1375 | |||
1376 | .pure-menu-link, | ||
1377 | .pure-menu-disabled, | ||
1378 | .pure-menu-heading { | ||
1379 | padding: .5em 1em; | ||
1380 | } | ||
1381 | |||
1382 | .pure-menu-disabled { | ||
1383 | opacity: .5; | ||
1384 | } | ||
1385 | |||
1386 | .pure-menu-disabled .pure-menu-link:hover { | ||
1387 | background-color: transparent; | ||
1388 | } | ||
1389 | |||
1390 | .pure-menu-active > .pure-menu-link, | ||
1391 | .pure-menu-link:hover, | ||
1392 | .pure-menu-link:focus { | ||
1393 | background-color: #eee; | ||
1394 | } | ||
1395 | |||
1396 | .pure-menu-selected .pure-menu-link, | ||
1397 | .pure-menu-selected .pure-menu-link:visited { | ||
1398 | color: #000; | ||
1399 | } | ||
1400 | |||
1401 | .pure-table { | ||
1402 | /* Remove spacing between table cells (from Normalize.css) */ | ||
1403 | border-collapse: collapse; | ||
1404 | border-spacing: 0; | ||
1405 | empty-cells: show; | ||
1406 | border: 1px solid #cbcbcb; | ||
1407 | } | ||
1408 | |||
1409 | .pure-table caption { | ||
1410 | color: #000; | ||
1411 | font: italic 85%/1 arial, sans-serif; | ||
1412 | padding: 1em 0; | ||
1413 | text-align: center; | ||
1414 | } | ||
1415 | |||
1416 | .pure-table td, | ||
1417 | .pure-table th { | ||
1418 | border-left: 1px solid #cbcbcb;/* inner column border */ | ||
1419 | border-width: 0 0 0 1px; | ||
1420 | font-size: inherit; | ||
1421 | margin: 0; | ||
1422 | overflow: visible; /*to make ths where the title is really long work*/ | ||
1423 | padding: 0.5em 1em; /* cell padding */ | ||
1424 | } | ||
1425 | |||
1426 | /* Consider removing this next declaration block, as it causes problems when | ||
1427 | there's a rowspan on the first cell. Case added to the tests. issue#432 */ | ||
1428 | .pure-table td:first-child, | ||
1429 | .pure-table th:first-child { | ||
1430 | border-left-width: 0; | ||
1431 | } | ||
1432 | |||
1433 | .pure-table thead { | ||
1434 | background-color: #e0e0e0; | ||
1435 | color: #000; | ||
1436 | text-align: left; | ||
1437 | vertical-align: bottom; | ||
1438 | } | ||
1439 | |||
1440 | /* | ||
1441 | striping: | ||
1442 | even - #fff (white) | ||
1443 | odd - #f2f2f2 (light gray) | ||
1444 | */ | ||
1445 | .pure-table td { | ||
1446 | background-color: transparent; | ||
1447 | } | ||
1448 | .pure-table-odd td { | ||
1449 | background-color: #f2f2f2; | ||
1450 | } | ||
1451 | |||
1452 | /* nth-child selector for modern browsers */ | ||
1453 | .pure-table-striped tr:nth-child(2n-1) td { | ||
1454 | background-color: #f2f2f2; | ||
1455 | } | ||
1456 | |||
1457 | /* BORDERED TABLES */ | ||
1458 | .pure-table-bordered td { | ||
1459 | border-bottom: 1px solid #cbcbcb; | ||
1460 | } | ||
1461 | .pure-table-bordered tbody > tr:last-child > td { | ||
1462 | border-bottom-width: 0; | ||
1463 | } | ||
1464 | |||
1465 | |||
1466 | /* HORIZONTAL BORDERED TABLES */ | ||
1467 | |||
1468 | .pure-table-horizontal td, | ||
1469 | .pure-table-horizontal th { | ||
1470 | border-width: 0 0 1px 0; | ||
1471 | border-bottom: 1px solid #cbcbcb; | ||
1472 | } | ||
1473 | .pure-table-horizontal tbody > tr:last-child > td { | ||
1474 | border-bottom-width: 0; | ||
1475 | } | ||
diff --git a/tpl/default/css/shaarli.css b/tpl/default/css/shaarli.css index e69de29b..7213c4a4 100644 --- a/tpl/default/css/shaarli.css +++ b/tpl/default/css/shaarli.css | |||
@@ -0,0 +1,108 @@ | |||
1 | body { | ||
2 | background: url(../img/noise.png) #979797; | ||
3 | } | ||
4 | |||
5 | header { | ||
6 | |||
7 | } | ||
8 | |||
9 | /** | ||
10 | * MENU | ||
11 | **/ | ||
12 | .pure-menu { | ||
13 | /*position: fixed;*/ | ||
14 | background: #16a085; | ||
15 | } | ||
16 | |||
17 | .pure-menu-selected { | ||
18 | background: #049372; | ||
19 | } | ||
20 | |||
21 | .pure-menu-link, | ||
22 | .pure-menu-link:visited, | ||
23 | .pure-menu-selected .pure-menu-link, | ||
24 | .pure-menu-selected .pure-menu-link:visited { | ||
25 | color: #b0ddce; | ||
26 | } | ||
27 | |||
28 | .pure-menu-link:hover, | ||
29 | .pure-menu-selected .pure-menu-link:hover { | ||
30 | color: #fff; | ||
31 | background: transparent; | ||
32 | } | ||
33 | |||
34 | .shaarli-menu { | ||
35 | margin-bottom: 1em; | ||
36 | -webkit-font-smoothing: antialiased; | ||
37 | /* Hack to transition with auto height: http://stackoverflow.com/a/8331169/1484919 */ | ||
38 | max-height: 2.1em; | ||
39 | transition: max-height 0.5s; | ||
40 | overflow: hidden; | ||
41 | } | ||
42 | |||
43 | .shaarli-menu.open { | ||
44 | max-height: 500px; | ||
45 | transition: max-height 0.75s; | ||
46 | } | ||
47 | |||
48 | .menu-toggle { | ||
49 | width: 34px; | ||
50 | height: 34px; | ||
51 | position: absolute; | ||
52 | top: 0; | ||
53 | right: 0; | ||
54 | display: none; | ||
55 | } | ||
56 | |||
57 | .menu-toggle .bar { | ||
58 | background-color: #b0ddce; | ||
59 | display: block; | ||
60 | width: 20px; | ||
61 | height: 2px; | ||
62 | border-radius: 100px; | ||
63 | position: absolute; | ||
64 | top: 18px; | ||
65 | right: 7px; | ||
66 | transition: all 0.5s; | ||
67 | } | ||
68 | |||
69 | .menu-toggle .bar:first-child { | ||
70 | transform: translateY(-6px); | ||
71 | } | ||
72 | |||
73 | .menu-toggle.x .bar { | ||
74 | transform: rotate(45deg); | ||
75 | } | ||
76 | |||
77 | .menu-toggle.x .bar:first-child { | ||
78 | transform: rotate(-45deg); | ||
79 | } | ||
80 | |||
81 | @media screen and (max-width: 64em) { | ||
82 | .menu-toggle { | ||
83 | display: block; | ||
84 | } | ||
85 | } | ||
86 | |||
87 | /** | ||
88 | * Extends Pure grids responsive to hide items. | ||
89 | * Use xx-0 to hide an item on xx screen. | ||
90 | * Display it at any level with xx-visible. | ||
91 | */ | ||
92 | .pure-u-0 { display: none !important; } | ||
93 | @media screen and (min-width: 35.5em) { | ||
94 | .pure-u-sm-0 { display: none !important; } | ||
95 | .pure-u-sm-visible { display: inherit !important; } | ||
96 | } | ||
97 | @media screen and (min-width: 48em) { | ||
98 | .pure-u-md-0 { display: none !important; } | ||
99 | .pure-u-md-visible { display: inherit !important; } | ||
100 | } | ||
101 | @media screen and (min-width: 64em) { | ||
102 | .pure-u-lg-0 { display: none !important; } | ||
103 | .pure-u-lg-visible { display: inherit !important; } | ||
104 | } | ||
105 | @media screen and (min-width: 80em) { | ||
106 | .pure-u-xl-0 { display: none !important; } | ||
107 | .pure-u-xl-visible { display: inherit !important; } | ||
108 | } \ No newline at end of file | ||
diff --git a/tpl/default/img/noise.png b/tpl/default/img/noise.png new file mode 100644 index 00000000..8f7fa660 --- /dev/null +++ b/tpl/default/img/noise.png | |||
Binary files differ | |||
diff --git a/tpl/default/includes.html b/tpl/default/includes.html index 4f340508..c5b7ee13 100644 --- a/tpl/default/includes.html +++ b/tpl/default/includes.html | |||
@@ -1,11 +1,12 @@ | |||
1 | <title>{$pagetitle}</title> | 1 | <title>{$pagetitle}</title> |
2 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | 2 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
3 | <meta name="format-detection" content="telephone=no" /> | 3 | <meta name="format-detection" content="telephone=no" /> |
4 | <meta name="viewport" content="width=device-width,initial-scale=1.0" /> | 4 | <meta name="viewport" content="width=device-width, initial-scale=1"> |
5 | <link rel="alternate" type="application/rss+xml" href="{$feedurl}?do=rss{$searchcrits}#" title="RSS Feed" /> | 5 | <link rel="alternate" type="application/rss+xml" href="{$feedurl}?do=rss{$searchcrits}#" title="RSS Feed" /> |
6 | <link rel="alternate" type="application/atom+xml" href="{$feedurl}?do=atom{$searchcrits}#" title="ATOM Feed" /> | 6 | <link rel="alternate" type="application/atom+xml" href="{$feedurl}?do=atom{$searchcrits}#" title="ATOM Feed" /> |
7 | <link href="images/favicon.ico#" rel="shortcut icon" type="image/x-icon" /> | 7 | <link href="images/favicon.ico#" rel="shortcut icon" type="image/x-icon" /> |
8 | <link type="text/css" rel="stylesheet" href="css/pure.min.css" /> | 8 | <link type="text/css" rel="stylesheet" href="css/pure.min.css" /> |
9 | <link type="text/css" rel="stylesheet" href="css/grids-responsive.min.css"> | ||
9 | <link type="text/css" rel="stylesheet" href="css/font-awesome.min.css" /> | 10 | <link type="text/css" rel="stylesheet" href="css/font-awesome.min.css" /> |
10 | <link type="text/css" rel="stylesheet" href="css/shaarli.css" /> | 11 | <link type="text/css" rel="stylesheet" href="css/shaarli.css" /> |
11 | {if="is_file('inc/user.css')"} | 12 | {if="is_file('inc/user.css')"} |
diff --git a/tpl/default/js/shaarli.js b/tpl/default/js/shaarli.js new file mode 100644 index 00000000..c401af1d --- /dev/null +++ b/tpl/default/js/shaarli.js | |||
@@ -0,0 +1,42 @@ | |||
1 | /** | ||
2 | * Handle responsive menu. | ||
3 | * Source: http://purecss.io/layouts/tucked-menu-vertical/ | ||
4 | */ | ||
5 | (function (window, document) { | ||
6 | var menu = document.getElementById('shaarli-menu'), | ||
7 | WINDOW_CHANGE_EVENT = ('onorientationchange' in window) ? 'orientationchange':'resize'; | ||
8 | |||
9 | function toggleHorizontal() { | ||
10 | [].forEach.call( | ||
11 | document.getElementById('shaarli-menu').querySelectorAll('.menu-transform'), | ||
12 | function(el){ | ||
13 | el.classList.toggle('pure-menu-horizontal'); | ||
14 | } | ||
15 | ); | ||
16 | }; | ||
17 | |||
18 | function toggleMenu() { | ||
19 | // set timeout so that the panel has a chance to roll up | ||
20 | // before the menu switches states | ||
21 | if (menu.classList.contains('open')) { | ||
22 | setTimeout(toggleHorizontal, 500); | ||
23 | } | ||
24 | else { | ||
25 | toggleHorizontal(); | ||
26 | } | ||
27 | menu.classList.toggle('open'); | ||
28 | document.getElementById('menu-toggle').classList.toggle('x'); | ||
29 | }; | ||
30 | |||
31 | function closeMenu() { | ||
32 | if (menu.classList.contains('open')) { | ||
33 | toggleMenu(); | ||
34 | } | ||
35 | } | ||
36 | |||
37 | document.getElementById('menu-toggle').addEventListener('click', function (e) { | ||
38 | toggleMenu(); | ||
39 | }); | ||
40 | |||
41 | window.addEventListener(WINDOW_CHANGE_EVENT, closeMenu); | ||
42 | })(this, this.document); \ No newline at end of file | ||
diff --git a/tpl/default/linklist.html b/tpl/default/linklist.html new file mode 100644 index 00000000..ca91699e --- /dev/null +++ b/tpl/default/linklist.html | |||
@@ -0,0 +1,128 @@ | |||
1 | <!DOCTYPE html> | ||
2 | <html> | ||
3 | <head> | ||
4 | <link type="text/css" rel="stylesheet" href="../inc/awesomplete.css" /> | ||
5 | {include="includes"} | ||
6 | </head> | ||
7 | <body> | ||
8 | <div id="pageheader"> | ||
9 | {include="page.header"} | ||
10 | |||
11 | <div id="headerform" class="search"> | ||
12 | <form method="GET" class="searchform" name="searchform"> | ||
13 | <input type="text" tabindex="1" id="searchform_value" name="searchterm" placeholder="Search text" | ||
14 | {if="!empty($search_crits) && $search_type=='fulltext'"} | ||
15 | value="{$search_crits}" | ||
16 | {/if} | ||
17 | > | ||
18 | <input type="submit" value="Search" class="bigbutton"> | ||
19 | </form> | ||
20 | <form method="GET" class="tagfilter" name="tagfilter"> | ||
21 | <input type="text" tabindex="2" name="searchtags" id="tagfilter_value" placeholder="Filter by tag" | ||
22 | {if="!empty($search_crits) && $search_type=='tags'"} | ||
23 | value="{function="implode(' ', $search_crits)"}" | ||
24 | {/if} | ||
25 | autocomplete="off" class="awesomplete" data-multiple data-minChars="1" | ||
26 | data-list="{loop="$tags"}{$key}, {/loop}" | ||
27 | > | ||
28 | <input type="submit" value="Search" class="bigbutton"> | ||
29 | </form> | ||
30 | {loop="$plugins_header.fields_toolbar"} | ||
31 | {$value} | ||
32 | {/loop} | ||
33 | </div> | ||
34 | </div> | ||
35 | |||
36 | <div id="linklist"> | ||
37 | |||
38 | {include="linklist.paging"} | ||
39 | |||
40 | <div id="plugin_zone_start_linklist" class="plugin_zone"> | ||
41 | {loop="$plugin_start_zone"} | ||
42 | {$value} | ||
43 | {/loop} | ||
44 | </div> | ||
45 | |||
46 | {if="count($links)==0"} | ||
47 | <div id="searchcriteria">Nothing found.</i></div> | ||
48 | {else} | ||
49 | {if="$search_type=='fulltext'"} | ||
50 | <div id="searchcriteria">{$result_count} results for <i>{$search_crits}</i></div> | ||
51 | {/if} | ||
52 | {if="$search_type=='tags'"} | ||
53 | <div id="searchcriteria">{$result_count} results for tags <i> | ||
54 | {loop="search_crits"} | ||
55 | <span class="linktag" title="Remove tag"> | ||
56 | <a href="?removetag={function="urlencode($value)"}">{$value} <span class="remove">x</span></a> | ||
57 | </span> | ||
58 | {/loop}</i></div> | ||
59 | {/if} | ||
60 | {/if} | ||
61 | <ul> | ||
62 | {loop="links"} | ||
63 | <li{if="$value.class"} class="{$value.class}"{/if}> | ||
64 | <a id="{$value.shorturl}"></a> | ||
65 | <div class="thumbnail">{$value.url|thumbnail}</div> | ||
66 | <div class="linkcontainer"> | ||
67 | {if="isLoggedIn()"} | ||
68 | <div class="linkeditbuttons"> | ||
69 | <form method="GET" class="buttoneditform"> | ||
70 | <input type="hidden" name="edit_link" value="{$value.linkdate}"> | ||
71 | <input type="image" alt="Edit" src="images/edit_icon.png#" title="Edit" class="button_edit"> | ||
72 | </form><br> | ||
73 | <form method="POST" class="buttoneditform"> | ||
74 | <input type="hidden" name="lf_linkdate" value="{$value.linkdate}"> | ||
75 | <input type="hidden" name="token" value="{$token}"> | ||
76 | <input type="hidden" name="delete_link"> | ||
77 | <input type="image" alt="Delete" src="images/delete_icon.png#" title="Delete" | ||
78 | class="button_delete" onClick="return confirmDeleteLink();"> | ||
79 | </form> | ||
80 | </div> | ||
81 | {/if} | ||
82 | <span class="linktitle"> | ||
83 | <a href="{$value.real_url}">{$value.title}</a> | ||
84 | </span> | ||
85 | <br> | ||
86 | {if="$value.description"}<div class="linkdescription">{$value.description}</div>{/if} | ||
87 | {if="!$GLOBALS['config']['HIDE_TIMESTAMPS'] || isLoggedIn()"} | ||
88 | <span class="linkdate" title="Permalink"><a href="?{$value.linkdate|smallHash}">{function="strftime('%c', $value.timestamp)"} - permalink</a> - </span> | ||
89 | {else} | ||
90 | <span class="linkdate" title="Short link here"><a href="?{$value.shorturl}">permalink</a> - </span> | ||
91 | {/if} | ||
92 | |||
93 | {loop="$value.link_plugin"} | ||
94 | <span>{$value}</span> - | ||
95 | {/loop} | ||
96 | |||
97 | <a href="{$value.real_url}"><span class="linkurl" title="Short link">{$value.url}</span></a><br> | ||
98 | {if="$value.tags"} | ||
99 | <div class="linktaglist"> | ||
100 | {loop="value.taglist"}<span class="linktag" title="Add tag"><a href="?addtag={$value|urlencode}">{$value}</a></span> {/loop} | ||
101 | </div> | ||
102 | {/if} | ||
103 | |||
104 | |||
105 | </div> | ||
106 | </li> | ||
107 | {/loop} | ||
108 | </ul> | ||
109 | |||
110 | <div id="plugin_zone_end_linklist" class="plugin_zone"> | ||
111 | {loop="$plugin_end_zone"} | ||
112 | {$value} | ||
113 | {/loop} | ||
114 | </div> | ||
115 | |||
116 | {include="linklist.paging"} | ||
117 | |||
118 | </div> | ||
119 | |||
120 | {include="page.footer"} | ||
121 | |||
122 | <script src="inc/awesomplete.min.js#"></script> | ||
123 | <script src="inc/awesomplete-multiple-tags.js#"></script> | ||
124 | <script> | ||
125 | awesompleteUniqueTag('#tagfilter_value'); | ||
126 | </script> | ||
127 | </body> | ||
128 | </html> | ||
diff --git a/tpl/default/linklist.paging.html b/tpl/default/linklist.paging.html new file mode 100644 index 00000000..e91c8f86 --- /dev/null +++ b/tpl/default/linklist.paging.html | |||
@@ -0,0 +1,25 @@ | |||
1 | <div class="paging"> | ||
2 | {if="isLoggedIn()"} | ||
3 | <div class="paging_privatelinks"> | ||
4 | <a href="?privateonly"> | ||
5 | {if="$privateonly"} | ||
6 | <img src="images/private_16x16_active.png#" width="16" height="16" title="Click to see all links" alt="Click to see all links"> | ||
7 | {else} | ||
8 | <img src="images/private_16x16.png#" width="16" height="16" title="Click to see only private links" alt="Click to see only private links"> | ||
9 | {/if} | ||
10 | </a> | ||
11 | |||
12 | |||
13 | </div> | ||
14 | {/if} | ||
15 | {loop="$action_plugin"} | ||
16 | {$value} | ||
17 | {/loop} | ||
18 | <div class="paging_linksperpage"> | ||
19 | Links per page: <a href="?linksperpage=20">20</a> <a href="?linksperpage=50">50</a> <a href="?linksperpage=100">100</a> | ||
20 | <form method="GET" class="linksperpage"><input type="text" name="linksperpage" size="2"></form> | ||
21 | </div> | ||
22 | {if="$previous_page_url"} <a href="{$previous_page_url}" class="paging_older">◄Older</a> {/if} | ||
23 | <div class="paging_current">page {$page_current} / {$page_max} </div> | ||
24 | {if="$next_page_url"} <a href="{$next_page_url}" class="paging_newer">Newer►</a> {/if} | ||
25 | </div> | ||
diff --git a/tpl/default/page.footer.html b/tpl/default/page.footer.html new file mode 100644 index 00000000..8e380087 --- /dev/null +++ b/tpl/default/page.footer.html | |||
@@ -0,0 +1,31 @@ | |||
1 | <div id="footer"> | ||
2 | <b><a href="https://github.com/shaarli/Shaarli">Shaarli</a></b> - The personal, minimalist, super-fast, no-database delicious clone by the <a href="https://github.com/shaarli/Shaarli">Shaarli</a> community - <a href="doc/Home.html">Help/documentation</a> | ||
3 | {loop="$plugins_footer.text"} | ||
4 | {$value} | ||
5 | {/loop} | ||
6 | </div> | ||
7 | |||
8 | {loop="$plugins_footer.endofpage"} | ||
9 | {$value} | ||
10 | {/loop} | ||
11 | |||
12 | {if="$newVersion"} | ||
13 | <div id="newversion"> | ||
14 | <span id="version_id">●</span> Shaarli {$newVersion} is | ||
15 | <a href="https://github.com/shaarli/Shaarli/releases">available</a>. | ||
16 | </div> | ||
17 | {/if} | ||
18 | {if="$versionError"} | ||
19 | <div id="newversion"> | ||
20 | Error: {$versionError} | ||
21 | </div> | ||
22 | {/if} | ||
23 | {if="isLoggedIn()"} | ||
24 | <script>function confirmDeleteLink() { var agree=confirm("Are you sure you want to delete this link ?"); if (agree) return true ; else return false ; }</script> | ||
25 | {/if} | ||
26 | |||
27 | {loop="$plugins_footer.js_files"} | ||
28 | <script src="{$value}#"></script> | ||
29 | {/loop} | ||
30 | |||
31 | <script src="js/shaarli.js"></script> \ No newline at end of file | ||
diff --git a/tpl/default/page.header.html b/tpl/default/page.header.html new file mode 100644 index 00000000..9a4ecd85 --- /dev/null +++ b/tpl/default/page.header.html | |||
@@ -0,0 +1,128 @@ | |||
1 | <div class="shaarli-menu pure-g" id="shaarli-menu"> | ||
2 | <div class="pure-u-lg-0 pure-u-1"> | ||
3 | <div class="pure-menu"> | ||
4 | <a href="{if="!empty($GLOBALS['titleLink'])"}{$GLOBALS['titleLink']}{else}?{/if}" | ||
5 | class="pure-menu-link"> | ||
6 | <i class="fa fa-home"></i> | ||
7 | </a> | ||
8 | <a href="#" class="menu-toggle" id="menu-toggle"><s class="bar"></s><s class="bar"></s></a> | ||
9 | </div> | ||
10 | </div> | ||
11 | <div class="pure-u-1"> | ||
12 | <div class="pure-menu menu-transform pure-menu-horizontal"> | ||
13 | <ul class="pure-menu-list"> | ||
14 | <li class="pure-menu-item pure-menu-selected pure-u-0 pure-u-lg-visible"> | ||
15 | <a href="{if="!empty($GLOBALS['titleLink'])"}{$GLOBALS['titleLink']}{else}?{/if}" | ||
16 | class="pure-menu-link"> | ||
17 | <i class="fa fa-home"></i> | ||
18 | </a> | ||
19 | </li> | ||
20 | {if="isLoggedIn()"} | ||
21 | <li class="pure-menu-item"> | ||
22 | <a href="?do=addlink" class="pure-menu-link">Shaare</a> | ||
23 | </li> | ||
24 | <li class="pure-menu-item"> | ||
25 | <a href="?do=tools" class="pure-menu-link">Tools</a> | ||
26 | </li> | ||
27 | |||
28 | {elseif="$GLOBALS['config']['OPEN_SHAARLI']"} | ||
29 | <li class="pure-menu-item"> | ||
30 | <a href="?do=addlink" class="pure-menu-link">Shaare</a> | ||
31 | </li> | ||
32 | <li class="pure-menu-item"> | ||
33 | <a href="?do=tools" class="pure-menu-link">Tools</a> | ||
34 | </li> | ||
35 | {else} | ||
36 | <li class="pure-menu-item"> | ||
37 | <a href="?do=login" class="pure-menu-link">Login</a> | ||
38 | </li> | ||
39 | {/if} | ||
40 | <li class="pure-menu-item"> | ||
41 | <a href="{$feedurl}?do=rss{$searchcrits}" class="pure-menu-link">RSS Feed</a> | ||
42 | </li> | ||
43 | {if="$GLOBALS['config']['SHOW_ATOM']"} | ||
44 | <li class="pure-menu-item"> | ||
45 | <a href="{$feedurl}?do=atom{$searchcrits}" class="pure-menu-link">ATOM Feed</a> | ||
46 | </li> | ||
47 | {/if} | ||
48 | <li class="pure-menu-item"> | ||
49 | <a href="?do=tagcloud" class="pure-menu-link">Tag cloud</a> | ||
50 | </li> | ||
51 | <li class="pure-menu-item"> | ||
52 | <a href="?do=picwall{$searchcrits}" class="pure-menu-link">Picture wall</a> | ||
53 | </li> | ||
54 | <li class="pure-menu-item"> | ||
55 | <a href="?do=daily" class="pure-menu-link">Daily</a> | ||
56 | </li> | ||
57 | <!-- FIXME! update plugin system to handle this --> | ||
58 | {loop="$plugins_header.buttons_toolbar"} | ||
59 | <li class="pure-menu-item"> | ||
60 | <a href="{$value.url}" class="pure-menu-link">{$value.title}</a> | ||
61 | </li> | ||
62 | {/loop} | ||
63 | {if="isLoggedIn()"} | ||
64 | <li class="pure-menu-item"> | ||
65 | <a href="?do=logout" class="pure-menu-link">Logout</a> | ||
66 | </li> | ||
67 | {else} | ||
68 | <li class="pure-menu-item"> | ||
69 | <a href="?do=login" class="pure-menu-link">Login</a> | ||
70 | </li> | ||
71 | {/if} | ||
72 | </ul> | ||
73 | </div> | ||
74 | </div> | ||
75 | </div> | ||
76 | |||
77 | <div id="logo" title="Share your links !" onclick="document.location='?';"></div> | ||
78 | |||
79 | <div id="linkcount" class="nomobile"> | ||
80 | {if="!empty($linkcount)"}{$linkcount} links{/if} | ||
81 | </div> | ||
82 | |||
83 | <div id="menu"> | ||
84 | <ul> | ||
85 | <li><span id="shaarli_title"> | ||
86 | <a href="{$titleLink}">{$shaarlititle}</a> | ||
87 | </span> | ||
88 | </li> | ||
89 | |||
90 | {if="!empty($_GET['source']) && $_GET['source']=='bookmarklet'"} | ||
91 | {ignore} When called as a popup from bookmarklet, do not display menu. {/ignore} | ||
92 | {else} | ||
93 | <li><a href="?" class="nomobile">Home</a></li> | ||
94 | {if="isLoggedIn()"} | ||
95 | <li><a href="?do=logout">Logout</a></li> | ||
96 | <li><a href="?do=tools">Tools</a></li> | ||
97 | <li><a href="?do=addlink">Add link</a></li> | ||
98 | {elseif="$GLOBALS['config']['OPEN_SHAARLI']"} | ||
99 | <li><a href="?do=tools">Tools</a></li> | ||
100 | <li><a href="?do=addlink">Add link</a></li> | ||
101 | {else} | ||
102 | <li><a href="?do=login">Login</a></li> | ||
103 | {/if} | ||
104 | <li><a href="{$feedurl}?do=rss{$searchcrits}" class="nomobile">RSS Feed</a></li> | ||
105 | {if="$GLOBALS['config']['SHOW_ATOM']"} | ||
106 | <li><a href="{$feedurl}?do=atom{$searchcrits}" class="nomobile">ATOM Feed</a></li> | ||
107 | {/if} | ||
108 | <li><a href="?do=tagcloud">Tag cloud</a></li> | ||
109 | <li><a href="?do=picwall{$searchcrits}">Picture wall</a></li> | ||
110 | <li><a href="?do=daily">Daily</a></li> | ||
111 | {loop="$plugins_header.buttons_toolbar"} | ||
112 | {$value} | ||
113 | {/loop} | ||
114 | {/if} | ||
115 | </ul> | ||
116 | </div> | ||
117 | |||
118 | {if="!empty($plugin_errors) && isLoggedIn()"} | ||
119 | <ul class="errors"> | ||
120 | {loop="plugin_errors"} | ||
121 | <li>{$value}</li> | ||
122 | {/loop} | ||
123 | </ul> | ||
124 | {/if} | ||
125 | |||
126 | <div class="clear"></div> | ||
127 | |||
128 | |||