fractal example

Example component: Flipped 

<div class="map-row flip ">
    <div class="map-row__map" id="mapRowMap">
    </div>
    <input type="hidden" id="baseLatitude" value="51.509925">
    <input type="hidden" id="baseLongitude" value="-0.093676">
    <div class="container-constrained map-row__container">

        <div class="map-row__text">
            <div class="map-row__text-container">
                <div class="map-row__title heading-2">About us</div>
                <div class="map-row__copy paragraph">We’re an ambitious, innovative and aspirational company that aims to bring a radical, new approach to development by creating sustainable communities that understand and meet the needs of people.We’re an ambitious, innovative and aspirational company that aims to bring a radical, new approach to development by creating sustainable communities that understand and meet the needs of people.</div>

                <div class="secondary-cta">
                    <div class="secondary-cta__text">Find out more</div>
                    <div class="secondary-cta__arrow"><img src="/right-arrow.svg" /></div>
                </div>

                <div class="secondary-cta">
                    <div class="secondary-cta__text">Find out more</div>
                    <div class="secondary-cta__arrow"><img src="/right-arrow.svg" /></div>
                </div>
            </div>
        </div>
    </div>
</div>
 
{{!< layouts}}

<div class="map-row {{#if flip}}flip{{/if}} ">
      <div class="map-row__map" id="mapRowMap">
        </div>
        <input type="hidden" id="baseLatitude" value="51.509925">
        <input type="hidden" id="baseLongitude" value="-0.093676">
    <div class="container-constrained map-row__container">
      
        <div class="map-row__text">
            <div class="map-row__text-container">
                <div class="map-row__title heading-2">{{title}}</div>
                <div class="map-row__copy paragraph">{{copy}}</div>
                {{> @secondary-cta }}
                {{> @secondary-cta }}
            </div>
        </div>
    </div>
</div>
 
{
  "title": "About us",
  "copy": "We’re an ambitious, innovative and aspirational company that aims to bring a radical, new approach to development by creating sustainable communities that understand and meet the needs of people.We’re an ambitious, innovative and aspirational company that aims to bring a radical, new approach to development by creating sustainable communities that understand and meet the needs of people.",
  "flip": true
}

No notes defined.