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     padding: 0.2em;
 251
 252     background-color: #efefef;
 253
 254     border: 1px solid gray;
 255     border-left: 2px dotted gray;
 256     border-right: none;
 257
 258     z-index: 1;
 259     -moz-user-select: -moz-none;
 260     -webkit-user-select: none;
 261     user-select: none;
 262 }
 263
 264 /*
 265  * Przypisy
 266  */
 267
 268 /* Znaczniki w tekście */
 269 .htmlview .annotation {
 270     vertical-align: super;
 271     text-decoration: none;
 272     font-size: 0.66em;
 273 }
 274
 275 .htmlview .annotation:before {
 276     content: "[" counter(main) "]";
 277     counter-increment: main;
 278 }
 279
 280 .htmlview .annotation:hover {
 281     background-color: #dfdfdf;
 282 }
 283
 284 *.htmlview *.annotation-inline-box {
 285     position: static;
 286 }
 287
 288 /*
 289  * Przypisy w tekście
 290  */
 291  .htmlview .annotation-inline-box > span[x-annotation-box]
 292  {
 293      display: none;
 294      position: absolute;
 295
 296      max-width: 36em;
 297
 298      font-size: 8pt;
 299      line-height: 12pt;
 300      font-weight: normal;
 301      font-style: normal;
 302
 303      background: white;
 304      border-color: gray;
 305      border-width: 2px;
 306      border-style: outset;
 307      padding: 3px 5px;
 308
 309      text-decoration: none;
 310      z-index: 1000;
 311  }
 312
 313
 314 /*
 315  * Przypisy na końcu utworu (aktualnie nieuzywane)
 316  */
 317 .htmlview .annotations-block {
 318     counter-reset: secondary;
 319 }
 320
 321 .htmlview .annotations-block .annotation-body {
 322     position: relative;
 323     padding-left: 2.5em;
 324     padding-top: 0.2em;
 325 }
 326
 327 .htmlview .annotations-block .annotation-backref {
 328     position: absolute;
 329     top: 0.4em;
 330     left: -0.4em;
 331     width: 2.5em;
 332     text-align: right;
 333
 334 }
 335
 336 .htmlview .annotations-block .annotation-backref:before {
 337     content: "[" counter(secondary) "]";
 338     counter-increment: secondary;
 339 }
 340
 341 /*
 342  * EDITABLE ELEMENTS
 343  */
 344
 345 .htmlview *[x-editable] {
 346     padding-left: 3px;
 347 }
 348
 349 /* focused editable element */
 350 .htmlview *[x-editable]:hover
 351 {
 352     z-index: 900;
 353 }
 354
 355 .htmlview *[x-editable][x-open]
 356 {
 357     visibility: hidden;
 358 }
 359
 360 .context-menu {
 361     position: absolute;
 362     top: 0px;
 363     left: -50px;
 364     width: 50px;
 365
 366     text-align: center;
 367     font-size: 11px;
 368     line-height: 15px;
 369
 370     font-weight: normal;
 371     font-style: normal;
 372
 373     background-color: #dfdfdf;
 374
 375     margin: 0px;
 376     padding: 0px;
 377     visibility: inherit;
 378     display: block;
 379
 380     border-top: 1px solid black;
 381     border-left: 1px solid black;
 382     border-bottom: 1px solid black;
 383
 384     overflow: hidden;
 385
 386     -moz-border-radius-topleft: 2px;
 387     -moz-border-radius-bottomleft: 2px;
 388
 389     -webkit-border-top-left-radius: 2px;
 390     -webkit-border-bottom-left-radius: 2px;
 391
 392     z-index: 3000;
 393 }
 394
 395 .context-menu * {
 396     margin: 0px;
 397     display: block;
 398
 399     -moz-user-select: -moz-none;
 400     -webkit-user-select: none;
 401
 402     padding: 2px;
 403     cursor: pointer;
 404     border-bottom: 1px solid black;
 405
 406 }
 407
 408 .context-menu *:last-child {
 409     cursor: pointer;
 410     border-bottom: none;
 411 }
 412
 413 .context-menu *:hover {
 414     background-color: orange;
 415 }
 416
 417 /*
 418  * VISIBILITY RULES
 419  */
 420 .default-menu {
 421     visibility: inherit;
 422     opacity: 0.2;
 423 }
 424
 425 .default-menu:hover {
 426     opacity: 1;
 427     z-index: 5000;
 428 }
 429
 430 .htmlview *[x-annotation-box] > .default-menu {
 431     opacity: 1;
 432 }
 433
 434 .htmlview *[x-editable][x-open] > .default-menu {
 435     visibility: hidden;
 436 }
 437 .htmlview *[x-editable][x-open] *[x-annotation-box] > .default-menu {
 438     visibility: hidden;
 439 }
 440
 441 .htmlview *[x-editable] > .edit-menu {
 442     visibility: hidden;
 443 }
 444 .htmlview *[x-editable] *[x-annotation-box] > .edit-menu {
 445     visibility: hidden;
 446 }
 447
 448 .htmlview *[x-editable][x-open] > .edit-menu {
 449     visibility: visible;
 450 }
 451 .htmlview *[x-editable][x-open] *[x-annotation-box] > .edit-menu {
 452     visibility: visible;
 453 }
 454
 455 .html-editarea {
 456     border: 0px;
 457     background-color: gray;
 458     padding: 1px;
 459
 460     z-index: 2000;
 461 }
 462
 463 .html-editarea textarea
 464 {
 465     border: 2px solid black;
 466
 467     margin: 0px;
 468     padding: 0px;
 469
 470     width: 100%;
 471     height: 100%;
 472
 473     z-index: 0;
 474     font-size: 10pt;
 475     background-color: ivory;
 476 }
 477
 478 /*/
 479 /*
 480 /* Theme edit dialog
 481 /*
 482 /*/
 483 #theme-edit-dialog {
 484     left: 5%;
 485     right: 5%;
 486     top: 5%;
 487     bottom: 5%;
 488     padding: 0em;
 489 }
 490
 491 #theme-edit-dialog *.data-area {
 492     position: absolute;
 493
 494     top: 0px;
 495     left: 0px;
 496     right: 0px;
 497     bottom: 32px;
 498
 499     padding: 0px;
 500     background-color: #fafafa;
 501
 502     overflow-y: scroll;
 503 }
 504
 505 #theme-edit-dialog *.action-area {
 506     position: absolute;
 507     height: 30px;
 508     line-height: 20px;
 509
 510     left: 5px;
 511     right: 5px;
 512     bottom: 0px;
 513
 514     padding: 0px;
 515     margin: 0px;
 516
 517     border-top: 1px solid black;
 518     background-color: #fafafa;
 519 }
 520
 521 #theme-edit-dialog *.action-area * {
 522     vertical-align: baseline;
 523 }
 524
 525 #theme-edit-dialog .theme-multi-list {
 526     padding: 0.5em 1em;
 527 }
 528
 529 #theme-edit-dialog .theme-multi-list .unknown-themes {
 530     display: none;
 531 }
 532
 533 #theme-edit-dialog .theme-multi-list .letter-heading {
 534     font-size: 150%;
 535     text-align: left;
 536     border-bottom: 1px solid black;
 537     padding-top: 1em;
 538 }
 539
 540 #theme-edit-dialog .theme-mutli-list input:checked + label {
 541     font-weight: bold;
 542 }