Bootstrap: New btn-rounded utility class?

[sts-ryan-holton]

Hi! I'm suggesting a simple, yet effective utility class here for buttons to be added. Whilst the Bootstrap docs does indeed have a rounded-circle utility class found in the border section (https://getbootstrap.com/docs/4.1/utilities/borders/#border-radius) this doesn't quite work too well when applied to buttons to essentially create a pill shaped button.

The rounded-circle utility class looks like this and doesn't quite work as expected when added to buttons.

.rounded-circle {
    border-radius: 50%!important;
}

I suggest creating an additional utility class with a px value for buttons to create a nice effect, possibly something like this...

.btn-rounded {
    border-radius: 50px!important;
}

I use rounded buttons a lot in my work and find myself having to create these classes, I don't think it would take too much to add this in the next release?

Cheers!

[Quberik]

awesome feature

[mdo]

Rather than make button specific classes, this should a .rounded-* utility class. Something like .rounded-pill or .rounded-50 to indicate a value.

[sts-ryan-holton]

Can this be added to Bootstrap 4.1.2? @mdo

[mdo]

@sts-ryan-holton No, new features are only added in major and minor releases, not patch releases.

[sts-ryan-holton]

Any update here, this seems dead? @mdo

[tarkhov]

Implemented here - https://tarkhov.github.io/postboot/#button-pill