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

Annotation of /doc/tmpl/css/preview.css

Parent Directory Parent Directory | Revision Log Revision Log

Revision 3599 - (hide annotations) (download) (as text)
Sun Sep 15 20:39:58 2019 UTC (4 years, 7 months ago) by schoenebeck
File MIME type: text/css
File size: 8643 byte(s) 
* Draft: NKSP Real Numbers, Units and Finalness.
1 schoenebeck 2737 /*
2     CrudeDoc CSS Style (for previewing an article on a local machine)
3     Copyright (c) 2015 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     }
16    
17    
18     /* Article */
19    
20     body {
21     padding: 16px 70px 95px 70px;
22     font-size:18px;
23     font-weight:200;
24     counter-reset:oli;
25     counter-reset:codeline;
26     background-color:white;
27     border:none;
28     }
29    
30    
31     body h1 {
32     clear:both;
33     border-bottom-style:solid;
34     border-bottom-width:1px;
35     border-bottom-color:#898989;
36     text-align:center;
37     font-family:CRDHigh;
38     font-size:32px;
39     font-weight:700;
40     color:#a19f9f;
41     padding-top:45px;
42     padding-bottom:28px;
43     margin-top:0;
44     margin-bottom:40px;
45     }
46    
47     body h2 {
48     clear:both;
49     border-bottom-style:solid;
50     border-bottom-width:1px;
51     border-bottom-color:#898989;
52     font-family:CRDHigh;
53     font-size:26px;
54     font-weight:400;
55     padding-top:35px;
56     padding-bottom:16px;
57     margin-top:0;
58     margin-bottom:28px;
59     }
60    
61     body h3 {
62     clear:both;
63     padding-top:20px;
64     padding-bottom:0px;
65     margin-top:0;
66     margin-bottom:0;
67     font-family:CRDHigh;
68     color:#9a6938;
69     font-size:24px;
70     font-weight:300;
71     }
72    
73 schoenebeck 2784 body p {
74     clear:both;
75     }
76    
77 schoenebeck 2961 /* automatically center the 1st paragraph (block) directly after a h1 type header (since that header type is centered as well) */
78     body h1 + p {
79     display:table; /*HACK: "block" would stretch the entire page width */
80     margin-left:auto;
81     margin-right:auto;
82     }
83    
84 schoenebeck 2737 body a {
85     font-weight:400;
86     color:#1ba1dd;
87     text-decoration:none;
88     outline:none;
89     border:none;
90     }
91    
92     body a img {
93     border:none;
94     text-decoration:none;
95     }
96    
97 schoenebeck 2831 body li img {
98     float:left;
99     }
100    
101 schoenebeck 2737 body a:hover {
102     text-decoration:underline;
103     }
104    
105     body ul {
106     font-weight:inherit;
107     padding:0 0 0 60px;
108     margin:0 0 21px 0;
109     }
110    
111     body ul li {
112     list-style-type:disc;
113     padding:4px 0 0 14px;
114     margin:12px 0 0 0;
115     }
116    
117    
118     body ol {
119     counter-reset:oli;
120     font-weight:inherit;
121     padding:0 0 0 29px;
122     margin:0 0 21px 0;
123     }
124    
125     body ol li:before {
126     content:counters(oli,".") ".";
127     counter-increment:oli;
128     font-weight:600;
129     margin:0 20px 0 0;
130     }
131    
132     body ol li {
133     list-style-type:none;
134     padding:4px 0 0 14px;
135     margin:12px 0 0 0;
136     }
137    
138    
139    
140     body code, body .code {
141     font-family:CRDCour;
142     color:#404040;
143     white-space:pre;
144     }
145    
146     body code {
147     display:inline-block;
148     font-size:15px;
149     margin:0 3px 0px 3px;
150     padding:2px 6px 0px 6px;
151     background-color:#fcf9f9;
152     }
153    
154     body > code {
155     display:block;
156     font-size:15px;
157     margin:0 37px 0 37px;
158     padding:2px 6px 0px 6px;
159     background-color:#fcf9f9;
160     }
161    
162     body ul.code {
163     list-style:outside none none;
164     counter-reset:codeline;
165     font-size:14px;
166     font-weight:normal;
167     line-height:1.1;
168     margin:0 0 0 0;
169     padding:8px 0px 8px 0px;
170     }
171    
172     body .code li {
173     display:block;
174     list-style-type:none;
175     white-space:pre-wrap;
176     border-left:32px solid #f9f3f3;
177     text-indent:-30px;
178     background-color:#fcf9f9;
179     margin:0 0 0 0;
180     padding:0 0 0 0;
181     }
182    
183     body .code li:first-child {
184     padding-top:6px;
185     }
186    
187     body .code li:last-child {
188     padding-bottom:3px;
189     }
190    
191     body .code li:before {
192     display:inline-block;
193     white-space:pre;
194     content:counter(codeline,decimal) ". ";
195     counter-increment:codeline;
196     min-width:38px;
197     text-align:right;
198     color:#c9c9c9;
199     }
200    
201     body .code .k, body code .k { /*keyword*/
202     font-weight:bold;
203     color:black;
204     }
205    
206     body .code .n, body code .n { /*number*/
207     color:#c4950c;
208     }
209    
210 schoenebeck 3599 body .code .ut, body code .ut { /*std measuring unit type*/
211     color:#50bc00;
212     }
213    
214     body .code .up, body code .up { /*metric prefix of unit*/
215     color:#000000;
216     }
217    
218 schoenebeck 2737 body .code .i, body code .i { /*identifier (function name)*/
219     /*color:#0c4fc4;*/
220     color:#1ba1dd;
221     }
222    
223     body .code .a, body code .a { /*array variable*/
224     color:#790cc4;
225     /*color:black;*/
226     }
227    
228     body .code .c, body code .c { /*characters*/
229     color:#c40c0c;
230     }
231    
232     body .code .s, body code .s { /*string variable*/
233     /*color:#9a693c;*/
234     /*color:black;*/
235     color:#790cc4;
236     }
237    
238     body .code .v, body code .v { /*integer variable*/
239     /*color:black;*/
240     color:#790cc4;
241     }
242    
243     body .code .h, body code .h { /*event handler*/
244     font-weight:bold;
245     color:#07c0cf;
246     }
247    
248     body .code .q, body code .q { /*comment*/
249     color:#9c9c9c;
250     font-style:italic;
251     }
252    
253     body .code .p, body code .p { /*preprocessor statements*/
254     /*color:#87b1a8;*/
255     color:#2f8a33;
256     /*font-style:italic;*/
257     font-weight:normal;
258     }
259    
260     body .code .m, body code .m { /* metaphor (natural language text used as pseudo code) */
261     background-color:#ddf4fd;
262     font-size:14px;
263     color:black;
264     font-weight:normal;
265     border:solid 1px #73a3ab;
266     -webkit-border-radius: 10px;
267     -moz-border-radius: 10px;
268     border-radius: 10px;
269     margin:0 0 0 0;
270     padding:2px 4px 0px 4px;
271     }
272    
273     body table {
274     margin:20px 37px 20px 37px;
275     padding:0 0 0 0;
276     /*background-color:red;*/
277     border:none;
278     border-collapse:collapse;
279     }
280    
281     body tr {
282     padding:0 0 0 0;
283     margin:0 0 0 0;
284     }
285    
286     body th {
287 schoenebeck 3090 background-color:#e0e0ff;
288 schoenebeck 2737 padding:0px 8px 0px 8px;
289     margin:0 0 0 0;
290     border:3px solid white;
291     font-size:16px;
292     font-weight:600;
293     }
294    
295     body td {
296     background-color:#f9f7f7;
297     padding:4px 8px 4px 8px;
298     margin:0 0 0 0;
299     border:3px solid white;
300     font-size:16px;
301     font-weight:300;
302     line-height:1.2;
303     }
304    
305     body table a {
306     font-weight:400;
307     }
308    
309     body note:before {
310     white-space:pre-wrap;
311     content:'NOTE: ';
312     font-weight:500;
313     }
314    
315     body note.important:before {
316     white-space:pre-wrap;
317     content:'IMPORTANT: ';
318     font-weight:500;
319     }
320    
321 schoenebeck 3599 body note.remark:before {
322     white-space:pre-wrap;
323     content:'Remark: ';
324     font-weight:500;
325     }
326    
327 schoenebeck 2737 body note {
328     display:table; /*HACK: "block" would stretch the entire page width */
329     background-color:#ede8e8;
330     border-top:none;
331     border-right:none;
332     border-bottom:none;
333     border-left:solid 10px #898989;
334     margin: 24px auto 27px 43px;
335     padding: 15px 18px 15px 18px;
336     max-width: -webkit-calc(100% - 145px);
337     max-width: -moz-calc(100% - 145px);
338     max-width: -o-calc(100% - 145px);
339     max-width: calc(100% - 145px);
340     }
341    
342 schoenebeck 2959 body td > note {
343     display:block; /*HACK: override "table" default value assigned above in the context of a table cell, otherwise padding will be ignored */
344     }
345    
346 schoenebeck 2737 body note.important {
347     border-left:solid 10px #ff4141;
348     }
349    
350     body > img, example > img {
351     display:block;
352     clear:both;
353     max-width:100%;
354     margin-left:auto;
355     margin-right:auto;
356     /*border:solid 1px #8e8e8e;*/
357     padding-top:25px;
358     border:none;
359     }
360    
361     body p img {
362     display:inline-block;
363     float:left;
364 schoenebeck 2821 margin:4px 20px 19px 0px;
365 schoenebeck 2737 padding:0 0 0 0;
366     /*border:solid 1px #8e8e8e;*/
367     border:none;
368     max-width:99%;
369     }
370    
371     body div.imgcptn {
372     display:block;
373     width:100%;
374     text-align:center;
375     font-weight:200;
376     color:#999999;
377     font-size:16px;
378     font-style:italic;
379     margin: 8px 0 16px 0;
380     }
381    
382     body example:before {
383     display:block;
384     position:relative; top:-5px; left:-32px;
385     content:'Example';
386     font-weight:500;
387     color:white;
388     border:none;
389     margin:0;
390     padding:0;
391     width:100px;
392     background-color:#dedede;
393     /* -moz-transform: rotate(30deg);
394     -ms-transform: rotate(30deg);
395     -o-transform: rotate(30deg);
396     -webkit-transform: rotate(30deg);
397     transform: rotate(90deg);
398     transform-origin: 0% 50%;*/
399     text-align:center;
400     }
401    
402     body example {
403     display:inline-block;
404    
405     width: -webkit-calc(100% - 80px);
406     width: -moz-calc(100% - 80px);
407     width: -o-calc(100% - 80px);
408     width: calc(100% - 80px);
409    
410     border-top:solid 1px #e5e5e5;
411     border-right:solid 18px #dedede;
412     border-bottom:solid 1px #e5e5e5;
413     border-left:solid 18px #dedede;
414     margin:0px, 20px, 0px, 20px;
415     padding:5px 15px 8px 24px;
416     }
417 schoenebeck 2738
418     body dir {
419     display:block;
420     list-style-type:none;
421     background-image:url('../pix/folder.png');
422     background-repeat:no-repeat;
423     background-position:2px top;
424     padding:0px;
425     margin:0px;
426     font-family:CRDCour;
427 schoenebeck 2740 font-size:15px;
428 schoenebeck 2738 color:#000000;
429     }
430    
431 schoenebeck 2749 body > dir, example > dir {
432 schoenebeck 2738 padding-left:66px;
433     background-position:36px top;
434     }
435    
436     body dir > * {
437     padding-top:2px;
438     padding-bottom:2px;
439     padding-left:31px;
440     }
441    
442     body dir file {
443     display:block;
444     list-style-type:none;
445     background-image:url('../pix/file.png');
446     background-repeat:no-repeat;
447     background-position:2px top;
448     font-family:CRDCour;
449 schoenebeck 2740 font-size:15px;
450 schoenebeck 2738 color:#6f6f6f;
451     }
  ViewVC Help
Powered by ViewVC