bdee45448c44e2a1177a89e5f5c8b065da99479d
[redakcja.git] / platforma / static / css / html.css
1 /* Style widoku HTML. Nie należy tu ustawiać position ani marginesów */
2
3 .htmlview {
4     counter-reset: main;
5     font-size: 16px;
6     font-family: "Georgia", "Times New Roman", serif;
7     line-height: 1.5em;
8     padding: 3em;
9     padding-left: 55px;
10 }
11
12 .htmlview *[x-node='rdf:RDF'] {
13     display: none;
14 }
15
16 .htmlview * {
17     position: relative;
18 }
19
20 .htmlview div {
21     max-width: 36em;
22 }
23
24 .htmlview #toc {
25     display: none;
26 }
27
28 .htmlview a {
29     color: blue;
30     text-decoration: none;
31 }
32
33 .htmlview a:hover {
34     text-decoration: none;
35 }
36
37 .htmlview h1 {
38     font-size: 3em;
39     margin: 1.5em 0;
40     text-align: center;
41     line-height: 1.5em;
42     font-weight: bold;
43 }
44
45 .htmlview h2 {
46     font-size: 2em;
47     margin: 1.5em 0 0;
48     font-weight: bold;
49     line-height: 1.5em;
50 }
51
52 .htmlview h3 {
53     font-size: 1.5em;
54     margin: 1.5em 0 0;
55     font-weight: normal;
56     line-height: 1.5em;
57 }
58
59 .htmlview h4 {
60     font-size: 1em;
61     margin: 1.5em 0 0;
62     line-height: 1.5em;
63 }
64
65 .htmlview p {
66     margin: 0;
67 }
68
69 .htmlview #footnotes div {
70     margin: 1.5em 0 0 0;
71 }
72
73 .htmlview #footnotes p {
74     margin-left: 2.5em;
75     font-size: 0.875em;
76 }
77
78 .htmlview blockquote {
79     font-size: 0.875em;
80 }
81
82 /* ============= */
83 /* = Numbering = */
84 /* ============= */
85 .htmlview .anchor {
86     position: relative;
87     margin: 0em;
88     left: -2.2em;
89     color: #777;
90     font-size: 12px;
91     width: 2em;
92     text-align: center;
93     padding: 0.25em 0.7em;
94     line-height: 1.5em;
95 }
96
97 .htmlview .anchor:hover, .htmlview .anchor:active {
98     color: #FFF;
99     background-color: #CCC;
100 }
101
102 /* =================== */
103 /* = Custom elements = */
104 /* =================== */
105 .htmlview .autor_utwor {
106     font-size: 0.5em;
107     display: block;
108     line-height: 1.5em;
109     margin-bottom: 0.25em;
110 }
111
112 .htmlview .dzielo_nadrzedne {
113     font-size: 1.5em;
114     display: block;
115     line-height: 1.5em;
116     margin-bottom: -0.25em;
117 }
118
119 .htmlview .podtytul {
120     font-size: 0.5em;
121     display: block;
122     line-height: 1.5em;
123     margin-top: -0.25em;
124 }
125
126 .htmlview .didaskalia {
127     font-style: italic;
128     margin: 0.5em 0 0 1.5em;
129 }
130
131 .htmlview .kwestia {
132     margin: 0.5em 0 0;
133 }
134
135 .htmlview .strofa {
136     margin: 1.5em 0 0 auto;    
137 }
138
139 .htmlview .kwestia .strofa {
140     margin: 0;
141 }
142
143 .htmlview .akap, .htmlview .akap_cd, .htmlview .akap_dialog {
144     text-align: justify;
145     margin: 1.5em 0 0;
146 }
147
148 .htmlview p.motto {
149     text-align: justify;
150     font-style: italic;
151     margin: 1.5em 0 0;
152 }
153
154 .htmlview p.motto_podpis {
155     font-size: 0.875em;
156     text-align: right;
157 }
158
159 .htmlview div.fragment {
160     border-bottom: 0.1em solid #999;
161     padding-bottom: 1.5em;
162 }
163
164 .htmlview div.nota p,
165 .htmlview div.dedykacja p {
166     text-align: right;
167     font-style: italic;
168 }
169
170 .htmlview br.sekcja_swiatlo {
171     height: 3em;
172     /* visibility: hidden; */
173 }
174
175 .htmlview hr.separator_linia {
176     margin: 1.5em 0;
177     border: none;
178     border-bottom: 0.1em solid #000;
179 }
180
181 .htmlview p.sekcja_asterysk {
182     padding: 0;
183     margin: 1.5em 0;
184     text-align: center;
185 }
186
187 .htmlview div.lista_osob ol {
188     list-style: none;
189     padding: 0 0 0 1.5em;
190 }
191
192 .htmlview p.miejsce_czas {
193     font-style: italic;
194 }
195
196 .htmlview .mat,
197 .htmlview .slowo_obce,
198 .htmlview .tytul_dziela,
199 .htmlview .didaskalia {
200     font-style: italic;
201 }
202
203 .htmlview .wyroznienie {
204     letter-spacing: 0.1em;
205 }
206
207 .htmlview .osoba {
208     font-style: normal;
209     font-variant: small-caps;
210 }
211
212 .htmlview .parse-warning {
213     display: block;
214     font-size: 10pt;
215     background: #C0C0C0;
216     margin: 1em;
217 }
218
219  .parse-warning .message {
220     color: purple;
221     font-weight: bold;
222 }
223
224
225 /* Motywy */
226 /* ======================== */
227 /* = Footnotes and themes = */
228 /* ======================== */
229
230 .htmlview .begin, .htmlview .end {
231     background: green;
232 }
233
234 .htmlview .motyw {
235     /* position: absolute; */
236     
237     float: right;
238     left: auto;
239     clear: right;
240     
241     width: 10em;
242     
243     font-weight: normal;
244     font-size: 10pt;
245     font-variant: normal;
246     text-decoration: none;
247
248
249     background-color: #fff;
250     
251 /*    border: 1px solid gray;
252
253     border-right: none;
254 */    
255     z-index: 1;
256     -moz-user-select: -moz-none;
257     -webkit-user-select: none;
258     user-select: none;
259     margin-right: -12em;
260     text-align: left;
261 }
262
263 .htmlview .motyw[x-editable] {
264     border-left: 4px solid #DDD;
265     padding: 0.2em 0.2em 0.2em 0.5em;
266     margin-top: 0.2em;
267
268 }
269
270 /* 
271  * Przypisy
272  */
273
274 /* Znaczniki w tekście */
275 .htmlview .annotation {    
276     vertical-align: super;
277     text-decoration: none;
278 /*    font-size: 10px;    */
279 }
280
281 .htmlview .annotation:before {
282     content: "[" counter(main) "]";
283     counter-increment: main;
284 }
285
286 .htmlview .annotation:hover {
287     background-color: #dfdfdf;
288 }
289
290 *.htmlview *.annotation-inline-box {
291     position: static;
292 }
293
294 /*
295  * Przypisy w tekście
296  */
297  .htmlview .annotation-inline-box > span[x-annotation-box]
298  {
299      display: none;
300      position: absolute;
301
302      max-width: 36em;
303      
304      font-size: 8pt;
305      line-height: 12pt;
306      font-weight: normal;
307      font-style: normal;
308
309      background: white;
310      border-color: gray;
311      border-width: 2px;
312      border-style: outset;
313      padding: 3px 5px;
314
315      text-decoration: none;
316      z-index: 1000;
317  }
318  
319
320 /*
321  * Przypisy na końcu utworu (aktualnie nieuzywane)
322  */
323 .htmlview .annotations-block {
324     counter-reset: secondary;
325 }
326
327 .htmlview .annotations-block .annotation-body {
328     position: relative;
329     padding-left: 2.5em;
330     padding-top: 0.2em;
331 }
332
333 .htmlview .annotations-block .annotation-backref {
334     position: absolute;
335     top: 0.4em;
336     left: -0.4em;
337     width: 2.5em;
338     text-align: right;
339
340 }
341
342 .htmlview .annotations-block .annotation-backref:before {
343     content: "[" counter(secondary) "]";
344     counter-increment: secondary;
345 }
346
347 /*
348  * EDITABLE ELEMENTS
349  */
350
351 .htmlview *[x-editable] {    
352     position: relative;
353     padding: 2px;
354     margin-left: 0;
355     border: 1px solid #FFF;
356 }
357
358 /* focused editable element */
359 .htmlview *[x-editable]:hover
360 {
361     z-index: 900;
362
363
364 .htmlview *[x-editable][x-open]
365 {
366     visibility: hidden;
367 }
368
369 .edit-button {
370     position: absolute;
371     top: -21px;
372     left: -1px;
373     width: 50px;
374     height: 21px;
375     
376     display: block;
377 /*    margin: 4px 0 2px 0;*/
378     padding: 5px 5px 2px 5px;
379     border: none;
380     background-color: #FAFAFA;
381     
382 /*    z-index: 3000;*/
383 /*    color: #FFF;
384     z-index: 1500;
385 */    border: 1px solid #DDD;
386     border-bottom: none;
387 }
388
389
390 .edit-button:hover, .edit-button:active {
391 /*    color: #FFF;*/
392     background-color: #999;
393     color: #FFF;
394 }
395
396 /*
397  * VISIBILITY RULES
398  */
399 .default-menu {
400     visibility: inherit;
401     opacity: 0.2;
402 }
403
404 .default-menu:hover {
405     opacity: 1;
406     z-index: 5000;
407 }
408
409 .htmlview *[x-annotation-box] > .default-menu {
410     opacity: 1;
411 }
412
413 .htmlview *[x-editable][x-open] > .default-menu {
414     visibility: hidden;
415 }
416 .htmlview *[x-editable][x-open] *[x-annotation-box] > .default-menu {
417     visibility: hidden;
418 }
419
420 .htmlview *[x-editable] > .edit-menu {
421     visibility: hidden;
422 }
423 .htmlview *[x-editable] *[x-annotation-box] > .edit-menu {
424     visibility: hidden;
425 }
426
427 .htmlview *[x-editable][x-open] > .edit-menu {
428     visibility: visible;
429 }
430 .htmlview *[x-editable][x-open] *[x-annotation-box] > .edit-menu {
431     visibility: visible;
432 }
433
434 .html-editarea {
435     border: 0px;
436     background-color: gray;
437     padding: 1px;
438
439     z-index: 2000;
440     position: absolute;
441 }
442
443 .html-editarea textarea
444 {
445 /*    border: 2px solid black;*/
446     
447     margin: 0px;
448     padding: 0px;
449
450     width: 100%;
451     height: 100%;
452
453     z-index: 0;
454     font-size: 10pt;
455 /*    background-color: ivory;*/
456 }
457
458 /*/
459 /*
460 /* Theme edit dialog
461 /*
462 /*/
463 /*#theme-edit-dialog {    
464     left: 5%;
465     right: 5%;
466     top: 5%;
467     bottom: 5%;
468     padding: 0em;
469 }
470
471 #theme-edit-dialog *.data-area {
472     position: absolute;
473
474     top: 0px;
475     left: 0px;
476     right: 0px;
477     bottom: 32px;
478
479     padding: 0px;
480     background-color: #fafafa;
481
482     overflow-y: scroll;
483 }
484
485 #theme-edit-dialog *.action-area {
486     position: absolute;
487     height: 30px;
488     line-height: 20px;
489
490     left: 5px;
491     right: 5px;
492     bottom: 0px;
493
494     padding: 0px;
495     margin: 0px;
496     
497     border-top: 1px solid black;
498     background-color: #fafafa;
499 }
500
501 #theme-edit-dialog *.action-area * {
502     vertical-align: baseline;
503 }
504
505 #theme-edit-dialog .theme-multi-list {
506     padding: 0.5em 1em;
507 }
508
509 #theme-edit-dialog .theme-multi-list .unknown-themes {
510     display: none;
511 }
512
513 #theme-edit-dialog .theme-multi-list .letter-heading {
514     font-size: 150%;
515     text-align: left;
516     border-bottom: 1px solid black;
517     padding-top: 1em;
518 }
519
520 #theme-edit-dialog .theme-mutli-list input:checked + label {
521     font-weight: bold;
522 }*/
523
524 .out-of-flow-text {
525     border: 1px solid #C8B849;
526     background-color: #D4CB9C;
527     white-space: pre;
528     overflow: auto;
529     margin: 1.5em 0 0;
530     font-family: monospace;
531     font-size: 10pt;
532 }