Corrected styling on blockquotes on be-concise page.

cagov · Dec 21, 2023 · 818c164 · 818c164
1 parent 20d54ae
commit 818c164
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 6 deletions.
diff --git a/docs/pages/content-design/principles/be-concise.md b/docs/pages/content-design/principles/be-concise.md
@@ -35,13 +35,19 @@ When there is less to read, it’s easier for people to complete their task.
 
 Here’s an example of how to make content more concise:
 
-**Complicated**
-
-> If an individual has a payment to submit to the Treasurer’s Office of Department of Weights and Measures that accompanies their license renewal, this payment must be submitted through the online portal at the same time of the submission of their application to the Department.
-
-**Concise**
+<div class="blockquote-container">
+  <div class="blockquote-body">
+    <div class="blockquote-header"><strong>Complicated</strong></div>
+    <div class="blockquote-content">If an individual has a payment to submit to the Treasurer’s Office of Department of Weights and Measures that accompanies their license renewal, this payment must be submitted through the online portal at the same time of the submission of their application to the Department.</div>
+  </div>
+</div>
 
-> You must pay your license fee when you renew your license. Use the Department of Weights and Measures online portal to renew and pay.
+<div class="blockquote-container">
+  <div class="blockquote-body">
+    <div class="blockquote-header"><strong>Concise</strong></div>
+    <div class="blockquote-content">You must pay your license fee when you renew your license. Use the Department of Weights and Measures online portal to renew and pay.</div>
+  </div>
+</div>
 
 Plainlanguage.gov has more tips for [writing concise content](https://www.plainlanguage.gov/guidelines/concise/). You can also see examples of how to improve government writing.
 

diff --git a/docs/src/css/sass/ds-site-overrides.scss b/docs/src/css/sass/ds-site-overrides.scss
@@ -79,3 +79,20 @@ cagov-page-feedback {
 }
 
 
+main.cagov-main {
+    div.blockquote-container {
+        background-color: white;
+        padding: 16px 16px;
+        margin: 16px 0px;
+        div.blockquote-body {
+            border-left: 3px solid #E3881B;
+            padding: 8px 16px;
+            div.blockquote-header {
+                margin-bottom: 16px;
+            }
+            div.blockquote-content {
+                font-size: 14px;
+            }
+        }
+    }
+}