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