From 3624025a3bc025ad204ffcf5c8e86f57210b02e3 Mon Sep 17 00:00:00 2001
From: Andres Galante <agalante@gmail.com>
Date: Sun, 1 Oct 2017 01:42:24 -0500
Subject: extends the click area of the close btn on modals (#23783)

---
 scss/_modal.scss | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

(limited to 'scss/_modal.scss')

diff --git a/scss/_modal.scss b/scss/_modal.scss
index a563e6ffbd..66f981151a 100644
--- a/scss/_modal.scss
+++ b/scss/_modal.scss
@@ -82,13 +82,14 @@
 // Top section of the modal w/ title and dismiss
 .modal-header {
   display: flex;
-  align-items: center; // vertically center it
+  align-items: flex-start; // so the close btn always stays on the upper right corner
   justify-content: space-between; // Put modal header elements (title and dismiss) on opposite ends
   padding: $modal-header-padding;
   border-bottom: $modal-header-border-width solid $modal-header-border-color;
 
   .close {
-    margin-left: auto; // Force icon to the right even when there's no .modal-title
+    padding: $modal-header-padding;
+    margin: (-$modal-header-padding) (-$modal-header-padding) (-$modal-header-padding) auto; // auto on the left force icon to the right even when there is no .modal-title
   }
 }
 
-- 
cgit v1.2.3