aboutsummaryrefslogtreecommitdiffhomepage
path: root/tpl/default/css/pure.css
diff options
context:
space:
mode:
authorArthurHoaro <arthur@hoa.ro>2017-02-27 20:24:28 +0100
committerGitHub <noreply@github.com>2017-02-27 20:24:28 +0100
commit5978588578ca103152598ccfbe41019b12e00a4f (patch)
treeeedbb83c420f6af103440bcafbe6b79738ce7521 /tpl/default/css/pure.css
parent9e5a37cc7f4eb1c83222a94eb83d4e99ce4460a4 (diff)
parent7dcbfde5ffbc057a44f710e3be7e4856d235e90b (diff)
downloadShaarli-5978588578ca103152598ccfbe41019b12e00a4f.tar.gz
Shaarli-5978588578ca103152598ccfbe41019b12e00a4f.tar.zst
Shaarli-5978588578ca103152598ccfbe41019b12e00a4f.zip
Merge pull request #754 from ArthurHoaro/webdesign2
New default template
Diffstat (limited to 'tpl/default/css/pure.css')
-rw-r--r--tpl/default/css/pure.css1475
1 files changed, 1475 insertions, 0 deletions
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/*!
2Pure v0.6.0
3Copyright 2014 Yahoo! Inc. All rights reserved.
4Licensed under the BSD License.
5https://github.com/yahoo/pure/blob/master/LICENSE.md
6*/
7/*!
8normalize.css v^3.0 | MIT License | git.io/normalize
9Copyright (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
19html {
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
29body {
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
43article,
44aside,
45details,
46figcaption,
47figure,
48footer,
49header,
50hgroup,
51main,
52menu,
53nav,
54section,
55summary {
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
64audio,
65canvas,
66progress,
67video {
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
77audio: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],
88template {
89 display: none;
90}
91
92/* Links
93 ========================================================================== */
94
95/**
96 * Remove the gray background color from active links in IE 10.
97 */
98
99a {
100 background-color: transparent;
101}
102
103/**
104 * Improve readability when focused and also mouse hovered in all browsers.
105 */
106
107a:active,
108a: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
119abbr[title] {
120 border-bottom: 1px dotted;
121}
122
123/**
124 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
125 */
126
127b,
128strong {
129 font-weight: bold;
130}
131
132/**
133 * Address styling not present in Safari and Chrome.
134 */
135
136dfn {
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
145h1 {
146 font-size: 2em;
147 margin: 0.67em 0;
148}
149
150/**
151 * Address styling not present in IE 8/9.
152 */
153
154mark {
155 background: #ff0;
156 color: #000;
157}
158
159/**
160 * Address inconsistent and variable font size in all browsers.
161 */
162
163small {
164 font-size: 80%;
165}
166
167/**
168 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
169 */
170
171sub,
172sup {
173 font-size: 75%;
174 line-height: 0;
175 position: relative;
176 vertical-align: baseline;
177}
178
179sup {
180 top: -0.5em;
181}
182
183sub {
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
194img {
195 border: 0;
196}
197
198/**
199 * Correct overflow not hidden in IE 9/10/11.
200 */
201
202svg: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
213figure {
214 margin: 1em 40px;
215}
216
217/**
218 * Address differences between Firefox and other browsers.
219 */
220
221hr {
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
231pre {
232 overflow: auto;
233}
234
235/**
236 * Address odd `em`-unit font size rendering in all browsers.
237 */
238
239code,
240kbd,
241pre,
242samp {
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
262button,
263input,
264optgroup,
265select,
266textarea {
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
276button {
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
287button,
288select {
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
300button,
301html input[type="button"], /* 1 */
302input[type="reset"],
303input[type="submit"] {
304 -webkit-appearance: button; /* 2 */
305 cursor: pointer; /* 3 */
306}
307
308/**
309 * Re-set default cursor for disabled elements.
310 */
311
312button[disabled],
313html input[disabled] {
314 cursor: default;
315}
316
317/**
318 * Remove inner padding and border in Firefox 4+.
319 */
320
321button::-moz-focus-inner,
322input::-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
332input {
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
344input[type="checkbox"],
345input[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
356input[type="number"]::-webkit-inner-spin-button,
357input[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
367input[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
380input[type="search"]::-webkit-search-cancel-button,
381input[type="search"]::-webkit-search-decoration {
382 -webkit-appearance: none;
383}
384
385/**
386 * Define consistent border, margin, and padding.
387 */
388
389fieldset {
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
400legend {
401 border: 0; /* 1 */
402 padding: 0; /* 2 */
403}
404
405/**
406 * Remove default vertical scrollbar in IE 8/9/10/11.
407 */
408
409textarea {
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
418optgroup {
419 font-weight: bold;
420}
421
422/* Tables
423 ========================================================================== */
424
425/**
426 * Remove most spacing between table cells.
427 */
428
429table {
430 border-collapse: collapse;
431 border-spacing: 0;
432}
433
434td,
435th {
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/*
534Resets the font family back to the OS/browser's default sans-serif font,
535this 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,
839a.pure-button-primary,
840a.pure-button-selected {
841 background-color: rgb(0, 120, 231);
842 color: #fff;
843}
844
845/*csslint box-model:false*/
846/*
847Box-model set to false because we're setting a height on select elements, which
848also have border and padding. This is done because some browsers don't render
849the padding. We explicitly set the box-model for select elements to border-box,
850so 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/*
881Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
882since 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/*
924Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
925since 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/*
966Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
967since 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/*
1042Need to separate out the :not() selector from the rest of the CSS 2.1 selectors
1043since 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
1427there'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/*
1441striping:
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}