X-Git-Url: https://git.mdrn.pl/redakcja.git/blobdiff_plain/713b135cf1a9bb373e7bec2f7b5e5841ff334497..f7c25489e2c521e0cbcf86d8b75a88bd880c9602:/redakcja/static/css/html.css diff --git a/redakcja/static/css/html.css b/redakcja/static/css/html.css index b1bf4d94..b5737f87 100644 --- a/redakcja/static/css/html.css +++ b/redakcja/static/css/html.css @@ -1,6 +1,6 @@ /* Style widoku HTML. Nie należy tu ustawiać position ani marginesów */ .htmlview { - counter-reset: main; + counter-reset: main aktywnosc; font-size: 16px; font-family: "Georgia", "Times New Roman", serif; line-height: 1.5em; @@ -37,7 +37,7 @@ -webkit-border-radius: 4px; } */ -.htmlview *[x-node = 'RDF'] { +.htmlview *[x-node = 'RDF'][x-ns = 'http://www.w3.org/1999/02/22-rdf-syntax-ns#'] { display: none; } @@ -107,6 +107,16 @@ font-size: 0.875em; } +.htmlview pre { + overflow-x: auto; /* Use horizontal scroller if needed; for Firefox 2, not needed in Firefox 3 */ + white-space: pre-wrap; /* css-3 */ + white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */ + white-space: -pre-wrap; /* Opera 4-6 */ + white-space: -o-pre-wrap; /* Opera 7 */ /* + width: 99%; */ + word-wrap: break-word; /* Internet Explorer 5.5+ */ +} + /* ============= */ /* = Numbering = */ /* ============= */ @@ -159,6 +169,10 @@ } /* wersy */ +.htmlview *[x-verse]:after { + content: "\feff"; +} + .htmlview .strofa .wers_wciety, .htmlview .strofa .wers_wciety[data-wlf-typ='1'] { margin-left: 1em; } @@ -234,9 +248,18 @@ not(.strofa) > *[x-verse]::after { font-style: italic; } -.htmlview br.sekcja_swiatlo { - height: 3em; - /* visibility: hidden; */ +.htmlview .nota_red { + background-color: #eee; + border: 1px solid #888; + -moz-border-radius: 10px; + -webkit-border-radius: 10px; + display: block; + padding: 0 1em 1em 1em; +} + +.htmlview hr.sekcja_swiatlo { + margin: 2em 0; + visibility: hidden; } .htmlview hr.separator_linia { @@ -251,6 +274,10 @@ not(.strofa) > *[x-verse]::after { text-align: center; } +.htmlview p.sekcja_asterysk:after { + content: "*"; +} + .htmlview div.lista_osob ol { list-style: none; padding: 0 0 0 1.5em; @@ -333,11 +360,16 @@ div[x-node] > .uwaga { left: auto; clear: right; width: 10em; + + font-style: normal; font-weight: normal; - font-size: 13px; - line-height: 18px; font-variant: normal; + letter-spacing: 0; + text-transform: none; text-decoration: none; + + font-size: 13px; + line-height: 18px; background-color: #fff; /* border: 1px solid gray; @@ -349,6 +381,11 @@ div[x-node] > .uwaga { user-select: none; margin-right: -12em; text-align: left; + color: #999; +} + +.htmlview .canon { + color: black; } .htmlview .noncanon { @@ -390,9 +427,13 @@ div[x-node] > .uwaga { /* * Przypisy w tekście */ + +.htmlview .annotation-inline-box:hover > span[x-annotation-box]{ + display: block; +} + .htmlview .annotation-inline-box > span[x-annotation-box] { display: none; - position: absolute; width: 300px; font-size: 10pt; line-height: 12pt; @@ -443,7 +484,7 @@ div[x-node] > .uwaga { position: relative; padding: 2px; margin-left: 0; - border: 1px solid #FFF; + border: 1px solid transparent; } /* focused editable element */ @@ -455,12 +496,13 @@ div[x-node] > .uwaga { visibility: hidden; } -.edit-button, .delete-button, .accept-button { +/*.edit-button, .delete-button, .accept-button, .tytul-button, .wyroznienie-button, .slowo-button, .znak-button, .luka-button */ +.edit-button, .delete-button, .accept-button, .akap-edit-button { position: absolute; top: -21px; left: -1px; width: 72px; - height: 21px; + height: 28px; display: block; /* margin: 4px 0 2px 0;*/ padding: 5px 5px 2px 5px; @@ -478,9 +520,49 @@ div[x-node] > .uwaga { left: 70px; } +.tytul-button { + left:150px; + width:100px; +} + +.wyroznienie-button { + left:250px; + width:100px; +} +.slowo-button { + left:350px; + width:100px; +} +.znak-button { + left:450px; + width:100px; +} + +.luka-button { + left:550px; + width:100px; +} + +.zastap-button { + top: -50px; + left:550px; + width:100px; +} + + +/*.edit-button:hover, .edit-button:active, +.delete-button:hover, .delete-button:active, +.accept-button:hover, .accept-button:active, +.tytul-button:hover, .tytul-button:active, +.wyroznienie-button:hover, .wyroznienie-button:active, +.slowo-button:hover, .slowo-button:active, +.znak-button:hover, .znak-button:active, +.luka-button:hover, .luka-button:active */ + .edit-button:hover, .edit-button:active, .delete-button:hover, .delete-button:active, -.accept-button:hover, .accept-button:active { +.accept-button:hover, .accept-button:active, +.akap-edit-button:hover, .akap-edit-button:active { /* color: #FFF;*/ background-color: #999; color: #FFF; @@ -536,17 +618,32 @@ div[x-node] > .uwaga { } .html-editarea textarea { - position: absolute; +/* position: absolute; -- might be unnecessary, and we need attributes to be pushed down*/ top: 0; margin: 0px; padding: 0px; width: 100%; + min-width: 600px; /* for editing narrow elements */ height: 100%; z-index: 0; font-size: 10pt; /* background-color: ivory;*/ } +.html-editarea .html-editarea-attributes span { + border: 1px dotted black; + padding: 2px; + margin: 2px; +} + +.html-editarea .html-editarea-attributes span label { + background-color: white; + padding: 5px; + min-width: 150px; + display: inline-block; + font-family: mono; +} + .htmlview .out-of-flow-text { display: block; font-face: monospace; @@ -578,3 +675,146 @@ div[x-node] > .uwaga { padding: 0.25em; border: 1px solid orange; } + +.alien { + color: red; +} + +/* specialChars */ +#specialCharsContainer { + text-align: center; + width: 600px; + height: 400px; + padding:20px; + background-color: gray; + position: absolute; + top: 20px; + left: 20px; + z-index:1000; + overflow:auto; +} +#specialCharsContainer a { + color: white; + font-weight: bold; +} + +#tableSpecialChars td input { + background-color: transparent; + border:0; + color: white; +} + +#tableSpecialChars td input.recentSymbol { + background-color: white; + border:0; + color: black; +} + + +.htmlview .lista[data-wlf-typ="alfa"] +{ + list-style-type: lower-alpha; +} + +.htmlview .lista[data-wlf-typ="slowniczek"] +{ + list-style-type: none; +} + +.htmlview span.punkt { + display: list-item; + list-style-position: inside; +} + +.htmlview span.aktywnosc span.opis { + font-style: italic; +} +.htmlview span.aktywnosc span.opis p:before { + content: counter(aktywnosc) ". "; + counter-increment: aktywnosc; + font-weight: bold; +} + +.htmlview span.aktywnosc span.wskazowki { + font-style: italic; + color: #202020; +} + +.htmlview .pomoce, .htmlview .czas, .htmlview .forma { + display: block; +} +.htmlview .pomoce:before { content: "Pomoce: "; } +.htmlview .czas:before { content: "Czas: "; } +.htmlview .czas:after { content: " min"; } +.htmlview .forma:before { content: "Forma: "; } + +.htmlview .aktywnosc { + display: block; +} + +.htmlview .definiendum { + font-weight: bold; + display: block; +} + +.htmlview .definiens { + padding-left: 50px; +} + +.htmlview .link { + color: #990066; +} + +.htmlview .tabela { + display: table; +} + +.htmlview .wiersz { + display: table-row; +} + +.htmlview .kol { + min-width: 200px; + display: table-cell; + padding: 5px; +} + +.htmlview .kol span { + position: relative; +} + +.htmlview img.obraz { + max-width: 640px; +} + +.htmlview span.luka { + color: #808080; + display: inline-block; + padding: 0px 8px; + border-bottom: 1px solid grey; +} + +.htmlview span.zastap { + color: darkred; +} + +.htmlview span.zastap:after { + content: "→" attr(data-wlf-rozw); + color: darkgoldenrod; +} + +.htmlview .punkt[data-wlf-nazwa]:before { + content: "[" attr(data-wlf-nazwa) "] "; + color: darkgoldenrod; +} + +.htmlview .punkt[data-wlf-name]:before { + content: "!name![" attr(data-wlf-name) "] "; + color: red; +} + + +.htmlview .punkt[data-wlf-rozw]:before { + content: "[" attr(data-wlf-rozw) "] "; + color: darkblue; +}