Add border-radius to dropdown items (#27703)

twbs · Nov 21, 2018 · e7e43ed · e7e43ed
1 parent 31d6d03
commit e7e43ed
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 0 deletions.
diff --git a/scss/_dropdown.scss b/scss/_dropdown.scss
@@ -136,6 +136,14 @@
   background-color: transparent; // For `<button>`s
   border: 0; // For `<button>`s
 
+  &:first-child {
+    @include border-top-radius($dropdown-inner-border-radius);
+  }
+
+  &:last-child {
+    @include border-bottom-radius($dropdown-inner-border-radius);
+  }
+
   @include hover-focus {
     color: $dropdown-link-hover-color;
     text-decoration: none;

diff --git a/scss/_variables.scss b/scss/_variables.scss
@@ -657,6 +657,7 @@ $dropdown-bg:                       $white !default;
 $dropdown-border-color:             rgba($black, .15) !default;
 $dropdown-border-radius:            $border-radius !default;
 $dropdown-border-width:             $border-width !default;
+$dropdown-inner-border-radius:      calc(#{$dropdown-border-radius} - #{$dropdown-border-width}) !default;
 $dropdown-divider-bg:               $gray-200 !default;
 $dropdown-box-shadow:               0 .5rem 1rem rgba($black, .175) !default;