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

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

Parent Directory Parent Directory | Revision Log Revision Log


Revision 2738 - (show annotations) (download) (as text)
Tue Apr 28 17:24:16 2015 UTC (8 years, 11 months ago) by schoenebeck
File MIME type: text/css
File size: 7834 byte(s)
- Site's CSS style: Added support for "dir" and "file" HTML tags.

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 a {
74 font-weight:400;
75 color:#1ba1dd;
76 text-decoration:none;
77 outline:none;
78 border:none;
79 }
80
81 body a img {
82 border:none;
83 text-decoration:none;
84 }
85
86 body a:hover {
87 text-decoration:underline;
88 }
89
90 body ul {
91 font-weight:inherit;
92 padding:0 0 0 60px;
93 margin:0 0 21px 0;
94 }
95
96 body ul li {
97 list-style-type:disc;
98 padding:4px 0 0 14px;
99 margin:12px 0 0 0;
100 }
101
102
103 body ol {
104 counter-reset:oli;
105 font-weight:inherit;
106 padding:0 0 0 29px;
107 margin:0 0 21px 0;
108 }
109
110 body ol li:before {
111 content:counters(oli,".") ".";
112 counter-increment:oli;
113 font-weight:600;
114 margin:0 20px 0 0;
115 }
116
117 body ol li {
118 list-style-type:none;
119 padding:4px 0 0 14px;
120 margin:12px 0 0 0;
121 }
122
123
124
125 body code, body .code {
126 font-family:CRDCour;
127 color:#404040;
128 white-space:pre;
129 }
130
131 body code {
132 display:inline-block;
133 font-size:15px;
134 margin:0 3px 0px 3px;
135 padding:2px 6px 0px 6px;
136 background-color:#fcf9f9;
137 }
138
139 body > code {
140 display:block;
141 font-size:15px;
142 margin:0 37px 0 37px;
143 padding:2px 6px 0px 6px;
144 background-color:#fcf9f9;
145 }
146
147 body ul.code {
148 list-style:outside none none;
149 counter-reset:codeline;
150 font-size:14px;
151 font-weight:normal;
152 line-height:1.1;
153 margin:0 0 0 0;
154 padding:8px 0px 8px 0px;
155 }
156
157 body .code li {
158 display:block;
159 list-style-type:none;
160 white-space:pre-wrap;
161 border-left:32px solid #f9f3f3;
162 text-indent:-30px;
163 background-color:#fcf9f9;
164 margin:0 0 0 0;
165 padding:0 0 0 0;
166 }
167
168 body .code li:first-child {
169 padding-top:6px;
170 }
171
172 body .code li:last-child {
173 padding-bottom:3px;
174 }
175
176 body .code li:before {
177 display:inline-block;
178 white-space:pre;
179 content:counter(codeline,decimal) ". ";
180 counter-increment:codeline;
181 min-width:38px;
182 text-align:right;
183 color:#c9c9c9;
184 }
185
186 body .code .k, body code .k { /*keyword*/
187 font-weight:bold;
188 color:black;
189 }
190
191 body .code .n, body code .n { /*number*/
192 color:#c4950c;
193 }
194
195 body .code .i, body code .i { /*identifier (function name)*/
196 /*color:#0c4fc4;*/
197 color:#1ba1dd;
198 }
199
200 body .code .a, body code .a { /*array variable*/
201 color:#790cc4;
202 /*color:black;*/
203 }
204
205 body .code .c, body code .c { /*characters*/
206 color:#c40c0c;
207 }
208
209 body .code .s, body code .s { /*string variable*/
210 /*color:#9a693c;*/
211 /*color:black;*/
212 color:#790cc4;
213 }
214
215 body .code .v, body code .v { /*integer variable*/
216 /*color:black;*/
217 color:#790cc4;
218 }
219
220 body .code .h, body code .h { /*event handler*/
221 font-weight:bold;
222 color:#07c0cf;
223 }
224
225 body .code .q, body code .q { /*comment*/
226 color:#9c9c9c;
227 font-style:italic;
228 }
229
230 body .code .p, body code .p { /*preprocessor statements*/
231 /*color:#87b1a8;*/
232 color:#2f8a33;
233 /*font-style:italic;*/
234 font-weight:normal;
235 }
236
237 body .code .m, body code .m { /* metaphor (natural language text used as pseudo code) */
238 background-color:#ddf4fd;
239 font-size:14px;
240 color:black;
241 font-weight:normal;
242 border:solid 1px #73a3ab;
243 -webkit-border-radius: 10px;
244 -moz-border-radius: 10px;
245 border-radius: 10px;
246 margin:0 0 0 0;
247 padding:2px 4px 0px 4px;
248 }
249
250 body table {
251 margin:20px 37px 20px 37px;
252 padding:0 0 0 0;
253 /*background-color:red;*/
254 border:none;
255 border-collapse:collapse;
256 }
257
258 body tr {
259 padding:0 0 0 0;
260 margin:0 0 0 0;
261 }
262
263 body th {
264 background-color:#e8e2e2;
265 padding:0px 8px 0px 8px;
266 margin:0 0 0 0;
267 border:3px solid white;
268 font-size:16px;
269 font-weight:600;
270 }
271
272 body td {
273 background-color:#f9f7f7;
274 padding:4px 8px 4px 8px;
275 margin:0 0 0 0;
276 border:3px solid white;
277 font-size:16px;
278 font-weight:300;
279 line-height:1.2;
280 }
281
282 body table a {
283 font-weight:400;
284 }
285
286 body note:before {
287 white-space:pre-wrap;
288 content:'NOTE: ';
289 font-weight:500;
290 }
291
292 body note.important:before {
293 white-space:pre-wrap;
294 content:'IMPORTANT: ';
295 font-weight:500;
296 }
297
298 body note {
299 display:table; /*HACK: "block" would stretch the entire page width */
300 background-color:#ede8e8;
301 border-top:none;
302 border-right:none;
303 border-bottom:none;
304 border-left:solid 10px #898989;
305 margin: 24px auto 27px 43px;
306 padding: 15px 18px 15px 18px;
307 max-width: -webkit-calc(100% - 145px);
308 max-width: -moz-calc(100% - 145px);
309 max-width: -o-calc(100% - 145px);
310 max-width: calc(100% - 145px);
311 }
312
313 body note.important {
314 border-left:solid 10px #ff4141;
315 }
316
317 body > img, example > img {
318 display:block;
319 clear:both;
320 max-width:100%;
321 margin-left:auto;
322 margin-right:auto;
323 /*border:solid 1px #8e8e8e;*/
324 padding-top:25px;
325 border:none;
326 }
327
328 body p img {
329 display:inline-block;
330 float:left;
331 margin:4px 20px 0px 0px;
332 padding:0 0 0 0;
333 /*border:solid 1px #8e8e8e;*/
334 border:none;
335 max-width:99%;
336 }
337
338 body div.imgcptn {
339 display:block;
340 width:100%;
341 text-align:center;
342 font-weight:200;
343 color:#999999;
344 font-size:16px;
345 font-style:italic;
346 margin: 8px 0 16px 0;
347 }
348
349 body example:before {
350 display:block;
351 position:relative; top:-5px; left:-32px;
352 content:'Example';
353 font-weight:500;
354 color:white;
355 border:none;
356 margin:0;
357 padding:0;
358 width:100px;
359 background-color:#dedede;
360 /* -moz-transform: rotate(30deg);
361 -ms-transform: rotate(30deg);
362 -o-transform: rotate(30deg);
363 -webkit-transform: rotate(30deg);
364 transform: rotate(90deg);
365 transform-origin: 0% 50%;*/
366 text-align:center;
367 }
368
369 body example {
370 display:inline-block;
371
372 width: -webkit-calc(100% - 80px);
373 width: -moz-calc(100% - 80px);
374 width: -o-calc(100% - 80px);
375 width: calc(100% - 80px);
376
377 border-top:solid 1px #e5e5e5;
378 border-right:solid 18px #dedede;
379 border-bottom:solid 1px #e5e5e5;
380 border-left:solid 18px #dedede;
381 margin:0px, 20px, 0px, 20px;
382 padding:5px 15px 8px 24px;
383 }
384
385 body dir {
386 display:block;
387 list-style-type:none;
388 background-image:url('../pix/folder.png');
389 background-repeat:no-repeat;
390 background-position:2px top;
391 padding:0px;
392 margin:0px;
393 font-family:CRDCour;
394 color:#000000;
395 }
396
397 body > dir {
398 padding-left:66px;
399 background-position:36px top;
400 }
401
402 body dir > * {
403 padding-top:2px;
404 padding-bottom:2px;
405 padding-left:31px;
406 }
407
408 body dir file {
409 display:block;
410 list-style-type:none;
411 background-image:url('../pix/file.png');
412 background-repeat:no-repeat;
413 background-position:2px top;
414 font-family:CRDCour;
415 color:#6f6f6f;
416 }

  ViewVC Help
Powered by ViewVC