<div class="patterned-text">
    <p>Overflowing with vibrant blues, our island has inspired us to create a lens for those that thrive on color. Developed as a fashionable option for top selling styles, Blue Hawaii provides a stylish look that offers the same amazing color enhancement
        and clarity as all other Maui Jim lenses.</p>
</div>
<div class="patterned-text">
  {{#if value}}
  <p>{{{value}}}</p>
  {{/if}}
</div>
{
  "value": "Overflowing with vibrant blues, our island has inspired us to create a lens for those that thrive on color. Developed as a fashionable option for top selling styles, Blue Hawaii provides a stylish look that offers the same amazing color enhancement and clarity as all other Maui Jim lenses."
}
  • Content:
    .patterned-text {
      padding: 20px;
      background: url('../images/#{$patterned-text-background}') center center;
      text-align: center;
      box-sizing: border-box;
    
      p {
        max-width: 950px;
        margin: 15px auto;
        color: $color-dark;
        font-size: 1.4rem;
        line-height: 1.7rem;
      }
    
      .main & {
        margin: 0 $gutter-width-half;
      }
    
      @include breakpoint($breakpoint-md) {
        padding: 75px;
    
        p {
          font-size: 1.9rem;
          line-height: 2.3rem;
        }
      }
    }
    
  • URL: /components/raw/patterned-text/patterned-text.scss
  • Filesystem Path: src/components/01-elements/text-blocks/patterned-text/patterned-text.scss
  • Size: 471 Bytes
  • Handle: @patterned-text
  • Preview:
  • Filesystem Path: src/components/01-elements/text-blocks/patterned-text/patterned-text.html

There are no notes for this item.