diff options
| author | Justin <justinhuang@me.com> | 2019-01-13 22:49:25 +0300 |
|---|---|---|
| committer | Mark Otto <otto@github.com> | 2019-01-13 22:49:25 +0300 |
| commit | 8f5abf0ab08c2ce734990e9ff274939ea5ad9fcf (patch) | |
| tree | 27fb776be3e72ac71120b5aceb6206847de45837 /site/docs | |
| parent | fd4d426e51377c63c1bdbb7044ff6d775f57c689 (diff) | |
Add new rounded sizes classes (#28011)
* update border-radius mixins
Add $enable-rounded as a keyword argument to border-raidus mixins
* Update rounded classes
- use border-radius mixins to repleace !important
- use true for $enable-rounded for rounded classes
- Add `.rounded-sm` and `.rounded-sm` #27934
* update borders docs
* Revert touch of dist files
* Revert change of border-radius mixins
* use !important in border-radius utilies classes
* update border radius classes keep only rounded-lg and rounded-sm
Diffstat (limited to 'site/docs')
| -rw-r--r-- | site/docs/4.2/utilities/borders.md | 14 |
1 files changed, 14 insertions, 0 deletions
diff --git a/site/docs/4.2/utilities/borders.md b/site/docs/4.2/utilities/borders.md index 0cf2f9c3c1..ebb59fb651 100644 --- a/site/docs/4.2/utilities/borders.md +++ b/site/docs/4.2/utilities/borders.md @@ -75,3 +75,17 @@ Add classes to an element to easily round its corners. <img src="..." alt="..." class="rounded-pill"> <img src="..." alt="..." class="rounded-0"> {% endhighlight %} + +## Sizes + +Use `.rounded-lg` or `.rounded-sm` for larger or smaller border-radius. + +<div class="bd-example bd-example-images"> + {%- include icons/placeholder.svg width="75" height="75" class="rounded-sm" title="Example small rounded image" -%} + {%- include icons/placeholder.svg width="75" height="75" class="rounded-lg" title="Example large rounded image" -%} +</div> + +{% highlight html %} +<img src="..." alt="..." class="rounded-sm"> +<img src="..." alt="..." class="rounded-lg"> +{% endhighlight %} |