Buttons with icons

<div class="slab" style="padding: 1rem 2rem">
    <div>Browse button: For links to the datatable view</div>
    <button class="button--standard button--browse" style="margin-right: 2rem">Button</button>

    <div style="margin-top: 2rem">Document button: for opening documents</div>
    <button class="button--standard button--document" style="margin-right: 2rem">Button</button>

    <div style="margin-top: 2rem">List button: to show a list view</div>
    <button class="button--standard button--list" style="margin-right: 2rem">Button</button>

    <div style="margin-top: 2rem">Map button: to see a map view</div>
    <button class="button--standard button--map" style="margin-right: 2rem">Button</button>

    <div style="margin-top: 2rem">Search button: search with text</div>
    <button class="button--standard button--search--text" style="margin-right: 2rem">Button</button>

    <div style="margin-top: 2rem">Subscribe button: for subscribing to calendar updates in different formats</div>
    <div id="calendar-subscribe" class="export-widget">
        <div class="dropdown js-button-icon-dropdown">
            <button class="button button--standard dropdown__button button--subscribe" style="width: auto">Subscribe</button>
            <ul class="dropdown__panel dropdown__panel--right" aria-hidden="true">
                <li class="dropdown__item"><a class="dropdown__value" href="">Apple calendar</a></li>
                <li class="dropdown__item"><a class="dropdown__value" href="">Google calendar</a></li>
                <li class="dropdown__item"><a class="dropdown__value" href="">Microsoft Outlook calendar</a></li>
            </ul>
        </div>
    </div>
    <button class="button--standard button--subscribe">Button</button>

    <div style="margin-top: 2rem">Download button: to initiate a download with a choice of formats</div>
    <div id="calendar-subscribe" class="export-widget">
        <div class="dropdown js-button-icon-dropdown">
            <button class="button button--standard dropdown__button button--download--dropdown">Download</button>
            <ul class="dropdown__panel dropdown__panel--right" aria-hidden="true">
                <li class="dropdown__item"><a class="dropdown__value" href="">.ics</a></li>
                <li class="dropdown__item"><a class="dropdown__value" href="">.csv</a></li>
            </ul>
        </div>
    </div>
    <button class="button--standard button--download">Button</button>

    <div style="margin-top: 2rem">Add to calendar button</div>
    <div id="calendar-subscribe" class="export-widget">
        <div class="dropdown js-button-icon-dropdown">
            <button class="button--standard dropdown__button dropdown__button--mini button--add-calendar--mini"><span class="u-visually-hidden">Download calendar</span></button>
            <ul class="dropdown__panel" aria-hidden="true">
                <li class="dropdown__item"><a class="dropdown__value" href="">Apple Calendar</a></li>
                <li class="dropdown__item"><a class="dropdown__value" href="" target="_blank">Google Calendar</a></li>
                <li class="dropdown__item"><a class="dropdown__value" href="">Outlook Calendar</a></li>
            </ul>
        </div>
    </div>
    <button class="button--standard button--add-calendar" style="margin-right: 2rem">Button</button>

    <div style="margin-top: 2rem">Two candidates button: toggle two-candidate view on map comparison</div>
    <button class="button--standard button--two-candidates" style="margin-right: 2rem">Button</button>

    <div style="margin-top: 2rem">Back button</div>
    <button class="button--standard button--back" style="margin-right: 2rem">Button</button>

    <div style="margin-top: 2rem">Go button: to initiate the next step in a sequence</div>
    <button class="button--standard button--go" style="margin-right: 2rem">Go</button>

    <div style="margin-top: 2rem">Export button: for exporting files</div>
    <button class="button--standard button--export" style="margin-right: 2rem">Button</button>

    <div style="margin-top: 2rem">Table button</div>
    <button class="button--standard button--table" style="margin-right: 2rem">Button</button>
</div>