c975778d9e564d9778b5a52e4f60ae7d9ec0b184
[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 .theme-begin, .htmlview .theme-end {
229     background: green;
230 }
231
232 .htmlview .theme-ref {
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 }
252
253 /* 
254  * Przypisy
255  */
256
257 /* Znaczniki w tekście */
258 .htmlview .annotation {    
259     vertical-align: super;
260     text-decoration: none;
261     font-size: 0.66em;    
262 }
263
264 .htmlview .annotation:before {
265     content: "[" counter(main) "]";
266     counter-increment: main;
267 }
268
269 .htmlview .annotation:hover {
270     background-color: #dfdfdf;
271 }
272
273 *.htmlview *.annotation-inline-box {
274     position: static;
275 }
276
277 /*
278  * Przypisy w tekście
279  */
280  .htmlview .annotation-inline-box > span[x-annotation-box]
281  {
282      display: none;
283      position: absolute;
284
285      max-width: 36em;
286      
287      font-size: 8pt;
288      line-height: 12pt;
289      font-weight: normal;
290      font-style: normal;
291
292      background: white;
293      border-color: gray;
294      border-width: 2px;
295      border-style: outset;
296      padding: 3px 5px;
297
298      text-decoration: none;
299      z-index: 10;
300  }
301  
302
303 /*
304  * Przypisy na końcu utworu (aktualnie nieuzywane)
305  */
306 .htmlview .annotations-block {
307     counter-reset: secondary;
308 }
309
310 .htmlview .annotations-block .annotation-body {
311     position: relative;
312     padding-left: 2.5em;
313     padding-top: 0.2em;
314 }
315
316 .htmlview .annotations-block .annotation-backref {
317     position: absolute;
318     top: 0.4em;
319     left: -0.4em;
320     width: 2.5em;
321     text-align: right;
322
323 }
324
325 .htmlview .annotations-block .annotation-backref:before {
326     content: "[" counter(secondary) "]";
327     counter-increment: secondary;
328 }
329
330 /*
331  * EDITABLE ELEMENTS
332  */
333
334 .htmlview *[x-editable] {    
335     padding-left: 3px;
336 }
337
338 /* focused editable element */
339 /* .htmlview *[x-editable]:hover
340 {    
341     
342 } */
343
344 .htmlview *[x-editable][x-open]
345 {
346     visibility: hidden;
347 }
348
349 .htmlview *[x-editable] > .context-menu {
350     position: absolute;
351     top: 0px;
352     left: -50px;
353     width: 50px;
354     
355     text-align: center;
356     font-size: 11px;
357     line-height: 15px;
358     
359     font-weight: normal;
360     font-style: normal;
361
362     background-color: #dfdfdf;
363
364     margin: 0px;
365     padding: 0px;
366     visibility: inherit;
367     display: block;
368
369     border-top: 1px solid black;
370     border-left: 1px solid black;
371     border-bottom: 1px solid black;
372     
373     overflow: hidden;
374     
375     -moz-border-radius-topleft: 2px;
376     -moz-border-radius-bottomleft: 2px;
377
378     -webkit-border-top-left-radius: 2px;
379     -webkit-border-bottom-left-radius: 2px;
380
381     z-index: 3000;
382 }
383
384 .htmlview *[x-editable] > .context-menu * {
385     margin: 0px;
386     display: block;
387
388     padding: 2px;
389     cursor: pointer;
390     border-bottom: 1px solid black;
391 }
392
393 .htmlview *[x-editable] > .context-menu *:last-child {
394     cursor: pointer;
395     border-bottom: none;
396 }
397
398 .htmlview *[x-editable] > .context-menu *:hover {
399     background-color: orange;
400 }
401
402 /*
403  * VISIBILITY RULES
404  */
405 .htmlview *[x-editable] > .default-menu {
406     visibility: inherit;
407     opacity: 0.4;
408 }
409
410 .htmlview *[x-editable] > .default-menu:hover {
411     opacity: 1;
412 }
413
414 .htmlview *[x-annotation-box][x-editable] > .default-menu {
415     opacity: 1;
416 }
417
418 .htmlview *[x-editable][x-open] > .default-menu {
419     visibility: hidden;
420 }
421
422 .htmlview *[x-editable] > .edit-menu {
423     visibility: hidden;
424 }
425
426 .htmlview *[x-editable][x-open] > .edit-menu {
427     visibility: visible;
428 }
429
430 .html-editarea {
431     border: 2px solid black;
432     background-color: gray;
433     padding: 1px;
434
435     z-index: 2000;
436 }
437
438 .html-editarea textarea
439 {
440     border: 0px;
441     margin: 0px;
442     padding: 0px;
443
444     width: 100%;
445     height: 100%;
446
447     z-index: 0;
448     font-size: 10pt;
449     background-color: ivory;
450 }
451
452 .html-editarea p.html-editarea-toolbar {
453     position: absolute;
454     background: gray;
455
456     bottom: -26px;
457     height: 24px;
458
459     left: 0px;
460     right: 0px;
461
462     border: 2px solid black;
463
464     margin: 0px;
465     padding: 0px;
466
467     z-index: 100;
468 }
469
470