/[svn]/doc/tmpl/css/main.css
ViewVC logotype

Annotation of /doc/tmpl/css/main.css

Parent Directory Parent Directory | Revision Log Revision Log


Revision 3282 - (hide annotations) (download) (as text)
Wed Jun 7 12:34:29 2017 UTC (6 years, 9 months ago) by schoenebeck
File MIME type: text/css
File size: 29842 byte(s)
- Site Template: Minor refinement of vertical TOC menu.

1 schoenebeck 2732 /*
2     CrudeDoc CSS Style
3 schoenebeck 3267 Copyright (c) 2015 - 2017 Christian Schoenebeck. All rights reserved.
4 schoenebeck 2732 http://www.crudebyte.com
5     */
6    
7     @import 'fontsbase.css';
8     @import 'jquery-ui.css';
9    
10     html {
11     font-family:CRDSans;
12     font-weight:200;
13     font-size:17px;
14     line-height:1.2;
15 schoenebeck 3268 background-color:#c1b5b5;
16 schoenebeck 3274 background: -webkit-linear-gradient(left, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Safari 5.1 to 6.0 */
17     background: -o-linear-gradient(right, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Opera 11.1 to 12.0 */
18     background: -moz-linear-gradient(right, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Firefox 3.6 to 15 */
19     background: linear-gradient(to left, #cbc3c2, #bfb2b0); /* Standard syntax */
20 schoenebeck 2732 }
21    
22     body {
23     padding:0;
24     margin:0;
25 schoenebeck 3274 background-color:#c1b5b5; /* fallback (non CSS3 browsers) */
26 schoenebeck 2732 background: -webkit-linear-gradient(left, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Safari 5.1 to 6.0 */
27     background: -o-linear-gradient(right, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Opera 11.1 to 12.0 */
28     background: -moz-linear-gradient(right, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Firefox 3.6 to 15 */
29     background: linear-gradient(to left, #cbc3c2, #bfb2b0); /* Standard syntax */
30     counter-reset:oli;
31     counter-reset:codeline;
32 schoenebeck 3267 -webkit-text-size-adjust:100%;
33 schoenebeck 2732 }
34    
35 schoenebeck 3272 .no-effect {
36     -webkit-transition: none !important;
37     -moz-transition: none !important;
38     -ms-transition: none !important;
39     -o-transition: none !important;
40     transition: none !important;
41     }
42 schoenebeck 2732
43    
44 schoenebeck 3272
45 schoenebeck 2732 /* top most header strip */
46    
47     .lslogo {
48     position:fixed; top:2px; left:6px;
49     border:none;
50     }
51    
52     header a {
53     color:#eaeaea;
54     text-decoration:none;
55     outline:none;
56     border:0;
57     }
58    
59     header {
60     position:fixed; top:0px;
61     z-index:4;
62     display:table;
63     background-color:#898989;
64     color:#eaeaea;
65     width:100%;
66     padding: 6px 0px 6px 0px;
67     font-size:18px;
68     font-weight:200;
69     vertical-align:middle;
70     }
71    
72     header > div {
73     display:table-cell;
74     text-align:left;
75     padding-left:39px;
76     vertical-align:middle;
77     }
78    
79     header > menu {
80     display:table-cell;
81     font-family:CRDHigh;
82     font-weight:300;
83     font-size:17px;
84     text-align:right;
85     vertical-align:middle;
86     padding:0; margin:0;
87     }
88    
89     header > menu a {
90     padding-right:20px;
91     text-shadow:none;
92     -webkit-transition: text-shadow 0.9s, color 0.9s; /* Safari */
93     -ms-transition: text-shadow 0.9s, color 0.9s;
94     -moz-transition: text-shadow 0.9s, color 0.9s;
95     -o-transition: text-shadow 0.9s, color 0.9s;
96     transition: text-shadow 0.9s linear, color 0.9s linear;
97     }
98    
99 schoenebeck 3268 .no-touch header > menu a:hover,
100     .touch header > menu a:focus,
101     .touch header > menu a:active
102     {
103 schoenebeck 2732 color:#ffffff;
104     text-shadow: 0px 0px 13px #ff9999;
105     -webkit-transition: text-shadow 0.31s, color 0.31s; /* Safari */
106     -ms-transition: text-shadow 0.31s, color 0.31s;
107     -moz-transition: text-shadow 0.31s, color 0.31s;
108     -o-transition: text-shadow 0.31s, color 0.31s;
109     transition: text-shadow 0.31s linear, color 0.31s linear;
110     }
111    
112     header > menu a:last-child {
113     padding-right:26px;
114     }
115    
116    
117    
118     /* upper horizontal document tree navigation strip */
119    
120     nav {
121     position:fixed; top:33px;
122     z-index:3;
123     width:100%;
124     font-size:18px;
125     border-bottom-style:solid;
126     border-bottom-width:1px;
127     border-bottom-color:#898989;
128     padding: 3px 0px 3px 172px;
129     background-color:#eaeaea; /* fallback (pre CSS3 browsers) */
130     background: -webkit-linear-gradient(rgba(251,251,251,1.0), rgba(186,186,186,1.0)); /* For Safari 5.1 to 6.0 */
131     background: -o-linear-gradient(rgba(251,251,251,1.0), rgba(186,186,186,1.0)); /* For Opera 11.1 to 12.0 */
132     background: -moz-linear-gradient(rgba(251,251,251,1.0), rgba(186,186,186,1.0)); /* For Firefox 3.6 to 15 */
133     background: linear-gradient(rgba(251,251,251,1.0), rgba(186,186,186,1.0)); /* Standard syntax */
134     box-shadow: 0px 10px 8px rgba(15,15,15,0.25);
135 schoenebeck 3271
136     -webkit-transition: -webkit-transform 0.16s ease, padding-left 0.2s ease;
137     -o-transition: -o-transform 0.16s ease, padding-left 0.2s ease;
138     -ms-transition: -ms-transform 0.16s ease, padding-left 0.2s ease;
139     -moz-transition: -moz-transform 0.16s ease, padding-left 0.2s ease;
140     transition: transform 0.16s ease, padding-left 0.2s ease;
141 schoenebeck 2732 }
142    
143 schoenebeck 3272 .no-effect nav {
144     -webkit-transition: none !important;
145     -moz-transition: none !important;
146     -ms-transition: none !important;
147     -o-transition: none !important;
148     transition: none !important;
149     }
150    
151 schoenebeck 3271 .no-toc nav {
152     padding-left:56px;
153    
154     -webkit-transition: -webkit-transform 0.16s ease, padding-left 0.2s ease;
155     -o-transition: -o-transform 0.16s ease, padding-left 0.2s ease;
156     -ms-transition: -ms-transform 0.16s ease, padding-left 0.2s ease;
157     -moz-transition: -moz-transform 0.16s ease, padding-left 0.2s ease;
158     transition: transform 0.16s ease, padding-left 0.2s ease;
159     }
160    
161 schoenebeck 3272 .no-effect
162     .no-toc nav {
163     -webkit-transition: none !important;
164     -moz-transition: none !important;
165     -ms-transition: none !important;
166     -o-transition: none !important;
167     transition: none !important;
168     }
169    
170 schoenebeck 3270 nav > div.foldbtn {
171     display:block;
172     position:fixed;
173 schoenebeck 3271 top:33;
174 schoenebeck 3270 left:10;
175     color:#998952;
176     font-weight:200;
177     font-size:28px;
178     }
179    
180 schoenebeck 2732 nav > ul {
181     list-style:none;
182     padding:0;
183     margin:0;
184     }
185    
186     nav > ul > li {
187     color:#5d5d5d;
188     font-weight:200;
189     text-decoration:none;
190     float:left;
191     padding:4px 4px 4px 3px;
192     }
193    
194 schoenebeck 3272 .no-touch nav > ul > li:hover,
195     .touch nav > ul > li.active
196     {
197 schoenebeck 2732 color:white;
198     background-color:rgba(80,80,80,0.5);
199     border-left-style:solid;
200     border-left-width:2px;
201     border-left-color:#a4a4a4;
202     border-right-style:solid;
203     border-right-width:2px;
204     border-right-color:#898989;
205     -webkit-border-top-right-radius: 8px;
206     -moz-border-radius-topright: 8px;
207     border-top-right-radius: 8px;
208     padding:4px 2px 4px 1px;
209     }
210    
211     nav > ul > li:last-child {
212     color:black;
213     font-weight:500;
214     }
215    
216 schoenebeck 3272 .no-touch nav > ul > li:last-child:hover,
217     .touch nav > ul > li:last-child.active
218     {
219 schoenebeck 2732 color:white;
220     }
221    
222     nav > ul > li::before {
223     content: "���";
224     color:#b4b4b4;
225     padding-left:2px;
226     padding-right:5px;
227     }
228    
229 schoenebeck 3267 .iOS
230     nav > ul > li::before {
231     font-family:"Hiragino Mincho ProN";
232     }
233    
234 schoenebeck 2732 nav > ul > li:first-child::before {
235     content: "";
236     }
237    
238     nav a {
239     text-decoration:none;
240     color:inherit;
241     outline:none;
242     border:0;
243     }
244    
245     nav > ul > li ul { /* base rule for drop down menu */
246     overflow:auto;
247     position:absolute; top:32px;
248     min-width:230px;
249     list-style-type:none;
250     margin:0px 0px 0px -3px;
251     padding:1px 1px 1px 1px;
252     background-color:rgba(80,80,80,0.77);
253     border-bottom-style:solid;
254     border-bottom-width:4px;
255     border-bottom-color:#898989;
256     border-right-style:solid;
257     border-right-width:2px;
258     border-right-color:#898989;
259     border-left-style:solid;
260     border-left-width:2px;
261     border-left-color:#a4a4a4;
262     color:white;
263     -webkit-border-bottom-left-radius: 5px;
264     -moz-border-radius-bottomleft: 5px;
265     border-bottom-left-radius: 5px;
266     -webkit-border-bottom-right-radius: 5px;
267     -moz-border-radius-bottomright: 5px;
268     border-bottom-right-radius: 5px;
269     -webkit-border-top-right-radius: 5px;
270     -moz-border-radius-topright: 5px;
271     border-top-right-radius: 5px;
272     }
273    
274     .hasTransform
275     nav > ul > li ul { /* rule extension for drop down menu */
276     display:block;
277     opacity:0;
278    
279     -webkit-transform: scaleY(0);
280     -o-transform: scaleY(0);
281     -ms-transform: scaleY(0);
282     -moz-transform: scaleY(0);
283     transform: scaleY(0);
284    
285     -webkit-transform-origin: top;
286     -o-transform-origin: top;
287     -ms-transform-origin: top;
288     -moz-transform-origin: top;
289     transform-origin: top;
290    
291     -webkit-transition: -webkit-transform 0.16s ease, opacity 0.2s ease;
292     -o-transition: -o-transform 0.16s ease, opacity 0.2s ease;
293     -ms-transition: -ms-transform 0.16s ease, opacity 0.2s ease;
294     -moz-transition: -moz-transform 0.16s ease, opacity 0.2s ease;
295     transition: transform 0.16s ease, opacity 0.2s ease;
296     }
297    
298 schoenebeck 3272
299     .no-touch .hasTransform nav > ul > li:hover ul,
300     .touch .hasTransform nav > ul > li.active ul
301     { /* rule extension for drop down menu */
302 schoenebeck 2732 display:block;
303     opacity:1;
304    
305     -webkit-transform: scaleY(1);
306     -o-transform: scaleY(1);
307     -ms-transform: scaleY(1);
308     -moz-transform: scaleY(1);
309     transform: scaleY(1);
310    
311     -webkit-transition: -webkit-transform 0.1s ease;
312     -o-transition: -o-transform 0.1s ease;
313     -ms-transition: -ms-transform 0.1s ease;
314     -moz-transition: -moz-transform 0.1s ease;
315     transition: transform 0.1s ease;
316     }
317    
318     body:not(.hasTransform)
319     nav > ul > li ul { /* fallback rule extension for older browsers */
320     display:none;
321     }
322    
323     body:not(.hasTransform)
324     nav > ul > li:hover ul { /* fallback rule extension for older browsers */
325     display:block;
326     }
327    
328     nav > ul > li li {
329     padding:3px 14px 3px 14px;
330     -webkit-transition: background-color 0.45s; /* Safari */
331     -moz-transition: background-color 0.45s;
332     -ms-transition: background-color 0.45s;
333     -o-transition: background-color 0.45s;
334     transition: background-color 0.45s linear;
335     }
336    
337     nav > ul > li li:hover {
338     background-color:rgba(255,0,0,0.32);
339     -webkit-transition: background-color 0.21s; /* Safari */
340     -moz-transition: background-color 0.21s;
341     -ms-transition: background-color 0.21s;
342     -o-transition: background-color 0.21s;
343     transition: background-color 0.21s linear;
344     }
345    
346    
347    
348     /* article's table of contents (on left side) */
349    
350     aside {
351     position:fixed; top:66px;
352     z-index:2;
353     width:180px;
354 schoenebeck 2734 max-height: -webkit-calc(100% - 67px);
355 schoenebeck 2732 max-height: -moz-calc(100% - 67px);
356     max-height: -o-calc(100% - 67px);
357     max-height: calc(100% - 67px);
358     overflow:auto;
359     overflow-x:hidden;
360     font-family:CRDHigh;
361     color:#5d5d5d;
362     padding:0 0 0 0;
363     margin:0 0 0 0;
364     border-right-style:solid;
365     border-right-width:1px;
366     border-right-color:#ababab;
367    
368     -webkit-border-bottom-right-radius: 11px;
369     -moz-border-radius-bottomright: 11px;
370     border-bottom-right-radius: 11px;
371    
372     -webkit-border-bottom-left-radius: 11px;
373     -moz-border-radius-bottomleft: 11px;
374     border-bottom-left-radius: 11px;
375 schoenebeck 3270
376     -webkit-transition: -webkit-transform 0.16s ease, width 0.2s ease;
377     -o-transition: -o-transform 0.16s ease, width 0.2s ease;
378     -ms-transition: -ms-transform 0.16s ease, width 0.2s ease;
379     -moz-transition: -moz-transform 0.16s ease, width 0.2s ease;
380     transition: transform 0.16s ease, width 0.2s ease;
381 schoenebeck 2732 }
382    
383 schoenebeck 3272 .no-effect aside {
384     -webkit-transition: none !important;
385     -moz-transition: none !important;
386     -ms-transition: none !important;
387     -o-transition: none !important;
388     transition: none !important;
389     }
390    
391 schoenebeck 3270 .no-toc aside {
392     overflow:hidden;
393     width:0;
394    
395     -webkit-transition: -webkit-transform 0.16s ease, width 0.2s ease;
396     -o-transition: -o-transform 0.16s ease, width 0.2s ease;
397     -ms-transition: -ms-transform 0.16s ease, width 0.2s ease;
398     -moz-transition: -moz-transform 0.16s ease, width 0.2s ease;
399     transition: transform 0.16s ease, width 0.2s ease;
400     }
401    
402 schoenebeck 3272 .no-effect
403     .no-toc aside {
404     -webkit-transition: none !important;
405     -moz-transition: none !important;
406     -ms-transition: none !important;
407     -o-transition: none !important;
408     transition: none !important;
409     }
410    
411 schoenebeck 2732 aside > div.toc {
412     z-index:2;
413     width:inherit;
414     padding:0px 0px 0px 0px;
415     margin:0px 0px 0px 0px;
416    
417     background-color:#cbc3c2; /* fallback (non CSS3 browsers) */
418     background: -webkit-linear-gradient(left, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Safari 5.1 to 6.0 */
419     background: -o-linear-gradient(right, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Opera 11.1 to 12.0 */
420     background: -moz-linear-gradient(right, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Firefox 3.6 to 15 */
421     background: linear-gradient(to left, #cbc3c2, #bfb2b0); /* Standard syntax */
422    
423     -webkit-border-bottom-left-radius: 11px;
424     -moz-border-radius-bottomleft: 11px;
425     border-bottom-left-radius: 11px;
426    
427     -webkit-border-bottom-right-radius: 11px;
428     -moz-border-radius-bottomright: 11px;
429     border-bottom-right-radius: 11px;
430     }
431    
432     aside a {
433     text-decoration:inherit;
434     color:inherit;
435     outline:none;
436     border:0;
437     }
438    
439     aside > div.toc ul {
440     list-style-type:none;
441     list-style-position:inside;
442     padding:0px 0px 0px 0px;
443     margin:0px 0px 0px 0px;
444     }
445    
446     aside > div.toc > ul {
447     background-color:#d0d0d0; /* fallback (pre CSS3 browsers) */
448     background: -webkit-linear-gradient(rgba(255,255,255,0.43), rgba(136,136,136,1.49)); /* For Safari 5.1 to 6.0 */
449     background: -o-linear-gradient(rgba(255,255,255,0.43), rgba(136,136,136,0.49)); /* For Opera 11.1 to 12.0 */
450     background: -moz-linear-gradient(rgba(255,255,255,0.43), rgba(136,136,136,0.49)); /* For Firefox 3.6 to 15 */
451     background: linear-gradient(rgba(255,255,255,0.43), rgba(136,136,136,0.49)); /* Standard syntax */
452     }
453    
454     aside > div.toc > ul > li {
455     font-size:20px;
456     font-weight:400;
457     margin:0px 0px 0px 0px;
458     padding:5px 20px 5px 24px;
459     border-bottom-style:solid;
460     border-bottom-width:1px;
461     border-bottom-color:#898989;
462     text-align:right;
463     -webkit-transition: background-color 0.45s; /* Safari */
464     -moz-transition: background-color 0.45s;
465     -ms-transition: background-color 0.45s;
466     -o-transition: background-color 0.45s;
467     transition: background-color 0.45s linear;
468     }
469    
470     aside .current {
471     color:#caad2c;
472     text-shadow: 0px 0px 8px #fbf1f1;
473     }
474    
475     aside > div.toc > ul > li > ul {
476     color:#5d5d5d;
477     }
478    
479     aside > div.toc > ul > li > ul > li {
480     font-size:15px;
481     font-weight:200;
482     text-align:right;
483     padding:0;
484     margin: 4px 0px 4px 0px;
485     }
486    
487     aside > div.toc > ul > li > ul > li.current {
488     color:#caad2c;
489     text-shadow: 0px 0px 8px #fbf1f1;
490     }
491    
492 schoenebeck 3268
493     .no-touch aside > div.toc > ul > li:hover,
494     .touch aside > div.toc > ul > li:focus,
495     .touch aside > div.toc > ul > li:active
496     {
497 schoenebeck 2732 background-color:rgba(255,0,0,0.22);
498     -webkit-transition: background-color 0.25s; /* Safari */
499     -moz-transition: background-color 0.25s;
500     -ms-transition: background-color 0.25s;
501     -o-transition: background-color 0.25s;
502     transition: background-color 0.25s linear;
503     }
504    
505 schoenebeck 3282 .no-touch aside > div.toc > ul > li > ul > li:before {
506     visibility:hidden;
507     content:url('../pix/disc.png');
508     padding-right:6px;
509     }
510    
511     .no-touch aside > div.toc > ul > li > ul > li:hover:before
512 schoenebeck 3268 {
513 schoenebeck 3282 visibility:visible;
514 schoenebeck 2732 }
515    
516     aside > div.toc > div.buttons {
517     display:table;
518     width:100%;
519     overflow:hidden;
520     margin:3px 0px 0px 0px;
521     position:relative; bottom:2px;
522     z-index:8;
523     color:#5d5d5d;
524    
525     -webkit-border-bottom-right-radius: 11px;
526     -moz-border-radius-bottomright: 11px;
527     border-bottom-right-radius: 11px;
528    
529     -webkit-border-bottom-left-radius: 11px;
530     -moz-border-radius-bottomleft: 11px;
531     border-bottom-left-radius: 11px;
532     }
533    
534     aside > div.toc > div.buttons > * {
535     display:table-cell;
536     width:50%;
537     font-family:CRDHigh;
538     font-weight:400;
539     color:#5d5d5d;
540     padding:4px 4px 4px 4px;
541     border-bottom-style:solid;
542     border-bottom-width:1px;
543     border-bottom-color:#898989;
544     }
545    
546     aside > div.toc > div.buttons > .disabled {
547     color:#959595;
548     }
549    
550     aside > div.toc > div.buttons > * {
551     background-color:#d4d4d8; /* fallback */
552     background-color:rgba(242,242,248,0.45);
553     -webkit-transition: background-color 0.5s; /* Safari */
554     -moz-transition: background-color 0.5s;
555     -ms-transition: background-color 0.5s;
556     -o-transition: background-color 0.5s;
557     transition: background-color 0.5s linear;
558     }
559    
560     aside > div.toc > div.buttons > *:first-child {
561     text-align:left;
562    
563     border-left-style:solid;
564     border-left-width:1px;
565     border-left-color:#898989;
566    
567     -webkit-border-bottom-left-radius: 11px;
568     -moz-border-radius-bottomleft: 11px;
569     border-bottom-left-radius: 11px;
570     }
571    
572     aside > div.toc > div.buttons > *:last-child {
573     text-align:right;
574    
575     border-left-style:solid;
576     border-left-width:1px;
577     border-left-color:#898989;
578    
579     /* FIXME: would create an undesired 1px gap on the right */
580     /*border-right-style:solid;
581     border-right-width:1px;
582     border-right-color:#898989;*/
583    
584     -webkit-border-bottom-right-radius: 11px;
585     -moz-border-radius-bottomright: 11px;
586     border-bottom-right-radius: 11px;
587     }
588    
589 schoenebeck 3268 .no-touch aside > div.toc > div.buttons > *:not(.disabled):hover,
590     .touch aside > div.toc > div.buttons > *:not(.disabled):focus,
591     .touch aside > div.toc > div.buttons > *:not(.disabled):active
592     {
593 schoenebeck 2732 background-color:rgba(255,0,0,0.21);
594     -webkit-transition: background-color 0.25s; /* Safari */
595     -moz-transition: background-color 0.25s;
596     -ms-transition: background-color 0.25s;
597     -o-transition: background-color 0.25s;
598     transition: background-color 0.25s linear;
599     }
600    
601     aside > div.toc > div.buttons .arrow {
602     vertical-align:top;
603     font-size:15px;
604     }
605    
606 schoenebeck 3267 .iOS
607     aside > div.toc > div.buttons .arrow {
608     font-family:"Hiragino Mincho ProN";
609     }
610 schoenebeck 2732
611    
612 schoenebeck 3267
613 schoenebeck 2732 /* Article */
614    
615     article {
616     display:block;
617 schoenebeck 2734 width: -webkit-calc(100% - 181);
618 schoenebeck 2732 width: -moz-calc(100% - 181);
619     width: -o-calc(100% - 181);
620     width: calc(100% - 181);
621     background-color:white;
622     margin-top: 67px;
623     padding: 16px 70px 95px 70px;
624     margin-left:181px;
625     font-size:18px;
626     font-weight:200;
627     border-left-style:solid;
628     border-left-width:1px;
629     border-left-color:#898989;
630 schoenebeck 3270
631     -webkit-transition: -webkit-transform 0.16s ease, margin-left 0.2s ease;
632     -o-transition: -o-transform 0.16s ease, margin-left 0.2s ease;
633     -ms-transition: -ms-transform 0.16s ease, margin-left 0.2s ease;
634     -moz-transition: -moz-transform 0.16s ease, margin-left 0.2s ease;
635     transition: transform 0.16s ease, margin-left 0.2s ease;
636 schoenebeck 2732 }
637    
638 schoenebeck 3272 .no-effect article {
639     -webkit-transition: none !important;
640     -moz-transition: none !important;
641     -ms-transition: none !important;
642     -o-transition: none !important;
643     transition: none !important;
644     }
645    
646 schoenebeck 3270 .no-toc article {
647     margin-left:0px;
648    
649     -webkit-transition: -webkit-transform 0.16s ease, margin-left 0.2s ease;
650     -o-transition: -o-transform 0.16s ease, margin-left 0.2s ease;
651     -ms-transition: -ms-transform 0.16s ease, margin-left 0.2s ease;
652     -moz-transition: -moz-transform 0.16s ease, margin-left 0.2s ease;
653     transition: transform 0.16s ease, margin-left 0.2s ease;
654     }
655    
656 schoenebeck 3272 .no-effect
657     .no-toc article {
658     -webkit-transition: none !important;
659     -moz-transition: none !important;
660     -ms-transition: none !important;
661     -o-transition: none !important;
662     transition: none !important;
663     }
664    
665 schoenebeck 2732 article h1 {
666     clear:both;
667     border-bottom-style:solid;
668     border-bottom-width:1px;
669     border-bottom-color:#898989;
670     text-align:center;
671     font-family:CRDHigh;
672     font-size:32px;
673     font-weight:700;
674     color:#a19f9f;
675     padding-top:45px;
676     padding-bottom:28px;
677     margin-top:0;
678     margin-bottom:40px;
679     }
680    
681     article h2 {
682     clear:both;
683     border-bottom-style:solid;
684     border-bottom-width:1px;
685     border-bottom-color:#898989;
686     font-family:CRDHigh;
687     font-size:26px;
688     font-weight:400;
689     padding-top:35px;
690     padding-bottom:16px;
691     margin-top:0;
692     margin-bottom:28px;
693     }
694    
695     article h3 {
696     clear:both;
697     padding-top:20px;
698     padding-bottom:0px;
699     margin-top:0;
700     margin-bottom:0;
701     font-family:CRDHigh;
702     color:#9a6938;
703     font-size:24px;
704     font-weight:300;
705     }
706    
707 schoenebeck 2784 article p {
708     clear:both;
709     }
710    
711 schoenebeck 2961 /* automatically center the 1st paragraph (block) directly after a h1 type header (since that header type is centered as well) */
712     article h1 + p {
713     display:table; /*HACK: "block" would stretch the entire page width */
714     margin-left:auto;
715     margin-right:auto;
716     }
717    
718 schoenebeck 2732 article a {
719     font-weight:400;
720     color:#1ba1dd;
721     text-decoration:none;
722     outline:none;
723 schoenebeck 2734 border:none;
724 schoenebeck 2732 }
725    
726 schoenebeck 2736 article a img {
727     border:none;
728     text-decoration:none;
729     }
730    
731 schoenebeck 2831 article li img {
732     float:left;
733     }
734    
735 schoenebeck 3268 .no-touch article a:hover,
736     .touch article a:focus,
737     .touch article a:active
738     {
739 schoenebeck 2732 text-decoration:underline;
740     }
741    
742     article ul {
743     font-weight:inherit;
744     padding:0 0 0 60px;
745     margin:0 0 21px 0;
746     }
747    
748     article ul li {
749     list-style-type:disc;
750     padding:4px 0 0 14px;
751     margin:12px 0 0 0;
752     }
753    
754    
755     article ol {
756     counter-reset:oli;
757     font-weight:inherit;
758     padding:0 0 0 29px;
759     margin:0 0 21px 0;
760     }
761    
762     article ol li:before {
763     content:counters(oli,".") ".";
764     counter-increment:oli;
765     font-weight:600;
766     margin:0 20px 0 0;
767     }
768    
769     article ol li {
770     list-style-type:none;
771     padding:4px 0 0 14px;
772     margin:12px 0 0 0;
773     }
774    
775    
776    
777     article code, article .code {
778     font-family:CRDCour;
779     color:#404040;
780     white-space:pre;
781     }
782    
783     article code {
784     display:inline-block;
785     font-size:15px;
786     margin:0 3px 0px 3px;
787     padding:2px 6px 0px 6px;
788     background-color:#fcf9f9;
789     }
790    
791     article > code {
792     display:block;
793     font-size:15px;
794     margin:0 37px 0 37px;
795     padding:2px 6px 0px 6px;
796     background-color:#fcf9f9;
797     }
798    
799     article ul.code {
800     list-style:outside none none;
801     counter-reset:codeline;
802     font-size:14px;
803     font-weight:normal;
804     line-height:1.1;
805     margin:0 0 0 0;
806     padding:8px 0px 8px 0px;
807     }
808    
809     article .code li {
810     display:block;
811     list-style-type:none;
812     white-space:pre-wrap;
813     border-left:32px solid #f9f3f3;
814     text-indent:-30px;
815     background-color:#fcf9f9;
816     margin:0 0 0 0;
817     padding:0 0 0 0;
818     }
819    
820     article .code li:first-child {
821     padding-top:6px;
822     }
823    
824     article .code li:last-child {
825     padding-bottom:3px;
826     }
827    
828     article .code li:before {
829     display:inline-block;
830     white-space:pre;
831     content:counter(codeline,decimal) ". ";
832     counter-increment:codeline;
833     min-width:38px;
834     text-align:right;
835     color:#c9c9c9;
836     }
837    
838     article .code .k, article code .k { /*keyword*/
839     font-weight:bold;
840     color:black;
841     }
842    
843     article .code .n, article code .n { /*number*/
844     color:#c4950c;
845     }
846    
847     article .code .i, article code .i { /*identifier (function name)*/
848     /*color:#0c4fc4;*/
849     color:#1ba1dd;
850     }
851    
852     article .code .a, article code .a { /*array variable*/
853     color:#790cc4;
854     /*color:black;*/
855     }
856    
857     article .code .c, article code .c { /*characters*/
858     color:#c40c0c;
859     }
860    
861     article .code .s, article code .s { /*string variable*/
862     /*color:#9a693c;*/
863     /*color:black;*/
864     color:#790cc4;
865     }
866    
867     article .code .v, article code .v { /*integer variable*/
868     /*color:black;*/
869     color:#790cc4;
870     }
871    
872     article .code .h, article code .h { /*event handler*/
873     font-weight:bold;
874     color:#07c0cf;
875     }
876    
877     article .code .q, article code .q { /*comment*/
878     color:#9c9c9c;
879     font-style:italic;
880     }
881    
882     article .code .p, article code .p { /*preprocessor statements*/
883     /*color:#87b1a8;*/
884     color:#2f8a33;
885     /*font-style:italic;*/
886     font-weight:normal;
887     }
888    
889     article .code .m, article code .m { /* metaphor (natural language text used as pseudo code) */
890     background-color:#ddf4fd;
891     font-size:14px;
892     color:black;
893     font-weight:normal;
894     border:solid 1px #73a3ab;
895     -webkit-border-radius: 10px;
896     -moz-border-radius: 10px;
897     border-radius: 10px;
898     margin:0 0 0 0;
899     padding:2px 4px 0px 4px;
900     }
901    
902     article table {
903     margin:20px 37px 20px 37px;
904     padding:0 0 0 0;
905     /*background-color:red;*/
906     border:none;
907     border-collapse:collapse;
908     }
909    
910     article tr {
911     padding:0 0 0 0;
912     margin:0 0 0 0;
913     }
914    
915     article th {
916 schoenebeck 3090 background-color:#e0e0ff;
917 schoenebeck 2732 padding:0px 8px 0px 8px;
918     margin:0 0 0 0;
919     border:3px solid white;
920     font-size:16px;
921     font-weight:600;
922     }
923    
924     article td {
925     background-color:#f9f7f7;
926     padding:4px 8px 4px 8px;
927     margin:0 0 0 0;
928     border:3px solid white;
929     font-size:16px;
930     font-weight:300;
931     line-height:1.2;
932     }
933    
934     article table a {
935     font-weight:400;
936     }
937    
938     article note:before {
939     white-space:pre-wrap;
940     content:'NOTE: ';
941     font-weight:500;
942     }
943    
944     article note.important:before {
945     white-space:pre-wrap;
946     content:'IMPORTANT: ';
947     font-weight:500;
948     }
949    
950     article note {
951     display:table; /*HACK: "block" would stretch the entire page width */
952     background-color:#ede8e8;
953     border-top:none;
954     border-right:none;
955     border-bottom:none;
956     border-left:solid 10px #898989;
957     margin: 24px auto 27px 43px;
958     padding: 15px 18px 15px 18px;
959 schoenebeck 2734 max-width: -webkit-calc(100% - 145px);
960     max-width: -moz-calc(100% - 145px);
961     max-width: -o-calc(100% - 145px);
962     max-width: calc(100% - 145px);
963 schoenebeck 2732 }
964    
965 schoenebeck 2959 article td > note {
966     display:block; /*HACK: override "table" default value assigned above in the context of a table cell, otherwise padding will be ignored */
967     }
968    
969 schoenebeck 2732 article note.important {
970     border-left:solid 10px #ff4141;
971     }
972    
973     article > img, example > img {
974     display:block;
975     clear:both;
976     max-width:100%;
977     margin-left:auto;
978     margin-right:auto;
979     /*border:solid 1px #8e8e8e;*/
980     padding-top:25px;
981     border:none;
982     }
983    
984     article p img {
985     display:inline-block;
986     float:left;
987 schoenebeck 2821 margin:4px 20px 19px 0px;
988 schoenebeck 2732 padding:0 0 0 0;
989     /*border:solid 1px #8e8e8e;*/
990     border:none;
991     max-width:99%;
992     }
993    
994     article div.imgcptn {
995     display:block;
996     width:100%;
997     text-align:center;
998     font-weight:200;
999     color:#999999;
1000     font-size:16px;
1001     font-style:italic;
1002     margin: 8px 0 16px 0;
1003     }
1004    
1005     article example:before {
1006     display:block;
1007     position:relative; top:-5px; left:-32px;
1008     content:'Example';
1009     font-weight:500;
1010     color:white;
1011     border:none;
1012     margin:0;
1013     padding:0;
1014     width:100px;
1015     background-color:#dedede;
1016     /* -moz-transform: rotate(30deg);
1017     -ms-transform: rotate(30deg);
1018     -o-transform: rotate(30deg);
1019     -webkit-transform: rotate(30deg);
1020     transform: rotate(90deg);
1021     transform-origin: 0% 50%;*/
1022     text-align:center;
1023     }
1024    
1025     article example {
1026     display:inline-block;
1027    
1028 schoenebeck 2734 width: -webkit-calc(100% - 80px);
1029 schoenebeck 2732 width: -moz-calc(100% - 80px);
1030     width: -o-calc(100% - 80px);
1031     width: calc(100% - 80px);
1032    
1033     border-top:solid 1px #e5e5e5;
1034     border-right:solid 18px #dedede;
1035     border-bottom:solid 1px #e5e5e5;
1036     border-left:solid 18px #dedede;
1037     margin:0px, 20px, 0px, 20px;
1038     padding:5px 15px 8px 24px;
1039     }
1040    
1041 schoenebeck 2738 article dir {
1042     display:block;
1043     list-style-type:none;
1044     background-image:url('../pix/folder.png');
1045     background-repeat:no-repeat;
1046     background-position:2px top;
1047     padding:0px;
1048     margin:0px;
1049     font-family:CRDCour;
1050 schoenebeck 2740 font-size:15px;
1051 schoenebeck 2738 color:#000000;
1052     }
1053 schoenebeck 2732
1054 schoenebeck 2749 article > dir, example > dir {
1055 schoenebeck 2738 padding-left:66px;
1056     background-position:36px top;
1057     }
1058 schoenebeck 2732
1059 schoenebeck 2738 article dir > * {
1060     padding-top:2px;
1061     padding-bottom:2px;
1062     padding-left:31px;
1063     }
1064    
1065     article dir file {
1066     display:block;
1067     list-style-type:none;
1068     background-image:url('../pix/file.png');
1069     background-repeat:no-repeat;
1070     background-position:2px top;
1071     font-family:CRDCour;
1072 schoenebeck 2740 font-size:15px;
1073 schoenebeck 2738 color:#6f6f6f;
1074     }
1075    
1076    
1077    
1078 schoenebeck 2732 /* article footer */
1079    
1080     article > ul.docpager {
1081     display:table;
1082     margin:0 0 0 0;
1083     padding:50px 0 0 0;
1084     width:100%;
1085     }
1086    
1087     article > ul.docpager > li {
1088     display:table-cell;
1089     width:33%;
1090     margin:0 0 0 0;
1091     padding:0 0 0 0;
1092     }
1093    
1094     article > ul.docpager > li:nth-child(1) {
1095     text-align:left;
1096     padding-right:10px;
1097     }
1098    
1099     article > ul.docpager > li:nth-child(1) > a:before {
1100     content: "��� ";
1101     }
1102    
1103 schoenebeck 3267 .iOS
1104     article > ul.docpager > li:nth-child(1) > a:before {
1105     font-family:"Hiragino Mincho ProN";
1106     }
1107    
1108 schoenebeck 2732 article > ul.docpager > li:nth-child(2) {
1109     text-align:center;
1110     padding-left:10px;
1111     padding-right:10px;
1112     }
1113    
1114     article > ul.docpager > li:nth-child(2) > a:before {
1115     content: "��� ";
1116     }
1117    
1118 schoenebeck 3267 .iOS
1119     article > ul.docpager > li:nth-child(2) > a:before {
1120     font-family:"Hiragino Mincho ProN";
1121     }
1122    
1123 schoenebeck 2732 article > ul.docpager > li:nth-child(3) {
1124     text-align:right;
1125     padding-left:10px;
1126     }
1127    
1128     article > ul.docpager > li:nth-child(3) > a:after {
1129     content: " ���";
1130     }
1131    
1132 schoenebeck 3267 .iOS
1133     article > ul.docpager > li:nth-child(3) > a:after {
1134     font-family:"Hiragino Mincho ProN";
1135     }
1136    
1137 schoenebeck 2732 article > .endline {
1138     font-family:CRDSans;
1139     font-size:16px;
1140     font-weight:300;
1141     color:#9d9d9d;
1142     border-top:solid 1px #dedede;
1143     border-left:none;
1144     border-right:none;
1145     border-bottom:none;
1146     margin:30px 0 0 0;
1147     padding:10px 0 0 0;
1148     }
1149    
1150    
1151    
1152     /* very bottom footer */
1153    
1154     footer {
1155     position:relative;
1156     z-index:1;
1157     display:block;
1158     width:100%;
1159     background-color:#aaaaaa; /* fallback */
1160     background: -webkit-linear-gradient(left, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Safari 5.1 to 6.0 */
1161     background: -o-linear-gradient(right, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Opera 11.1 to 12.0 */
1162     background: -moz-linear-gradient(right, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Firefox 3.6 to 15 */
1163     background: linear-gradient(to left, #cbc3c2, #bfb2b0); /* Standard syntax */
1164     margin:0px 0px 0px 0px;
1165     padding: 24px 0px 28px 0px;
1166     font-family: CRDHigh;
1167     font-size:15px;
1168     font-weight:200;
1169     color:white;
1170     text-align:center;
1171     border-top-style:solid;
1172     border-top-width:1px;
1173     border-top-color:#898989;
1174     }
1175    
1176     footer a {
1177     color:inherit;
1178     text-decoration:none;
1179     outline:none;
1180     border:0;
1181     }
1182    
1183 schoenebeck 3268 .no-touch footer a:hover,
1184     .touch footer a:focus,
1185     .touch footer a:active
1186     {
1187 schoenebeck 2732 text-decoration:underline;
1188     }

  ViewVC Help
Powered by ViewVC