bulma/docs/extensions.html

--- layout: default route: extensions extensions: - name: bulma-pageloader url: https://github.com/Wikiki/bulma-pageloader slug: bulma-pageloader width: 455 height: 133 - name: bulma-ribbon url: https://github.com/Wikiki/bulma-ribbon slug: bulma-ribbon
width: 455 height: 133 - name: bulma-badge url: https://github.com/Wikiki/bulma-badge slug: bulma-badge width: 455 height: 133 - name: bulma-steps url: https://github.com/Wikiki/bulma-steps slug: bulma-steps width: 989 height: 89 - name: bulma-tooltip
url: https://github.com/Wikiki/bulma-tooltip slug: bulma-tooltip width: 215 height: 55 - name: bulma-timeline url: https://github.com/Wikiki/bulma-timeline slug: bulma-timeline width: 435 height: 228 ---

<div class="container">
  {% include navbar.html id="Extensions" %}
</div>

<section class="hero is-info">
  <div class="hero-body">
    <div class="container">
      <div class="columns is-vcentered">
        <div class="column">
          <h1 class="title">
            <a href="{{ site.url }}/blog">Extensions</a>
          </h1>
          <p class="subtitle">
            Side projects to enhance Bulma
          </p>
        </div>
        <div class="column is-narrow">
          {% include carbon.html %}
        </div>
      </div>
    </div>
  </div>
</section>

<section class="section">
  <div class="container">
    {% for extension in page.extensions %}
    <a class="box" href="{{ extension.url }}">
      <div class="columns">
        <div class="column is-one-third">
          <h3 class="title is-4">
              <strong>{{ extension.name }}</strong>
            </h3>
          <h4 class="subtitle is-6">
              {{ extension.url | remove:'http://' | remove:'https://' | remove:'www.' }}
            </h4>
        </div>
        <div class="column">
          <img src="{{site.url}}/images/extensions/{{ extension.slug }}.png" width="{{ extension.width }}" height="{{ extension.height }}">
        </div>
      </div>
    </a>
    {% endfor %}

    <div class="message">
      <div class="message-body">
        <div class="level">
          <div class="level-left">
            <div class="level-item">
              <p>Have an extension to share with the community?</p>
            </div>
          </div>
          <div class="level-right">
            <div class="level-item">
              <a class="button is-primary" href="https://github.com/jgthms/bulma/pulls">
                Submit a Pull Request
              </a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>