]> Shamusworld >> Repos - ardour-manual-diverged/blob - source/css/app.css
copy-edit section 3. more additions to the style guide, rework style syllabus.
[ardour-manual-diverged] / source / css / app.css
1 #tree {
2   background-color: #eee;
3   height: 100%;
4   overflow: scroll;
5   position: fixed;
6   top: 0;
7   bottom: 0;
8   left: 0;
9   width: 300px;
10 }
11
12 #tree-inner {
13   padding: 15px 20px 30px 30px;  
14 }
15
16 #tree h1.title {
17   font-size: 28px;
18   margin-bottom: 20px;
19   font-weight: normal;
20 }
21
22 #tree h1.title a:hover {
23   border-bottom: none;
24 }
25
26 #tree a {
27   font-size: 14px; 
28   line-height: 28px;
29 }
30
31 #tree dd.other {
32   display: none;
33 }
34
35 #tree .level-1,
36 #tree .parent,
37 #tree .child,
38 #tree .parent *,
39 #tree .child * {
40   display: inherit; 
41   color: inherit;
42 }
43
44 #tree dd.child-1,
45 #tree .child-2,
46 #tree .child-3,
47 #tree .child-4 {
48   display: none; 
49 }
50
51
52 #search {
53   height: 70px;
54 }
55
56 #content {
57     padding: 10px 30px 30px 350px;
58     margin-left: 0;
59 }
60
61 #content-main {
62   padding-top: 10px;
63   padding-left: 10px;
64 }
65
66 #content p,
67 #content li,
68 #content dt,
69 #content dd {
70   font-size: 16px;
71   line-height: 28px; 
72 }
73
74
75 #tree a {
76     display: inline !important;
77     font-weight: normal; 
78     color: #666;
79     border-bottom: 1px solid transparent;
80     padding-bottom: 2px;
81 }
82
83 #tree a:hover {
84     text-decoration: none;
85     border-bottom: 1px solid #aaa;
86 }
87
88 #tree .active > a {
89     display: inline;
90     color: #000;
91     border-bottom: 1px solid #555;
92
93 }
94
95 #content,
96 #tree {
97   font-family: Junge;
98 }
99
100 #content h1,
101 #content h2,
102 #content h3,
103 #content h4 {
104     font-weight: normal;
105 }
106
107 #content h1.title {
108  border-bottom: 2px solid #ccc;
109   padding-bottom: 10px;
110   margin-bottom: 40px;
111 }
112
113 #content h2 {
114   margin: 30px 0 20px 0;
115   padding-bottom: 5px;
116   font-size: 22px;
117   border-bottom: 2px solid #ddd;
118 }
119
120 #content h3 {
121  margin: 20px 0 10px 0; 
122   padding-bottom: 5px;
123   font-size: 20px;
124   border-bottom: 1px solid #eee;
125 }
126
127
128 #content h4 {
129   font-size: 18px;
130  margin: 20px 0 10px 0; 
131   padding-bottom: 10px;
132   border-bottom: 1px solid #eee;
133 }
134
135 #content code {
136   font-size: 14px;
137   color: #555;
138 }
139
140 #content dl
141 {
142     float: left;
143     width: 100%;
144     margin: 1em 0;
145     padding: 0;
146 }
147     
148 #content dt
149 {
150     clear: left;
151     float: left;
152     width: 25%;
153     margin: 0;
154     padding: 5px;
155     font-weight: normal;
156 }
157     
158 #content dd
159 {
160     float: left;
161     width: 65%;
162     margin: 0;
163     padding: 5px;
164     font-weight: normal;
165 }
166
167 /* Keyboard binding layout */
168 #content dl.bindings
169 {
170     float: left;
171     width: 100%;
172     margin: 1em 0;
173     padding: 0;
174 }
175     
176 #content .bindings dt
177 {
178     clear: left;
179     float: left;
180     width: 30%;
181     margin: 0;
182     padding: 0px;
183     font-size: 100%;
184     font-family: "Trebuchet MS", "Bitstream Vera Sans", Verdana, Arial, Helvetica, sans-serif;
185     font-weight: normal;
186 }
187     
188 #content .bindings dd
189 {
190     float: left;
191     width: 65%;
192     margin: 0;
193     padding: 0px;
194     font-size: 110%;
195     font-family: "Bitstream Vera Sans Mono", "Courier New", monospace;
196     font-weight: normal;
197 }
198
199
200 #content dl.wide-table
201 {
202     float: left;
203     width: 100%;
204     margin: 1em 0;
205     padding: 0;
206 }
207     
208 #content .wide-table dt
209 {
210         font-weight: normal;
211     clear: left;
212     float: left;
213     width: 30%;
214     margin: 0;
215     padding: 5px;
216 }
217
218 #content dt,
219 #content dd {
220     border-top: 2px solid #eee;
221 }
222
223 #content dt:first-child,
224 #content dd:nth-child(2) {
225     border-top: none;
226 }
227     
228 #content .wide-table dd
229 {
230     float: left;
231     width: 60%;
232     margin: 0;
233     padding: 5px;
234 }
235
236 #content dl.narrower-table
237 {
238     float: left;
239     width: 100%;
240     margin: 1em 0;
241     padding: 0;
242 }
243     
244 #content .narrower-table dt
245 {
246     clear: left;
247     float: left;
248     width: 20%;
249     margin: 0;
250     padding: 5px;
251 }
252     
253 #content .narrower-table dd
254 {
255     float: left;
256     width: 70%;
257     margin: 0;
258     padding: 5px;
259 }
260
261 kbd {
262     -moz-background-clip:border;
263     -moz-background-inline-policy:continuous;
264     -moz-background-origin:padding;
265     background:#EEEEEE none repeat scroll 0 0;
266     border-color:#CCCCCC #AAAAAA #888888 #BBBBBB;
267     border-style:solid;
268     border-width:2px 2px 4px 4px;
269     color:#000000;
270     padding:1px 2px;
271     white-space:nowrap;
272 }
273
274 kbd.input,kbd.lincmd,kbd.maccmd,kbd.wincmd {
275     font-family:mono;
276     border-width:0;
277 }
278
279 kbd.lincmd,kbd.maccmd,kbd.wincmd {
280     display:block;
281     width:100%;
282     margin-bottom:1ex;
283 }
284
285 kbd.lincmd:before {
286     content: 'user@linux:~ ';
287     color:#999999;
288 }
289
290 kbd.maccmd:before {
291     content: 'MacBook:~/Desktop User\$ ';
292     color:#999999;
293 }
294
295 kbd.wincmd:before {
296     content: 'C:\\Users\\myAccount> ';
297     color:#999999;
298 }
299
300 kbd.mouse {
301     -moz-border-radius:10px;
302     border-radius:10px;
303     border-width:3px;
304 }
305
306 kbd.menu,kbd.option,kbd.optoff {
307     border:none;
308     background-color:transparent;
309     font-weight:bold;
310     font-size:80%;
311     font-stretch:extra-condensed;
312     white-space:normal;
313 }
314
315 kbd.option:after,kbd.optoff:after {
316     content:'x';
317     font-family:mono;
318     font-weight:lighter;
319     text-align:center;
320     border:solid 1px black;
321     -moz-border-radius:10px;
322     border-radius:10px;
323     margin-left:1ex;
324 }
325 kbd.optoff:after {
326     content:'    ';
327 }
328
329
330 kbd.fader, kbd.knob, kbd.button {
331     border-color:#ccccff #aaaadd #8888bb #bbbbee;
332     background-color:#ddddff;
333     color:#000044;
334 }
335
336 kbd.fader {
337     border-width: 1px 1px 9px 9px;
338 }
339
340 kbd.knob {
341     -moz-border-radius:12px;
342     border-radius:12px; 
343     border-width: 1px 1px 9px 9px;
344 }
345
346 kbd.button {
347     -moz-border-radius:8px;
348     border-radius:8px;
349     border-width: 1px 1px 3px 3px;
350 }
351
352 samp {
353     font-family:mono;
354     font-style:italic;
355     color:#333333;
356     background-color:transparent;
357     margin-left: 1em;
358     margin-right: 1em;
359 }
360
361 samp:before {
362     content:"\BB";
363 }
364
365 samp:after {
366     content:"\AB";
367 }
368
369 #content td {
370     padding: 0 1em 0 1em;
371 }
372
373 #content .small {
374     width:150px;
375 }
376
377 #subtopics ul {
378     font-size:20px;
379     font-weight:bold;
380 }
381
382 #content dfn {
383     font-weight: bold;
384     font-style: normal;
385 }
386
387 #content .right {
388     margin: 0 0 1em 1em;
389     float:right;
390 }
391
392 #content .left {
393     margin:0 1em 1em 0;
394     float:left;
395 }
396
397 #content .note,.warning {
398     min-height: 20px;
399     padding: 19px;
400     margin-bottom: 20px;
401     border: 1px solid 
402     -webkit-border-radius: 4px;
403        -moz-border-radius: 4px;
404             border-radius: 4px;
405     -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
406        -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
407             box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
408 }
409
410 #content .note {
411     border-color: #e3e3e3;
412     background-color: #f5f5f5;
413 }
414
415 #content .warning {
416     border-color: #990000;
417     background-color: #ffeeee;
418 }
419
420
421
422 .mod1:before {
423     content: "Ctrl ";
424 }
425
426 .mod2:before {
427     content: "Alt ";
428 }
429
430 .mod3:before {
431     content: "Shift ";
432 }
433
434 .mod4:before {
435     content: "Win ";
436 }
437
438 .mod12:before {
439     content: "Ctrl Alt ";
440 }
441
442 .mod13:before {
443     content: "Ctrl Shift";
444 }
445
446 .mod14:before {
447     content: "Ctrl Win ";
448 }
449
450 .mac .mod1:before {
451     content: "Cmd ";
452 }
453
454 .mac .mod2:before {
455     content: "Ctrl ";
456 }
457
458 .mac .mod3:before {
459     content: "Shift ";
460 }
461
462 .mac .mod4:before {
463     content: "Opt ";
464 }
465
466 .mac .mod12:before {
467     content: "Cmd Ctrl ";
468 }
469
470 .mac .mod13:before {
471     content: "Cmd Shift ";
472 }
473
474 .mac .mod14:before {
475     content: "Cmd Opt ";
476 }
477
478
479
480 #gs_tti0 {
481
482   padding-top: 2px;
483   padding-bottom: 0;
484
485 }
486
487
488
489
490