lists.html 4.3 KB
<div class="tube">
<h2>Simple list</h2>
<ul bs-list>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
</ul>
<br/>
<h2>Bordered list</h2>
<ul bs-list="bordered">
    <li>/gallery/new-item</li>
    <li><a href="#">https://github.com/shakyShane/browser-sync/pull/400</a></li>
    <li>Item 3</li>
    <li>Item 4</li>
    <li>Item 5</li>
</ul>
<br/>
<h2>Bordered list with controls</h2>
</div>

<ul bs-list="bordered inline-controls">
    <li>
        <p>https://github.com/Browsersync/UI/</p>
        <div bs-button-group>
            <button href="#" bs-button="subtle-alt icon">
              <svg bs-svg-icon><use xlink:href="#svg-syncall"></use></svg>
            </button>
            <button href="#" bs-button="subtle-alt icon">
                <svg bs-svg-icon><use xlink:href="#svg-bin"></use></svg>
            </button>
        </div>
    </li>
    <li>
        <p>https://github.com/Browsersync/UI/issues</p>
        <div bs-button-group>
            <button href="#" bs-button="subtle-alt icon">
              <svg bs-svg-icon><use xlink:href="#svg-syncall"></use></svg>
            </button>
            <button href="#" bs-button="subtle-alt icon">
                <svg bs-svg-icon><use xlink:href="#svg-bin"></use></svg>
            </button>
        </div>
    </li>
    <li>
        <p>https://twitter.com/browsersync</p>
        <div bs-button-group>
            <button href="#" bs-button="subtle-alt icon">
              <svg bs-svg-icon><use xlink:href="#svg-syncall"></use></svg>
            </button>
            <button href="#" bs-button="subtle-alt icon">
                <svg bs-svg-icon><use xlink:href="#svg-bin"></use></svg>
            </button>
        </div>
    </li>
    <li>
        <p>http://browsersync.io</p>
        <div bs-button-group>
            <button href="#" bs-button="subtle-alt icon">
              <svg bs-svg-icon><use xlink:href="#svg-syncall"></use></svg>
            </button>
            <button href="#" bs-button="subtle-alt icon">
                <svg bs-svg-icon><use xlink:href="#svg-bin"></use></svg>
            </button>
        </div>
    </li>
    <li>
        <p>http://stackoverflow.com/questions/tagged/browser-sync</p>
        <div bs-button-group>
            <button href="#" bs-button="subtle-alt icon">
              <svg bs-svg-icon><use xlink:href="#svg-syncall"></use></svg>
            </button>
            <button href="#" bs-button="subtle-alt icon">
                <svg bs-svg-icon><use xlink:href="#svg-bin"></use></svg>
            </button>
        </div>
    </li>
    <li>
        <p>http://www.browsersync.io/docs/options/#option-snippetOptions</p>
        <div bs-button-group>
            <button href="#" bs-button="subtle-alt icon">
              <svg bs-svg-icon><use xlink:href="#svg-syncall"></use></svg>
            </button>
            <button href="#" bs-button="subtle-alt icon">
                <svg bs-svg-icon><use xlink:href="#svg-bin"></use></svg>
            </button>
        </div>
    </li>
    <li>
        <p>https://github.com/shakyShane/browser-sync/blob/master/CONTRIBUTING.md</p>
        <div bs-button-group>
            <button href="#" bs-button="subtle-alt icon">
              <svg bs-svg-icon><use xlink:href="#svg-syncall"></use></svg>
            </button>
            <button href="#" bs-button="subtle-alt icon">
                <svg bs-svg-icon><use xlink:href="#svg-bin"></use></svg>
            </button>
        </div>
    </li>
    <li>
        <p>http://www.browsersync.io/docs/options/#option</p>
        <div bs-button-group>
            <button href="#" bs-button="subtle-alt icon">
              <svg bs-svg-icon><use xlink:href="#svg-syncall"></use></svg>
            </button>
            <button href="#" bs-button="subtle-alt icon">
                <svg bs-svg-icon><use xlink:href="#svg-bin"></use></svg>
            </button>
        </div>
    </li>
    <li>
        <p>http://www.wearejh.com</p>
        <div bs-button-group>
            <button href="#" bs-button="subtle-alt icon">
              <svg bs-svg-icon><use xlink:href="#svg-syncall"></use></svg>
            </button>
            <button href="#" bs-button="subtle-alt icon">
                <svg bs-svg-icon><use xlink:href="#svg-bin"></use></svg>
            </button>
        </div>
    </li>
</ul>