about summary refs log tree commit diff stats
path: root/frontend
diff options
context:
space:
mode:
authorAlan Pearce2024-05-05 18:54:32 +0200
committerAlan Pearce2024-05-05 18:54:32 +0200
commit9317874ab59f7bbbb517ea6b38799752bb44b14c (patch)
tree20ea5a7abdb6b0cafbb568733d377a24f9dd3d51 /frontend
parent9a7b37e5190d0a712a2188c5d9ca4c5f6e93bf66 (diff)
downloadsearchix-9317874ab59f7bbbb517ea6b38799752bb44b14c.tar.lz
searchix-9317874ab59f7bbbb517ea6b38799752bb44b14c.tar.zst
searchix-9317874ab59f7bbbb517ea6b38799752bb44b14c.zip
style: improve layout and formatting of code samples
Diffstat (limited to 'frontend')
-rw-r--r--frontend/static/style.css14
-rw-r--r--frontend/templates/blocks/options.gotmpl10
2 files changed, 21 insertions, 3 deletions
diff --git a/frontend/static/style.css b/frontend/static/style.css
index a747adf..d6534b8 100644
--- a/frontend/static/style.css
+++ b/frontend/static/style.css
@@ -1,3 +1,6 @@
+:root {
+  --preformatted: var(--code);
+}
 form {
   display: flex;
   column-gap: 1ex;
@@ -17,6 +20,17 @@ dd {
 
 dl {
   display: grid;
+  align-items: baseline;
+  grid-row-gap: 1ch;
   grid-template-rows: 1fr;
   grid-template-columns: max-content 1fr;
 }
+
+pre {
+  margin: unset;
+  padding: 1ch 1.4ch;
+}
+
+pre:has(> code) {
+  background: var(--bg);
+}
diff --git a/frontend/templates/blocks/options.gotmpl b/frontend/templates/blocks/options.gotmpl
index 1172e52..7c98450 100644
--- a/frontend/templates/blocks/options.gotmpl
+++ b/frontend/templates/blocks/options.gotmpl
@@ -10,16 +10,20 @@
       <dl>
         {{- with .Type }}
           <dt>Type</dt>
-          <dd>{{ . }}</dd>
+          <dd><code>{{ . }}</code></dd>
         {{- end }}
         {{- with .Default }}
           <dt>Default</dt>
-          <dd><code>{{ .Text }}</code></dd>
+          <dd>
+            <pre><code>{{ .Text }}</code></pre>
+          </dd>
         {{- end }}
         {{- with .Example }}
           {{- if .Text }}
             <dt>Example</dt>
-            <dd><code>{{ .Text }}</code></dd>
+            <dd>
+              <pre><code>{{ .Text }}</code></pre>
+            </dd>
           {{- end }}
         {{- end }}
         {{- with .RelatedPackages.HTML }}