Hero styles

These classes are used to change the color of the heading text.

Code:

A <span class="platform-hero__heading--blue">mass texting service</span> designed for businesses

Publishes as:

A mass texting service designed for businesses

Chat bubble

This mimics the chat bubble style found in the Textline app. Currently found on the mass texting page.

Code:

<span class="chat-bubble">Hello {{contact.name}}. Your next appointment at Honeycomb Salon with Jenna is {{date}} at {{time}}. Reply Y to confirm your appointment.</span>

Publishes as:

Hello {{contact.name}}. Your next appointment at Honeycomb Salon with Jenna is {{date}} at {{time}}. Reply Y to confirm your appointment.

Quote style

This style can be found on the mass texting page. Additional classes can be used to emphasize the text with color.

Code:

<span class="platform__quote">"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere."</span>

Publishes as:

"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere."

Laura West, Support Manager for Thirdlove

Spacing utilities

These classes modify the spacing of an element.

platform__mb8
Padding bottom 8px
platform__mb16
Padding bottom 16px
platform__mb40
Padding bottom 40px