demo-pattern.variant

<div class="pattern" id="demo-pattern.variant">
    <details class="pattern-details">
      <summary class="pattern-name">
        demo-pattern.variant <a class="pattern-link" rel="bookmark" href="" title="View just this pattern">#</a>
      </summary>
      
      <code class="pattern-markup language-markup">
        <!-- github gists or possibly a grunt task to highlight markup here... -->
      </code>

      <pre class="pattern-usage">
        <strong>Usage:</strong> 
        Notes on how and when to use this pattern. 

        It's pre so no markup needed in here.
      </pre>
    </details>
    <div class="pattern-preview">
      <!-- the actual pattern -->
    </div>
</div>