Add max width to prose content

x-govuk · Dec 23, 2023 · 4f2fd10 · 4f2fd10
1 parent c9a21ee
commit 4f2fd10
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 0 deletions.
diff --git a/components/document-header/_document-header.scss b/components/document-header/_document-header.scss
@@ -1,4 +1,9 @@
 .app-document-header__metadata {
   @include govuk-font($size: 16, $line-height: 1.5);
   color: $govuk-secondary-text-colour;
+  max-width: 45em;
+}
+
+.app-document-header__description {
+  max-width: 30em;
 }
diff --git a/components/prose-scope/_prose-scope.scss b/components/prose-scope/_prose-scope.scss
@@ -9,6 +9,29 @@
     margin-bottom: 0;
   }
 
+  h1 {
+    max-width: 15em;
+  }
+
+  h2 {
+    max-width: 20em;
+  }
+
+  h3 {
+    max-width: 30em;
+  }
+
+  h4,
+  h5,
+  h6,
+  p,
+  ul:not([class]),
+  ol,
+  img,
+  video {
+    max-width: 38em;
+  }
+
   // Indicate abbreviations which have a title
   abbr {
     border-bottom: 1px dotted $govuk-secondary-text-colour;