From 9fca3861cef8661577792d063b55253738b334a1 Mon Sep 17 00:00:00 2001
From: PLanCompS <18308236+pdmosses@users.noreply.github.com>
Date: Mon, 3 Aug 2020 17:38:48 +0200
Subject: [PATCH] Adjust dl layout
Works for description lists with multiple `dt` and `dd` elements.
---
_sass/content.scss | 8 +++++---
docs/index-test.md | 31 +++++++++++++++++++++++++++++++
2 files changed, 36 insertions(+), 3 deletions(-)
diff --git a/_sass/content.scss b/_sass/content.scss
index 113e7334..813ff8ce 100644
--- a/_sass/content.scss
+++ b/_sass/content.scss
@@ -109,7 +109,7 @@
dl {
display: grid;
- grid-template-columns: max-content 1fr;
+ grid-template: auto / 10em 1fr;
}
dt,
@@ -118,16 +118,18 @@
}
dt {
+ grid-column: 1;
text-align: right;
-
+ font-weight: 500;
&::after {
content: ":";
}
}
dd {
+ grid-column: 2;
margin-left: 1em;
- font-weight: 500;
+ margin-bottom: 0;
}
.anchor-heading {
diff --git a/docs/index-test.md b/docs/index-test.md
index 967ba6f6..c54db980 100644
--- a/docs/index-test.md
+++ b/docs/index-test.md
@@ -140,6 +140,37 @@ end
<dd>Green</dd>
</dl>
+#### Multiple description terms and values
+
+Term
+: Brief description of Term
+
+Longer Term
+: Longer description of Term,
+ possibly more than one line
+
+Term
+: First description of Term,
+ possibly more than one line
+
+: Second description of Term,
+ possibly more than one line
+
+Term1
+Term2
+: Single description of Term1 and Term2,
+ possibly more than one line
+
+Term1
+Term2
+: First description of Term1 and Term2,
+ possibly more than one line
+
+: Second description of Term1 and Term2,
+ possibly more than one line
+
+### More code
+
```
Long, single-line code blocks should not wrap. They should horizontally scroll if they are too long. This line should be long enough to demonstrate this.
```
--
GitLab