Page MenuHomec4science

gui_style.css
No OneTemporary

File Metadata

Created
Thu, Mar 13, 18:52

gui_style.css

body {
--highlight: yellow;
--radius: 1em 1em;
--red-marking: red;
--length: 0.2em;
--nbrown: #5C4033;
--nblack2: #46494c;
--typesetter_black: #373a3d;
--red:#dc3545;
}
.zz-right {
position: relative;
display: inline-block;
left: 2em;
}
.typesetter_red {
color: var(--red);
}
.teiSpaceContainer {
position: relative;
}
.teiSpaceContainer .teiSpace {
position: absolute;
height: 1em;
top: 0.25em;
background-color: orange;
}
#input { position: fixed; left: 70%;}
form { margin-top: 2px;}
#message { color: red;}
.transkriptionField {background-color: #CED5CE; padding-right: 20px; padding-left: 5px; padding-top: 10px; padding-bottom: 10px;margin-left: 30px; width: max-content;}
.highlight, .metamark:hover { background-color: var(--highlight); }
.metamark { cursor: pointer;}
.small { color: black; padding: 3px; }
.fw-box { background-color: #add8e6;}
.box, .editorCorrection { background-color: #F5F5F5; width: max-content; text-align: start;}
.box .tooltip {
display: none;
}
.fw-box .tooltip {
display: none;
}
.box:hover, .fw-box:hover, .editorCorrection:hover {
cursor: context-menu;
position: relative;
}
.tooltip {
padding: 5px;
display: inline;
min-width: max-content;
border-radius: 5px;
font-size: 80%;
}
.box:hover .tooltip, .fw-box:hover .tooltip {
display: block;
z-index: 100;
line-height: 1.1em;
background-color: black;
opacity: .7;
color: white;
left: 0px;
position: absolute;
top: -2em;
text-decoration: none;
}
.EOL { color: red;}
.typesetter_black, .strikethrough-typesetter_black1 {
color: var(--typesetter_black);
font-weight: 600;
}
.N_black2 {
color: var(--nblack2);
}
.XXX_red, .N_red { color: #dc4731;}
.N-Archiv_red { color: #b8390e;font-weight: bold;}
.N_pencil { color: gray; font-weight: bold;}
.N_brown1, .N_brown { color: var(--nbrown);}
.red-marking:before {
color: var(--red-marking);
position: relative;
content: "";
left: -2px;
height: inherit;
top: 3px;
border-left: 2.5px solid;
}
.indent, .ident1 { margin-left: 1em;}
.indent2 { margin-left: 2em;}
.indent3 { margin-left: 3em;}
.indent4 { margin-left: 4em;}
.indent5 { margin-left: 5em;}
*[draggable] { cursor: grab; }
.deleted, .deleted-000, .hatching { cursor: context-menu; background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAHklEQVQIW2NkQAX/GZH4/4FsRpgAmAOSBBFwDkgAAIKuBATRTAAZAAAAAElFTkSuQmCC ) repeat; }
.red-deleted { cursor: context-menu; background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><path stroke-width='2000' stroke='red' stroke-dasharray='1.2 1.8 1.2' d='M1,1 1500,1500'/></svg>") repeat; }
.hex-deleted { background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><path stroke-width='240' stroke='%23750606' stroke-dasharray='1' d='M1,1 150,150'/></svg>") repeat; }
.new-deleted { background:url("https://upload.wikimedia.org/wikipedia/commons/7/73/Schraffur_fein_diagonal_hoch.svg") repeat; }
.deleted-N_brown1, .hatching-N_brown1 { cursor: context-menu; background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><path stroke-width='2000' stroke='%235C4033' stroke-dasharray='0.1 0.2 0.1 0.2' d='M1,1 1500,1500'/></svg>") repeat; }
.GSA_pencil { color: #6b6b6b;font-family: cursive;}
.singleBlock { position: relative; padding-top: 5em; padding-bottom: 5em;}
.firstBlock { position: relative; padding-top: 5em; }
.lastBlock { position: relative; padding-bottom: 5em; }
.textBlock { position: relative;}
.add-zone { font-size: 80%; }
.ab-zone { }
.zoneLine { position: absolute; z-index: 10;width:120%;}
.zoneLine[data-right-line-number]:after {
content: attr(data-right-line-number);
position: relative;
font-size: 80%;
color: blue;
text-align: right;
width: 90%;
display: block;
top: -1.5em;
font-style: italic;
}
.note-zone-bottom-right { position: absolute; bottom: 1em; font-style: italic;}
.fw-top { position: absolute; top: -0.1em;}
.fw-top-right { position: absolute; top: -0.1em; right: 50px;}
.fw-top-left { position: absolute; top: -0.1em; left: 25px;}
.fw-top-center { position: absolute; top: -0.1em; left: 50%;}
.fw-bottom-left { position: absolute; bottom: 0em; left: 25px;}
.fw-container { margin-left: 30px; width: 90%; display: inline-block;font-style: italic;}
.note-top-right { position: absolute; top: 1em; right: 0px;width: 100%;font-style: italic;}
.note-bottom-right { position: absolute; bottom: 2em; right: 0px;font-style: italic;}
.note-margin-left { position: absolute; bottom: 2em; left: 0px;font-style: italic;}
.note-right { position: absolute; right: 0px;font-style: italic;}
.note-left, .note-bottom { position: absolute;width: fit-content;height:1em;font-style: italic;}
.note-top-center { position: absolute; top: 1em; margin-left: 60%;margin-right:60%;width: 100%;font-style: italic; }
.note-left, .note-bottom, .note-top-center, .note-right, .note-bottom-right, .note-top-right {
z-index: 10;
}
.head-zone { position: absolute; top: 1em; width: 100%;}
.top-left { text-align: left }
.bottom-left { text-align: left }
.top-right { margin-left: 60%; }
.insertion-above {
position:relative; top: -2px;height: 100%; width: 100%; }
.insertion-below {
position:relative; top: 10px;height: 100%; width: 100%;
}
.inSpatium { padding-left: -0.1em;}
.beforePunctuation { padding-left: -0.01em;}
.insertionMark.insertion-below:before {
position: absolute;
content: "";
width: 0.2em;
height: inherit;
top: 2px;
border-bottom: 1px solid;
border-color: inherit;
}
.insertionMark.insertion-above:before, .insertionMark.left.insertion-below:before {
position: absolute;
content: "";
height: inherit;
width: var(--length);
top: -3px;
border-top: 1px solid;
border-color: inherit;/* inherit color from text */
}
.insertionMark.right.insertion-above:before, .insertionMark.right.insertion-below:before {
left: -2px;
border-left: 1px solid;
border-top-left-radius: var(--radius);
}
.insertionMark.left.insertion-above:before {
left: -2px;
border-right: 1px solid;
border-top-right-radius: var(--radius);
}
.inSpatium.insertion-above:before { left: -0.1em; }
.afterWord.insertion-above:before, .endOfLine.insertion-above:before { left: 0.05em; }
.inWord.insertion-above:before { left: -0.5px; }
.beforePunctuation.insertion-above:before { left: 2px; }
.below {
position: absolute;
top: 1.8em;
width: max-content;
line-height: 1.5em;
}
.below.instantaneous {
font-size: 100%;
}
.below {
font-size:80%;
}
.before, .after {
position: absolute;
width: max-content;
}
.after {
left: 1em;
}
.before {
left: -1em;
}
.above {
position: absolute;
top: -1.5em;
width: max-content;
line-height: 1.5em;
}
/* .inline .above, .inline .below {
font-size: 60%;
} */
.above.instantaneous {
font-size: 100%;
}
.above {
font-size:80%;
}
.centered{
display: inline-block;
text-align: center;
margin: auto;
width: 80%;
}
.centerLeft {
transform: translateX(-30%);
}
.insert-mark-above, .insert-mark-below { position: relative;padding-left: 2px; padding-right: 2px; height: 100%; }
.insertion-before, .insertion-after {
position: relative; left: 0em;
}
.inSpatium.insertion-below { padding-left: -3.5px;}
.beforePunctuation.insertion-below { padding-left: 3px;}
.inSpatium.insertion-below:before { left: -3.5px; }
.afterWord.insertion-below:before { left: 1px; }
.inWord.insertion-below:before { left: -0.5px; }
.beforePunctuation.insertion-below:before { margin-left: 4px;}
.addSpan { font-size:80%;}
.erased { color: grey;}
.inline { font-size:80%;}
.inline.instantaneous {
font-size: 100%;
}
.overwritten { text-decoration: line-through; color: red;}
.superimposed { color: green;}
.strikethrough, .strikethrough1,.strikethrough2 , .strikethrough-typesetter_black1 { text-decoration: line-through; }
.overwritten-punctuation { position: relative; color: red; }
.overwritten-punctuation:before {
position: absolute;
content: "";
left: 0;
top: 65%;
right: 0;
border-top: 1px solid;
border-color: inherit;
-webkit-transform:rotate(12deg);
-moz-transform:rotate(12deg);
-ms-transform:rotate(12deg);
-o-transform:rotate(12deg);
transform:rotate(12deg);
}
.strikethrough-apastrophe { position: relative; }
.strikethrough-apastrophe:before {
position: absolute;
content: "";
left: 0;
top: 25%;
right: 0;
border-top: 1px solid;
border-color: inherit;
-webkit-transform:rotate(-7deg);
-moz-transform:rotate(-7deg);
-ms-transform:rotate(-7deg);
-o-transform:rotate(-7deg);
transform:rotate(-7deg);
}
.deleted-underline { text-decoration: underline; position: relative; }
.deleted-underline:before {
position: absolute;
content: "";
left: 0;
top: 85%;
right: 0;
border-top: 1px solid;
border-color: inherit;
-webkit-transform:rotate(-5deg);
-moz-transform:rotate(-5deg);
-ms-transform:rotate(-5deg);
-o-transform:rotate(-5deg);
transform:rotate(-5deg);
}
.del-linearisiert:before { content: '['; }
.del-linearisiert:after { content: ']'; }
.underline { text-decoration: underline; }
.markLine { border-bottom: solid; }
.markLine_N_brown1 {
border-bottom: solid;
border-bottom-color: var(--nbrown);
}
.doubleUnderline {
text-decoration-line: underline;
text-decoration-style: double;
}
.above-linearisiert:before { content: '\2308'; }
.above-linearisiert:after { content: '\2309'; }
.below-linearisiert:before { content: '\230A'; }
.below-linearisiert:after { content: '\230B'; }
span.lnr, span.zlnr {
position:relative; left: -5em; font-style: italic; font-size: 80%; cursor: pointer; width: 3.5em;display: inline-block; margin-right: 1.5em; text-align: right;
}
span.lnr { color: blue;}
span.zlnr { color: grey;}
span.nolnr { margin-left: 3.125em;}
div.line { line-height: 3.0em; }
div.line.empty { display: block; height: 3em; width: 100%; }
.flushRight { float: right;
position: relative;
left: -1em;
}
.flushMiniRight { margin-left: 10%; }
span.line:after { content: '\00B6' }
.old-insert-mark:before { content: '\23DF';}
.headSpan { position: absolute; display: inline-block; left: 208px;}
.head { margin-left: 20%; display: inline-block; }
.latin { font-family: MyLatin, Arial, Helvetica, sans-serif;}

Event Timeline