Added word-break attribute to confirmation-header paragraph

Currently if an user access a non existent page no mobile that has a long url, it will cause the screen to overflow.
mysociety · Aug 22, 2024 · 8288545 · 8288545
1 parent 85fcfde
commit 8288545
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 0 deletions.
diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss
@@ -3011,6 +3011,7 @@ a#geolocate_link {
     color: #666666;
     font-size: 1.2em;
     margin-bottom: 0.5em;
+    word-break: break-word; // It prevents screen overflow when there is a long url, when a page has not been found.
   }
 
   & > :last-child {

diff --git a/web/cobrands/sass/_layout.scss b/web/cobrands/sass/_layout.scss
@@ -903,6 +903,10 @@ textarea.form-error {
     text-align: $left;
     padding: flip(3em 0 3em 132px, 3em 132px 3em 0); // for tick icon
     background-position: $left 2em;
+
+    p {
+      word-break: normal;
+    }
 }
 
 // Offline reporting UI