sfgov-design-system/docs/examples/index.html

This is the design system for [SF.gov](https://sf.gov) and the City & County of San Francisco.

---
---

<h1>All examples</h1>

{% for example in examples %}
  <div class="rounded border border-solid border-grey-1 relative mb-40">
    {% if example.title %}
      <h2 class="big-desc mx-20">
        {{ example.title }}
        {% if example.ref %}
          <a href="{{ example.ref }}"
            class="inline-block -mb-2"
            title="See this example in the docs">
            <sfgov-icon symbol="info"></sfgov-icon>
          </a>
        {% endif %}
      </h2>
    {% endif %}
    <iframe
      src="{{ example.url }}"
      class="w-full rounded border-0 bg-white"
      style="overflow-y: auto;"
      scrolling="no"> 
    </iframe>
    <div
      class="absolute px-16 py-4 bg-grey-1 rounded-bl"
      style="top: 0; right: 0;">
      <a href="{{ example.url }}"
        class="font-medium no-underline"
        target="_blank">
        Inspect
      </a>
      <a href="{{ example.source.url }}"
        class="font-medium no-underline ml-20">
        Reference
      </a>
    </div>
    <!--
      <pre>{{ example | dump(2) }}</pre>
    -->
  </div>
{% endfor %}