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