From 4778deac023a0e359fe5321eb431f00b5f2b8c83 Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Sun, 13 Sep 2020 19:21:45 -0700
Subject: [PATCH] Tweak sizing and alignment of .btn-close in modal headers

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

diff --git a/scss/_modal.scss b/scss/_modal.scss
index 9cf3aa89a9..06ab5644d2 100644
--- a/scss/_modal.scss
+++ b/scss/_modal.scss
@@ -112,16 +112,15 @@
 .modal-header {
   display: flex;
   flex-shrink: 0;
-  align-items: flex-start; // so the close btn always stays on the upper right corner
+  align-items: center;
   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;
   @include border-top-radius($modal-content-inner-border-radius);
 
   .btn-close {
-    padding: $modal-header-padding;
-    // auto on the left force icon to the right even when there is no .modal-title
-    margin: (-$modal-header-padding-y) (-$modal-header-padding-x) (-$modal-header-padding-y) auto;
+    padding: ($modal-header-padding-y / 2) ($modal-header-padding-x / 2);
+    margin: ($modal-header-padding-y / -2) ($modal-header-padding-x / -2) ($modal-header-padding-y / -2) auto;
   }
 }