simpler gloss

assets/css/site.css

@@ -886,19 +886,9 @@ details {
 }
 
 .gloss {
-  display: grid;
-  grid-template-columns: 1fr;
-  /*grid-template-rows: repeat(3, 1fr);*/
-  gap: 0px 0px;
-  grid-template-areas:
-    "glosstop"
-    "glossmiddle"
-    "glossbottom";
   grid-area: gloss;
 }
-.glosstop { grid-area: glosstop; }
-.glossbottom { grid-area: glossbottom; }
-.glossmiddle { grid-area: glossmiddle; }
+
 .glossnumber { 
   grid-area: glossnumber; 
 }
@@ -907,15 +897,14 @@ details {
   content: "(" counter(glossN) ")";
   padding-right: 0.3rem;
 }
-
+.glossline {
+  border-bottom: lightgray solid 1px;
+  border-top: lightgray solid 1px;
+}
 .glosswords {
   display: inline-block;
-  margin-left: -0.3rem;
-}
-
-.glossword {
-  margin-left: 0.3rem; 
-  margin-right: 0.5rem; 
+  padding-left: -0.3rem;
+  padding-right: 1rem; 
 }
 
 @media (max-width: 767px) {

layouts/shortcodes/gloss.html

@@ -1,26 +1,23 @@
+{{ $inn := .Inner | $.Page.RenderString }}
 <div class="glosscontainer">
     <div class="gloss">
-        {{- range $g := split .Inner "\n" -}}
-            {{- if hasPrefix $g "{t}" -}}
-                <div class="glosstop">
+        {{- range $g := (split $inn "\n") -}}
+            {{- if hasPrefix $g "{r}" -}}
+                <div class="glossregular">
                     {{- substr $g 3 -}}
                 </div>
-            {{- else if hasPrefix $g "{m}" -}}
-                <div class="glossmiddle">
+            {{- else if hasPrefix $g "{g}" -}}
+                <div class="glossline">
                     {{- range (split (substr $g 3) "|") -}}
                         {{- with . -}}
                             <div class="glosswords">
                                 {{- range (split . "," ) -}}
-                                    <div class="glossword">{{- . -}}</div>
+                                    <div class="glossword">{{- . | htmlUnescape | safeHTML -}}</div>
                                 {{- end -}}
                             </div>
                         {{- end -}}
                     {{- end -}}
                 </div>
-            {{- else if hasPrefix $g "{b}" -}}
-                <div class="glossbottom">
-                    {{- substr $g 3 -}}
-                </div>
             {{- end -}}
         {{- end -}}
     </div>