Table look for legend paragraphs

Author: TerribleCoding

README.md

@@ -59,7 +59,7 @@ Note: _The order of this list might not match the order these features will be a
 
 _Release date: ???????????????????????_
 
-_Work Time: 8h 00m_
+_Work Time: 8h 40m_
 
 #### v1.2
 

pages/equations.css

@@ -104,7 +104,7 @@ input[name=select] {
     box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);
 }
 
-.card > div {
+.card:not(:first-of-type) > div {
     display: flex;
     flex-direction: column;
     flex-wrap: wrap;
@@ -126,6 +126,27 @@ h5 {
     margin: .15em;
 }
 
+.card:first-of-type p {
+    text-align: left;
+}
+
+.card p > span {
+    display: inline-block;
+    margin-left: 1em;
+}
+
+.card p > span:nth-child(1) {
+    display: none;
+}
+
+.card p > span:nth-child(2) {
+    width: 6ch;
+}
+
+.card p > span:nth-child(3) {
+    width: max-content;
+}
+
 mjx-container[jax="CHTML"][display="true"] {
     margin: .5em 0 !important;
 }

pages/equations.js

@@ -33,6 +33,7 @@ function setup() {
         label.append(link);
         div.append(btn, label, document.createElement('br'));
         list.append(div);
+        //reverse highlighting labels on scroll////////////////////////////////////////////////////
     }
 
     // content generation
@@ -61,9 +62,21 @@ function setup() {
             let strings = database[elt.obj["Name"]][indices[i]];
             for (let j = 0; j < strings.length; j++) {
                 let p = document.createElement('p');
-                p.innerHTML = strings[j];
-                if (i != 0) p.innerHTML = strings[j].replaceAll("/", "\\");
-                innerContainer.append(p);
+                if (i != 0) {
+                    p.innerHTML = strings[j];
+                    p.innerHTML = strings[j].replaceAll("/", "\\");
+                    innerContainer.append(p);
+                } else {
+                    let re = /(.+)\s?:\s?(.+)/;
+                    let spans = re.exec(strings[j]);
+                    for (let str of spans) {
+                        let s = document.createElement('span');
+                        s.innerHTML = str;
+                        p.append(s);
+                    }
+                    let br = document.createElement('br');
+                    innerContainer.append(p, br);
+                }
             }
             cards[i].append(title, innerContainer);
         }