Fauxdals | Crossroads Digital Design Kit

Fauxdals

Fauxdals are modal-like pages that have the ability to be "closed out of". They are designed to cover the entire height/width of the viewport.

Fauxdal Title

Lorem ipsum dolor sit amet, consectetur adipisicing elit.


<div class="fauxdal-wrapper">
  <div class="fauxdal fauxdal-center">
    <div class="container-fluid">
      <div class="pull-right close">
        <a>
          <svg class="icon icon-1" viewBox="0 0 256 256">
            <use xlink:href="/assets/svgs/icons.svg#close" xmlns:xlink="http://www.w3.org/1999/xlink"></use>
          </svg>
        </a>
      </div>

      <div class="fauxdal-content">
        <h1 class="title">Fauxdal Title</h1>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
      </div>

      <br>

      <footer class="page-footer btn-group-vertical">
        <button class="btn btn-secondary" type="button">Call To Action</button>
      </footer>
    </div>
  </div>
</div>