Beaver Builder Components - 06222021
Colors
Accent Colors
ACF Color Options
primary_color
SASS Variable
$primary-color
ACF Color Options
secondary_color
SASS Variable
$secondary-color
ACF Color Options
tertiary_color
SASS Variable
$tertiary-color
Alert Colors
ACF Color Options
success_color
SASS Variable
$success-color
ACF Color Options
warning_color
SASS Variable
$warning-color
ACF Color Options
alert_color
SASS Variable
$alert-color
ACF Color Options
info_color
SASS Variable
$info-color
Shades
ACF Color Options
gray_color
SASS Variable
$gray-color
ACF Color Options
light_gray
SASS Variable
$light_gray
ACF Color Options
medium_gray
SASS Variable
$medium_gray
ACF Color Options
dark_gray
SASS Variable
$dark_gray
Type
UABB - Headers
h1. This is a very large header
h2. This is a large header
h3. This is a medium header
h4. This is a moderate header
h5. This is a small header
h6. This is a tiny header
UABB - Headers with Links
UABB - Fancy Text
**These ARE NOT REPONSIVE other than the type-writer animation.
This is the fancy Text
UABB - Duel Color Headings
I love this website! This is after text...
Basic - Text Editor
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque feugiat vulputate porta. Nullam porta, nisl at feugiat aliquam, risus purus fermentum magna, sit amet hendrerit dui tellus a dolor. Suspendisse vehicula, lectus a rhoncus accumsan, lectus dolor facilisis urna, eu pretium ligula metus a lorem. Vivamus ornare eget arcu et blandit. Donec sed elit quis risus convallis consequat. Praesent varius turpis dolor, ac luctus libero interdum at. Morbi varius ullamcorper nulla, a interdum mi. Vivamus vel enim id nibh consectetur convallis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus aliquet elit sed lacinia sodales. Cras at quam diam. In vel enim ut sapien ornare iaculis vitae vel nisi. Aenean ligula nisl, scelerisque at cursus sit amet, efficitur sed lacus. Fusce sodales magna eu elementum hendrerit. Morbi sodales elit vel arcu mattis fermentum. Etiam dapibus quam blandit gravida suscipit.
Basic - Icon
Basic - Icon Group
Buttons
To create different styles or sizes, just add one of the following classes (i.e. primary-button, secondary-button, tertiary-button...) to the advanced tab within the module. For UABB modules you can add the class(es) to the advanced tab or the additional class field with in the general or button specific tab.
Styles
primary-buttonsecondary-buttontertiary-button
Attributes
hollow- filled
Sizes
largesmalltiny
BB Basic Styles
BB Basic Size
UABB Single & Double
UABB - Marketing Button
**This button will inherently take the styles set in the SCSS. To avoid this, add class .override to the class within the general tab.