Overview
{{ appName }} extends
Bootstrap Borders
in
src/assets/sass/core/components/helpers/_borders.scss to
provide additional border utility classes to cover its own design
system.
Border Styles
Use .border-dashedor .border-dottedclasses
to set an element's border style. For border directions use
.border-{direction}-dashedor
.border-{direction}-dottedclasses format.
Where
directionis one of:
-
top- for classes that set border top style
-
bottom- for classes that set border bottom style
-
end- for classes that set border right style
-
start- for classes that set border start style
default style
.border-dotted
.border-dashed
.border-bottom-dashed
.border-end-dashed
{{`
default style
.border-dotted
.border-dashed
.border-bottom-dashed
.border-end-dashed
`}}
Hover State
Use .border-hoverto display an element's border on hover.
{{`
default
gray-500
primary
`}}
Active State
Use .border-activeto display an element's border when
.activeclass applied.
{{`
default
gray-500
primary
`}}
Transparent Border
Use .border-transparentto set an element's border color
to tranparent.
Border Gray Colors
Use
.border-gray-{100, 200, 300, 400, 500, 600, 700, 800, 900}
to set an element's border color.