Helpers

sApp includes a wide range of shorthand utility classes to modify an element's appearance.

add any of listed classes to the html element to apply them.


CSS Class Reference

Font Weight

Class Details
.fw-3 Sets font-weight to 300
.fw-4 Sets font-weight to 400
.fw-5 Sets font-weight to 500
.fw-6 Sets font-weight to 600
.fw-7 Sets font-weight to 700

Border

Class Details
.border-none Remove any border from the element

Color

Class Details
.text-primary Sets element color as template primary color
.text-secondary Sets element color as template secondary color
.text-white Sets element color as template white color
.text-dark Sets element color as template dark color

Background Color

Class Details
.bg-white Sets background-color White to the element
.bg-dark Sets background-color Dark to the element
.bg-gray Sets background-color Grey to the element
.bg-inherit Sets background-color inherit to the element

Border Radius

Class Details
.rounded-sm Sets small border-radius to the element
.rounded-lg Sets large border-radius to the element
.radius-100 Sets 100px border-radius to the element

Box Shadow

Class Details
.shadow-sm Sets small box-shadow to the element
.shadow Sets medium box-shadow to the element
.shadow-lg Sets large box-shadow to the element

Height

Class Details
.h-100vh Sets the height of the element to 100vh

Opacity

Class Details
.op-5 Sets opacity .05 to the element

Overflow

Class Details
.overflow-hidden Sets overflow attribute to hidden

Avatar Size

Class Details
.avatar-sm Sets avatar size to small
.avatar-md Sets avatar size to medium
.avatar-lg Sets avatar size to large