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

Contents of /doc/tmpl/css/main.css

Parent Directory Parent Directory | Revision Log Revision Log


Revision 3274 - (show annotations) (download) (as text)
Sun Jun 4 16:13:57 2017 UTC (6 years, 10 months ago) by schoenebeck
File MIME type: text/css
File size: 29810 byte(s)
- Site Template: Minor visual correction.

1 /*
2 CrudeDoc CSS Style
3 Copyright (c) 2015 - 2017 Christian Schoenebeck. All rights reserved.
4 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 background-color:#c1b5b5;
16 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 }
21
22 body {
23 padding:0;
24 margin:0;
25 background-color:#c1b5b5; /* fallback (non CSS3 browsers) */
26 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 -webkit-text-size-adjust:100%;
33 }
34
35 .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
43
44
45 /* 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 .no-touch header > menu a:hover,
100 .touch header > menu a:focus,
101 .touch header > menu a:active
102 {
103 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
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 }
142
143 .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 .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 .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 nav > div.foldbtn {
171 display:block;
172 position:fixed;
173 top:33;
174 left:10;
175 color:#998952;
176 font-weight:200;
177 font-size:28px;
178 }
179
180 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 .no-touch nav > ul > li:hover,
195 .touch nav > ul > li.active
196 {
197 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 .no-touch nav > ul > li:last-child:hover,
217 .touch nav > ul > li:last-child.active
218 {
219 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 .iOS
230 nav > ul > li::before {
231 font-family:"Hiragino Mincho ProN";
232 }
233
234 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
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 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 max-height: -webkit-calc(100% - 67px);
355 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
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 }
382
383 .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 .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 .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 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
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 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 .no-touch aside > div.toc > ul > li > ul > li:hover,
506 .touch aside > div.toc > ul > li > ul > li:focus,
507 .touch aside > div.toc > ul > li > ul > li:active
508 {
509 list-style-type:disc;
510 }
511
512 aside > div.toc > div.buttons {
513 display:table;
514 width:100%;
515 overflow:hidden;
516 margin:3px 0px 0px 0px;
517 position:relative; bottom:2px;
518 z-index:8;
519 color:#5d5d5d;
520
521 -webkit-border-bottom-right-radius: 11px;
522 -moz-border-radius-bottomright: 11px;
523 border-bottom-right-radius: 11px;
524
525 -webkit-border-bottom-left-radius: 11px;
526 -moz-border-radius-bottomleft: 11px;
527 border-bottom-left-radius: 11px;
528 }
529
530 aside > div.toc > div.buttons > * {
531 display:table-cell;
532 width:50%;
533 font-family:CRDHigh;
534 font-weight:400;
535 color:#5d5d5d;
536 padding:4px 4px 4px 4px;
537 border-bottom-style:solid;
538 border-bottom-width:1px;
539 border-bottom-color:#898989;
540 }
541
542 aside > div.toc > div.buttons > .disabled {
543 color:#959595;
544 }
545
546 aside > div.toc > div.buttons > * {
547 background-color:#d4d4d8; /* fallback */
548 background-color:rgba(242,242,248,0.45);
549 -webkit-transition: background-color 0.5s; /* Safari */
550 -moz-transition: background-color 0.5s;
551 -ms-transition: background-color 0.5s;
552 -o-transition: background-color 0.5s;
553 transition: background-color 0.5s linear;
554 }
555
556 aside > div.toc > div.buttons > *:first-child {
557 text-align:left;
558
559 border-left-style:solid;
560 border-left-width:1px;
561 border-left-color:#898989;
562
563 -webkit-border-bottom-left-radius: 11px;
564 -moz-border-radius-bottomleft: 11px;
565 border-bottom-left-radius: 11px;
566 }
567
568 aside > div.toc > div.buttons > *:last-child {
569 text-align:right;
570
571 border-left-style:solid;
572 border-left-width:1px;
573 border-left-color:#898989;
574
575 /* FIXME: would create an undesired 1px gap on the right */
576 /*border-right-style:solid;
577 border-right-width:1px;
578 border-right-color:#898989;*/
579
580 -webkit-border-bottom-right-radius: 11px;
581 -moz-border-radius-bottomright: 11px;
582 border-bottom-right-radius: 11px;
583 }
584
585 .no-touch aside > div.toc > div.buttons > *:not(.disabled):hover,
586 .touch aside > div.toc > div.buttons > *:not(.disabled):focus,
587 .touch aside > div.toc > div.buttons > *:not(.disabled):active
588 {
589 background-color:rgba(255,0,0,0.21);
590 -webkit-transition: background-color 0.25s; /* Safari */
591 -moz-transition: background-color 0.25s;
592 -ms-transition: background-color 0.25s;
593 -o-transition: background-color 0.25s;
594 transition: background-color 0.25s linear;
595 }
596
597 aside > div.toc > div.buttons .arrow {
598 vertical-align:top;
599 font-size:15px;
600 }
601
602 .iOS
603 aside > div.toc > div.buttons .arrow {
604 font-family:"Hiragino Mincho ProN";
605 }
606
607
608
609 /* Article */
610
611 article {
612 display:block;
613 width: -webkit-calc(100% - 181);
614 width: -moz-calc(100% - 181);
615 width: -o-calc(100% - 181);
616 width: calc(100% - 181);
617 background-color:white;
618 margin-top: 67px;
619 padding: 16px 70px 95px 70px;
620 margin-left:181px;
621 font-size:18px;
622 font-weight:200;
623 border-left-style:solid;
624 border-left-width:1px;
625 border-left-color:#898989;
626
627 -webkit-transition: -webkit-transform 0.16s ease, margin-left 0.2s ease;
628 -o-transition: -o-transform 0.16s ease, margin-left 0.2s ease;
629 -ms-transition: -ms-transform 0.16s ease, margin-left 0.2s ease;
630 -moz-transition: -moz-transform 0.16s ease, margin-left 0.2s ease;
631 transition: transform 0.16s ease, margin-left 0.2s ease;
632 }
633
634 .no-effect article {
635 -webkit-transition: none !important;
636 -moz-transition: none !important;
637 -ms-transition: none !important;
638 -o-transition: none !important;
639 transition: none !important;
640 }
641
642 .no-toc article {
643 margin-left:0px;
644
645 -webkit-transition: -webkit-transform 0.16s ease, margin-left 0.2s ease;
646 -o-transition: -o-transform 0.16s ease, margin-left 0.2s ease;
647 -ms-transition: -ms-transform 0.16s ease, margin-left 0.2s ease;
648 -moz-transition: -moz-transform 0.16s ease, margin-left 0.2s ease;
649 transition: transform 0.16s ease, margin-left 0.2s ease;
650 }
651
652 .no-effect
653 .no-toc article {
654 -webkit-transition: none !important;
655 -moz-transition: none !important;
656 -ms-transition: none !important;
657 -o-transition: none !important;
658 transition: none !important;
659 }
660
661 article h1 {
662 clear:both;
663 border-bottom-style:solid;
664 border-bottom-width:1px;
665 border-bottom-color:#898989;
666 text-align:center;
667 font-family:CRDHigh;
668 font-size:32px;
669 font-weight:700;
670 color:#a19f9f;
671 padding-top:45px;
672 padding-bottom:28px;
673 margin-top:0;
674 margin-bottom:40px;
675 }
676
677 article h2 {
678 clear:both;
679 border-bottom-style:solid;
680 border-bottom-width:1px;
681 border-bottom-color:#898989;
682 font-family:CRDHigh;
683 font-size:26px;
684 font-weight:400;
685 padding-top:35px;
686 padding-bottom:16px;
687 margin-top:0;
688 margin-bottom:28px;
689 }
690
691 article h3 {
692 clear:both;
693 padding-top:20px;
694 padding-bottom:0px;
695 margin-top:0;
696 margin-bottom:0;
697 font-family:CRDHigh;
698 color:#9a6938;
699 font-size:24px;
700 font-weight:300;
701 }
702
703 article p {
704 clear:both;
705 }
706
707 /* automatically center the 1st paragraph (block) directly after a h1 type header (since that header type is centered as well) */
708 article h1 + p {
709 display:table; /*HACK: "block" would stretch the entire page width */
710 margin-left:auto;
711 margin-right:auto;
712 }
713
714 article a {
715 font-weight:400;
716 color:#1ba1dd;
717 text-decoration:none;
718 outline:none;
719 border:none;
720 }
721
722 article a img {
723 border:none;
724 text-decoration:none;
725 }
726
727 article li img {
728 float:left;
729 }
730
731 .no-touch article a:hover,
732 .touch article a:focus,
733 .touch article a:active
734 {
735 text-decoration:underline;
736 }
737
738 article ul {
739 font-weight:inherit;
740 padding:0 0 0 60px;
741 margin:0 0 21px 0;
742 }
743
744 article ul li {
745 list-style-type:disc;
746 padding:4px 0 0 14px;
747 margin:12px 0 0 0;
748 }
749
750
751 article ol {
752 counter-reset:oli;
753 font-weight:inherit;
754 padding:0 0 0 29px;
755 margin:0 0 21px 0;
756 }
757
758 article ol li:before {
759 content:counters(oli,".") ".";
760 counter-increment:oli;
761 font-weight:600;
762 margin:0 20px 0 0;
763 }
764
765 article ol li {
766 list-style-type:none;
767 padding:4px 0 0 14px;
768 margin:12px 0 0 0;
769 }
770
771
772
773 article code, article .code {
774 font-family:CRDCour;
775 color:#404040;
776 white-space:pre;
777 }
778
779 article code {
780 display:inline-block;
781 font-size:15px;
782 margin:0 3px 0px 3px;
783 padding:2px 6px 0px 6px;
784 background-color:#fcf9f9;
785 }
786
787 article > code {
788 display:block;
789 font-size:15px;
790 margin:0 37px 0 37px;
791 padding:2px 6px 0px 6px;
792 background-color:#fcf9f9;
793 }
794
795 article ul.code {
796 list-style:outside none none;
797 counter-reset:codeline;
798 font-size:14px;
799 font-weight:normal;
800 line-height:1.1;
801 margin:0 0 0 0;
802 padding:8px 0px 8px 0px;
803 }
804
805 article .code li {
806 display:block;
807 list-style-type:none;
808 white-space:pre-wrap;
809 border-left:32px solid #f9f3f3;
810 text-indent:-30px;
811 background-color:#fcf9f9;
812 margin:0 0 0 0;
813 padding:0 0 0 0;
814 }
815
816 article .code li:first-child {
817 padding-top:6px;
818 }
819
820 article .code li:last-child {
821 padding-bottom:3px;
822 }
823
824 article .code li:before {
825 display:inline-block;
826 white-space:pre;
827 content:counter(codeline,decimal) ". ";
828 counter-increment:codeline;
829 min-width:38px;
830 text-align:right;
831 color:#c9c9c9;
832 }
833
834 article .code .k, article code .k { /*keyword*/
835 font-weight:bold;
836 color:black;
837 }
838
839 article .code .n, article code .n { /*number*/
840 color:#c4950c;
841 }
842
843 article .code .i, article code .i { /*identifier (function name)*/
844 /*color:#0c4fc4;*/
845 color:#1ba1dd;
846 }
847
848 article .code .a, article code .a { /*array variable*/
849 color:#790cc4;
850 /*color:black;*/
851 }
852
853 article .code .c, article code .c { /*characters*/
854 color:#c40c0c;
855 }
856
857 article .code .s, article code .s { /*string variable*/
858 /*color:#9a693c;*/
859 /*color:black;*/
860 color:#790cc4;
861 }
862
863 article .code .v, article code .v { /*integer variable*/
864 /*color:black;*/
865 color:#790cc4;
866 }
867
868 article .code .h, article code .h { /*event handler*/
869 font-weight:bold;
870 color:#07c0cf;
871 }
872
873 article .code .q, article code .q { /*comment*/
874 color:#9c9c9c;
875 font-style:italic;
876 }
877
878 article .code .p, article code .p { /*preprocessor statements*/
879 /*color:#87b1a8;*/
880 color:#2f8a33;
881 /*font-style:italic;*/
882 font-weight:normal;
883 }
884
885 article .code .m, article code .m { /* metaphor (natural language text used as pseudo code) */
886 background-color:#ddf4fd;
887 font-size:14px;
888 color:black;
889 font-weight:normal;
890 border:solid 1px #73a3ab;
891 -webkit-border-radius: 10px;
892 -moz-border-radius: 10px;
893 border-radius: 10px;
894 margin:0 0 0 0;
895 padding:2px 4px 0px 4px;
896 }
897
898 article table {
899 margin:20px 37px 20px 37px;
900 padding:0 0 0 0;
901 /*background-color:red;*/
902 border:none;
903 border-collapse:collapse;
904 }
905
906 article tr {
907 padding:0 0 0 0;
908 margin:0 0 0 0;
909 }
910
911 article th {
912 background-color:#e0e0ff;
913 padding:0px 8px 0px 8px;
914 margin:0 0 0 0;
915 border:3px solid white;
916 font-size:16px;
917 font-weight:600;
918 }
919
920 article td {
921 background-color:#f9f7f7;
922 padding:4px 8px 4px 8px;
923 margin:0 0 0 0;
924 border:3px solid white;
925 font-size:16px;
926 font-weight:300;
927 line-height:1.2;
928 }
929
930 article table a {
931 font-weight:400;
932 }
933
934 article note:before {
935 white-space:pre-wrap;
936 content:'NOTE: ';
937 font-weight:500;
938 }
939
940 article note.important:before {
941 white-space:pre-wrap;
942 content:'IMPORTANT: ';
943 font-weight:500;
944 }
945
946 article note {
947 display:table; /*HACK: "block" would stretch the entire page width */
948 background-color:#ede8e8;
949 border-top:none;
950 border-right:none;
951 border-bottom:none;
952 border-left:solid 10px #898989;
953 margin: 24px auto 27px 43px;
954 padding: 15px 18px 15px 18px;
955 max-width: -webkit-calc(100% - 145px);
956 max-width: -moz-calc(100% - 145px);
957 max-width: -o-calc(100% - 145px);
958 max-width: calc(100% - 145px);
959 }
960
961 article td > note {
962 display:block; /*HACK: override "table" default value assigned above in the context of a table cell, otherwise padding will be ignored */
963 }
964
965 article note.important {
966 border-left:solid 10px #ff4141;
967 }
968
969 article > img, example > img {
970 display:block;
971 clear:both;
972 max-width:100%;
973 margin-left:auto;
974 margin-right:auto;
975 /*border:solid 1px #8e8e8e;*/
976 padding-top:25px;
977 border:none;
978 }
979
980 article p img {
981 display:inline-block;
982 float:left;
983 margin:4px 20px 19px 0px;
984 padding:0 0 0 0;
985 /*border:solid 1px #8e8e8e;*/
986 border:none;
987 max-width:99%;
988 }
989
990 article div.imgcptn {
991 display:block;
992 width:100%;
993 text-align:center;
994 font-weight:200;
995 color:#999999;
996 font-size:16px;
997 font-style:italic;
998 margin: 8px 0 16px 0;
999 }
1000
1001 article example:before {
1002 display:block;
1003 position:relative; top:-5px; left:-32px;
1004 content:'Example';
1005 font-weight:500;
1006 color:white;
1007 border:none;
1008 margin:0;
1009 padding:0;
1010 width:100px;
1011 background-color:#dedede;
1012 /* -moz-transform: rotate(30deg);
1013 -ms-transform: rotate(30deg);
1014 -o-transform: rotate(30deg);
1015 -webkit-transform: rotate(30deg);
1016 transform: rotate(90deg);
1017 transform-origin: 0% 50%;*/
1018 text-align:center;
1019 }
1020
1021 article example {
1022 display:inline-block;
1023
1024 width: -webkit-calc(100% - 80px);
1025 width: -moz-calc(100% - 80px);
1026 width: -o-calc(100% - 80px);
1027 width: calc(100% - 80px);
1028
1029 border-top:solid 1px #e5e5e5;
1030 border-right:solid 18px #dedede;
1031 border-bottom:solid 1px #e5e5e5;
1032 border-left:solid 18px #dedede;
1033 margin:0px, 20px, 0px, 20px;
1034 padding:5px 15px 8px 24px;
1035 }
1036
1037 article dir {
1038 display:block;
1039 list-style-type:none;
1040 background-image:url('../pix/folder.png');
1041 background-repeat:no-repeat;
1042 background-position:2px top;
1043 padding:0px;
1044 margin:0px;
1045 font-family:CRDCour;
1046 font-size:15px;
1047 color:#000000;
1048 }
1049
1050 article > dir, example > dir {
1051 padding-left:66px;
1052 background-position:36px top;
1053 }
1054
1055 article dir > * {
1056 padding-top:2px;
1057 padding-bottom:2px;
1058 padding-left:31px;
1059 }
1060
1061 article dir file {
1062 display:block;
1063 list-style-type:none;
1064 background-image:url('../pix/file.png');
1065 background-repeat:no-repeat;
1066 background-position:2px top;
1067 font-family:CRDCour;
1068 font-size:15px;
1069 color:#6f6f6f;
1070 }
1071
1072
1073
1074 /* article footer */
1075
1076 article > ul.docpager {
1077 display:table;
1078 margin:0 0 0 0;
1079 padding:50px 0 0 0;
1080 width:100%;
1081 }
1082
1083 article > ul.docpager > li {
1084 display:table-cell;
1085 width:33%;
1086 margin:0 0 0 0;
1087 padding:0 0 0 0;
1088 }
1089
1090 article > ul.docpager > li:nth-child(1) {
1091 text-align:left;
1092 padding-right:10px;
1093 }
1094
1095 article > ul.docpager > li:nth-child(1) > a:before {
1096 content: "��� ";
1097 }
1098
1099 .iOS
1100 article > ul.docpager > li:nth-child(1) > a:before {
1101 font-family:"Hiragino Mincho ProN";
1102 }
1103
1104 article > ul.docpager > li:nth-child(2) {
1105 text-align:center;
1106 padding-left:10px;
1107 padding-right:10px;
1108 }
1109
1110 article > ul.docpager > li:nth-child(2) > a:before {
1111 content: "��� ";
1112 }
1113
1114 .iOS
1115 article > ul.docpager > li:nth-child(2) > a:before {
1116 font-family:"Hiragino Mincho ProN";
1117 }
1118
1119 article > ul.docpager > li:nth-child(3) {
1120 text-align:right;
1121 padding-left:10px;
1122 }
1123
1124 article > ul.docpager > li:nth-child(3) > a:after {
1125 content: " ���";
1126 }
1127
1128 .iOS
1129 article > ul.docpager > li:nth-child(3) > a:after {
1130 font-family:"Hiragino Mincho ProN";
1131 }
1132
1133 article > .endline {
1134 font-family:CRDSans;
1135 font-size:16px;
1136 font-weight:300;
1137 color:#9d9d9d;
1138 border-top:solid 1px #dedede;
1139 border-left:none;
1140 border-right:none;
1141 border-bottom:none;
1142 margin:30px 0 0 0;
1143 padding:10px 0 0 0;
1144 }
1145
1146
1147
1148 /* very bottom footer */
1149
1150 footer {
1151 position:relative;
1152 z-index:1;
1153 display:block;
1154 width:100%;
1155 background-color:#aaaaaa; /* fallback */
1156 background: -webkit-linear-gradient(left, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Safari 5.1 to 6.0 */
1157 background: -o-linear-gradient(right, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Opera 11.1 to 12.0 */
1158 background: -moz-linear-gradient(right, rgba(203,195,194,1.0), rgba(171,154,151,1.0)); /* For Firefox 3.6 to 15 */
1159 background: linear-gradient(to left, #cbc3c2, #bfb2b0); /* Standard syntax */
1160 margin:0px 0px 0px 0px;
1161 padding: 24px 0px 28px 0px;
1162 font-family: CRDHigh;
1163 font-size:15px;
1164 font-weight:200;
1165 color:white;
1166 text-align:center;
1167 border-top-style:solid;
1168 border-top-width:1px;
1169 border-top-color:#898989;
1170 }
1171
1172 footer a {
1173 color:inherit;
1174 text-decoration:none;
1175 outline:none;
1176 border:0;
1177 }
1178
1179 .no-touch footer a:hover,
1180 .touch footer a:focus,
1181 .touch footer a:active
1182 {
1183 text-decoration:underline;
1184 }

  ViewVC Help
Powered by ViewVC