Skip to content

Commit fcba7a9

Browse files
committed
docs: add new border utilities
1 parent ba0ee67 commit fcba7a9

File tree

1 file changed

+18
-0
lines changed

1 file changed

+18
-0
lines changed

docs/content/4.0/utilities/borders.md

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,18 @@ Change the border color using utilities built on our theme colors.
4343
<span class="border border-white"></span>
4444
{{< /example >}}
4545

46+
Using utilities you can change the border on one side only, or you can change all borders to make them different colors.
47+
48+
{{< example class="docs-example-border-utils" >}}
49+
<span class="border-top border-top-primary"></span>
50+
<span class="border-end border-end-primary"></span>
51+
<span class="border-bottom border-bottom-primary"></span>
52+
<span class="border-start border-start-primary"></span>
53+
<span class="border-start border-start-primary border-end border-end-danger"></span>
54+
<span class="border-top border-top-primary border-end border-end-danger border-bottom border-bottom-success"></span>
55+
<span class="border border-top-primary border-end-danger border-bottom-success border-start-info"></span>
56+
{{< /example >}}
57+
4658
## Border-width
4759

4860
{{< example class="docs-example-border-utils" >}}
@@ -51,6 +63,12 @@ Change the border color using utilities built on our theme colors.
5163
<span class="border border-3"></span>
5264
<span class="border border-4"></span>
5365
<span class="border border-5"></span>
66+
67+
<span class="border-start border-start-1"></span>
68+
<span class="border-start border-start-2"></span>
69+
<span class="border-start border-start-3"></span>
70+
<span class="border-start border-start-4"></span>
71+
<span class="border-start border-start-5"></span>
5472
{{< /example >}}
5573

5674
## Border-radius

0 commit comments

Comments
 (0)