Merge branch 'mf-modal-style-border-radius' into 'master'

Adjust modal border radius to match design spec

See merge request gitlab-org/gitlab-ce!30414

2 files changed, 15 insertions, 0 deletions

diff --git a/app/assets/stylesheets/framework/modal.scss b/app/assets/stylesheets/framework/modal.scss
index 1d00372d04d..b721b90fbb3 100644
--- a/app/assets/stylesheets/framework/modal.scss
+++ b/app/assets/stylesheets/framework/modal.scss
@@ -90,6 +90,20 @@ body.modal-open {
 .modal {
   background-color: $black-transparent;
 
+  .modal-content {
+    border-radius: $modal-border-radius;
+
+    *:first-child {
+      border-top-left-radius: $modal-border-radius;
+      border-top-right-radius: $modal-border-radius;
+    }
+
+    *:last-child {
+      border-bottom-left-radius: $modal-border-radius;
+      border-bottom-right-radius: $modal-border-radius;
+    }
+  }
+
   @include media-breakpoint-up(sm) {
     .modal-dialog {
       margin: 64px auto;
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 4521643ce08..c108f45622f 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -806,6 +806,7 @@ Modals
 */
 $modal-body-height: 80px;
 $modal-border-color: #e9ecef;
+$modal-border-radius: 0.25rem;
 
 $priority-label-empty-state-width: 114px;