Add .rounded-0 utility class (#21214)

* Add rounded-0 class

diff --git a/docs/utilities/borders.md b/docs/utilities/borders.md
index 0088a28275b1e3a6196c877e9ab6eb53bdcf4b22..1eb716c1f9c6f231a308abba655a8df956e0cb8d 100644 (file)
--- a/docs/utilities/borders.md
+++ b/docs/utilities/borders.md
@@ -25,12 +25,13 @@ Add classes to an element to remove all borders or some borders.
 Add classes to an element to easily round its corners.
 
 <div class="bd-example bd-example-images">
-  <img data-src="holder.js/100x100" class="rounded" alt="Example rounded image">
-  <img data-src="holder.js/100x100" class="rounded-top" alt="Example top rounded image">
-  <img data-src="holder.js/100x100" class="rounded-right" alt="Example right rounded image">
-  <img data-src="holder.js/100x100" class="rounded-bottom" alt="Example bottom rounded image">
-  <img data-src="holder.js/100x100" class="rounded-left" alt="Example left rounded image">
-  <img data-src="holder.js/100x100" class="rounded-circle" alt="Completely round image">
+  <img data-src="holder.js/75x75" class="rounded" alt="Example rounded image">
+  <img data-src="holder.js/75x75" class="rounded-top" alt="Example top rounded image">
+  <img data-src="holder.js/75x75" class="rounded-right" alt="Example right rounded image">
+  <img data-src="holder.js/75x75" class="rounded-bottom" alt="Example bottom rounded image">
+  <img data-src="holder.js/75x75" class="rounded-left" alt="Example left rounded image">
+  <img data-src="holder.js/75x75" class="rounded-circle" alt="Completely round image">
+  <img data-src="holder.js/75x75" class="rounded-0" alt="Example non-rounded image (overrides rounding applied elsewhere)">
 </div>
 
 {% highlight html %}
@@ -40,4 +41,5 @@ Add classes to an element to easily round its corners.
 <img src="..." alt="..." class="rounded-bottom">
 <img src="..." alt="..." class="rounded-left">
 <img src="..." alt="..." class="rounded-circle">
+<img src="..." alt="..." class="rounded-0">
 {% endhighlight %}

diff --git a/scss/utilities/_borders.scss b/scss/utilities/_borders.scss
index e3e31de4bf810ba3db5ecbc6c219aa86cffcf148..015c9b943bd69a0e10f8f4c98c3375e93db321f6 100644 (file)
--- a/scss/utilities/_borders.scss
+++ b/scss/utilities/_borders.scss
@@ -31,3 +31,7 @@
 .rounded-circle {
   border-radius: 50%;
 }
+
+.rounded-0 {
+  border-radius: 0;
+}