Merge branch 'popup-banner' into develop

mysociety · Oct 7, 2024 · 77ab702 · 77ab702
2 parents 9917dc2 + c42819c
commit 77ab702
Showing 1 changed file with 6 additions and 2 deletions.
diff --git a/app/assets/stylesheets/responsive/_popups_layout.scss b/app/assets/stylesheets/responsive/_popups_layout.scss
@@ -9,20 +9,24 @@
 .popup__close {
   position: absolute;
   display: inline-block;;
-  top: -0.25em;
+  top: 50%;
+  transform: translateY(-50%); // positions the icon vertically in the middle of the banner.
   right: 0.9375rem; // equal to the padding of .popup minus padding
   z-index: 50;
   padding: 0.5em;
+  font-size: 1.5rem; // The element's clickable area is big enough
 }
 
 .popup__content {
 
     padding-top: 1em;
     padding-bottom: 1em;
+    text-align: center;
     @include grid-column(12);
+    padding-right: 2.5rem; // No overlapping with the close button in smaller screens
     @include ie8{
       padding-left: 0.9375em;
-      padding-right: 0.9375em;
+      padding-right: 2.5rem;
     }
 }