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

Contents of /doc/tmpl/css/preview.css

Parent Directory Parent Directory | Revision Log Revision Log


Revision 3599 - (show annotations) (download) (as text)
Sun Sep 15 20:39:58 2019 UTC (4 years, 6 months ago) by schoenebeck
File MIME type: text/css
File size: 8643 byte(s)
* Draft: NKSP Real Numbers, Units and Finalness.

1 /*
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 body p {
74 clear:both;
75 }
76
77 /* 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 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 body li img {
98 float:left;
99 }
100
101 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 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 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 background-color:#e0e0ff;
288 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 body note.remark:before {
322 white-space:pre-wrap;
323 content:'Remark: ';
324 font-weight:500;
325 }
326
327 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 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 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 margin:4px 20px 19px 0px;
365 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
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 font-size:15px;
428 color:#000000;
429 }
430
431 body > dir, example > dir {
432 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 font-size:15px;
450 color:#6f6f6f;
451 }

  ViewVC Help
Powered by ViewVC