Styleguide

Form

This is the standard form. The thank you modal has a slot for adding New Patient forms if a user checks they're a first time patient. Check out this pug file to see how the content is slotted in.

Submit the form below and someone from our office will reach out to you shortly!

Name

Phone

Message

I consent to receive text messages about dental care and appointment reminders from Dental Artistry in Anaheim Hills at the phone number I provided. I acknowledge that my consent is not a condition of purchase. Msg & data rates may apply. Msg frequency varies. Reply HELP for assistance or STOP to opt out of receiving messages. Privacy Policy

I consent to receive marketing text messages; such as promotional offers from Dental Artistry in Anaheim Hills at the phone number I provided. I acknowledge that my consent is not a condition of purchase. Msg & data rates may apply. Msg frequency varies. Reply HELP for assistance or STOP to opt out of receiving messages. Privacy Policy

I agree to receive marketing emails and phone calls.

Images

See style-guide-component component in components for reference.

This is the 'BaseBackground' component, it can be passed a prop (':bgColor') to change the background color. The prop takes a string of the hex-code of the color. Its default styling is set to bg position, center and bg size as cover.

This is the 'BaseImage' component with the 'imageBackground' prop in it's default, 'false', which sets an object-fit to contain so it will behave like an img tag.

This is the 'BaseImage' component with the 'imageBackground' prop toggled true and the object-fit is set to cover so it will behave like a background image on a div.

Grid

The grid is not intended to be nested, it is a simple sass grid

.col-5
.col-8--tablet

.col-2
.col-4--tablet

.col-3
.col-2--offset

.col-4
.col-6--tablet

.col-3
.col-1--offset
.col-6--tablet

.col-4