i2p-styleguide/_includes/components/buttons.html

<div id="buttons" class="mb-4">
    <h2>Buttons</h2>
    <!--p class="text-muted">Some Description about buttons.</p-->
</div>
<div class="row bg-light p-5">
    <div class="col-xs-12 col-sm-6 col-md-6 p-1">
        <p class="text-black small text-muted m-0 pb-2">Primary</p>
        <button type="button" class="btn btn-lg btn-primary btn-pill mr-2">Primary</button>
        <p class="text-black small text-muted m-0 pt-2 pb-2">Ghost</p>
        <button type="button" class="btn btn-lg btn-outline-primary btn-pill mr-2">How to Contribute</button>
        <p class="text-black small text-muted m-0 pt-2">Link</p>
        <button type="button" class="btn btn-lg btn-link mr-2">Learn more</button>
    </div>
    <div class="col-xs-12 col-sm-6 col-md-6 p-1">
        <p class="text-black small text-muted m-0 pt-2 pb-2">Medium</p>
        <button type="button" class="btn btn-medium btn-pill mr-2">Medium</button>
        <button type="button" class="btn btn-outline-medium btn-pill mr-2">Ghost</button>
        <button type="button" class="btn btn-link mr-2">Link</button>
        <p class="text-black small text-muted m-0 pt-2 pb-2">Small</p>
        <button type="button" class="btn btn-sm btn-small btn-pill mr-2">Small</button>
        <button type="button" class="btn btn-sm btn-outline-small btn-pill mr-2">Ghost</button>
        <button type="button" class="btn btn-sm btn-link mr-2">Link</button>
        <p class="text-black small text-muted m-0 pt-5">Scroller</p>
        <button type="button" class="btn btn-scroller mr-2 mt-2">Back to Top <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 149 256.1" class="faq__chevron-up"><path d="M145.4,136.5l-117.8,116c-4.7,4.7-12.3,4.7-17,0l-7.1-7.1c-4.7-4.7-4.7-12.3,0-17L105.8,128L3.6,27.6c-4.7-4.7-4.7-12.3,0-17l7.1-7.1c4.7-4.7,12.3-4.7,17,0l117.8,116C150.1,124.2,150.1,131.8,145.4,136.5L145.4,136.5z"></path></svg></button>
    </div>
</div>