Merge branch '45-make-notes-abbreviations-e-g-lx-green-i-e-link-colour' into 'master'

Resolve "Make notes abbreviations (e.g. LX) green, i.e. link colour"

Closes #45

See merge request !43

scenarios/xslt/edxml2html/css/styles.css

@@ -4,7 +4,8 @@
     --theme-color-light: #aeb7c6;
     --theme-color-light-bg: rgba(174, 183, 198, 0.185);
     */
-    --theme-color: #266d4d;
+    --theme-color: #3aa675; /* color of hyperlinks / clickable elements */
+    --theme-color-dark: #266d4d; /* background color of highlighted text elements */
     --theme-color-light: #adbac7;
     --theme-color-light-bg: rgba(173, 186, 199, 0.185);
     
@@ -23,7 +24,7 @@
 
 .column-anchor,
 .anchor {
-    color: var(--theme-color);
+    color: var(--theme-color-dark);
 }
 
 
@@ -81,7 +82,7 @@ div.column {
 
 .line:hover .line-nr {
     background-color: var(--theme-color-light);
-    color: var(--theme-color);
+    color: var(--theme-color-dark);
 }
 
 .line:hover {
@@ -94,7 +95,7 @@ div.column {
 span.seg:hover{
     /* background-color: rgba(165, 42, 42, 0.150); */
     /* background-color: rgba(0, 57, 103, 0.150); */
-    background-color: var(--theme-color);
+    background-color: var(--theme-color-dark);
     color: white !important;
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
@@ -108,7 +109,7 @@ hr.metamark-line::before {
     background: inherit;
     font-family: var(--tech-font);
     padding: 0 .3em 0 0;
-    color: var(--theme-color);
+    color: var(--theme-color-dark);
 }
 
 hr.metamark-line {
@@ -121,13 +122,13 @@ hr.metamark-line {
 
 hr.metamark-line.line {
     height:4px;
-    border-top:1px solid var(--theme-color);
+    border-top:1px solid var(--theme-color-dark);
 }
 
 hr.metamark-line.doubleLine {
     height:4px;
-    border-top:1px solid var(--theme-color);
-    border-bottom:1px solid var(--theme-color);
+    border-top:1px solid var(--theme-color-dark);
+    border-bottom:1px solid var(--theme-color-dark);
 }
 
 
@@ -233,7 +234,7 @@ hr.metamark-line.doubleLine {
 }*/
 
 .item {
-    border: 0px solid var(--theme-color);
+    border: 0px solid var(--theme-color-dark);
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
     border-radius: 3px;
@@ -271,7 +272,7 @@ hr.metamark-line.doubleLine {
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
     border-radius: 3px;
-    background-color: var(--theme-color);
+    background-color: var(--theme-color-dark);
     color: white;
 }
 
@@ -282,7 +283,7 @@ hr.metamark-line.doubleLine {
 
 .item .annotation > span:hover {
     background-color: var(--theme-color-light);
-    color: var(--theme-color);
+    color: var(--theme-color-dark);
 }
 
 /*----- NOTES -----*/
@@ -344,6 +345,7 @@ hr.metamark-line.doubleLine {
 }
 
 .note-item > label {
+  color: var(--theme-color);
   font-variant: small-caps;
   font-weight: bold;
 }
@@ -362,13 +364,12 @@ hr.metamark-line.doubleLine {
 
 .unit .note-item > label:not(:has(~ input[type=checkbox]:checked))::after {
   content: ": ";
-  font-weight: bold;
 }
 
 /*----------------------------------{ ITEMS: WORDS }--------------------------------*/
 
 .item.w:hover {
-    background-color: var(--theme-color);
+    background-color: var(--theme-color-dark);
     color: white;
 }