General Styles

Thruline Font Colors

For any block that you add our Thruline-prefixed text color classes to, every text-based element within that block will inherit your new font color. This can be applied on a parent element with multiple text elements, or on a single, specific text element.

Avoid nesting colors. You may run into a precedence issue based on which color is defined in our stylesheet last.

Color options:

  • tl-text-bsd-pink
  • tl-text-bsd-lpink
  • tl-text-bsd-purple
  • tl-text-bsd-lpurple
  • tl-text-bsd-red
  • tl-text-msw-dblue
  • tl-text-msw-lblue
  • tl-text-at-red
  • tl-text-at-blue
  • tl-text-link-blue
  • tl-text-text
  • tl-text-gray-1
  • tl-text-gray-2
  • tl-text-gray-3
  • tl-text-gray-4
  • tl-text-gray-5
  • tl-text-white
  • tl-text-black
  • reset

Examples:

                                <p class="tl-text-blue-001">
  Blue Text Here
</p>

<div class="tl-text-green-002">
  <h2>This would be green.</h2>
  <p>This, too, would be green.</p>
  <div>Even this would be green.</div>
</div>

Bootstrap Grids

Grids provide a way for us to organize content within responsive columns/containers.

This doc barely scrapes the surface on Bootstrap 4 grids. For more in-depth information, see their documentation here.

Grids in Bootstrap 3 are a little different than in 4. For more information on specific Bootstrap 3 implementations, see their documentation here.

Examples:

Component

Component description.

Component Example:

Component

Component description.

Component Example: