bulma inputs with addon

by jorgeluis

HTML

<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
<script src="https://unpkg.com/buefy/dist/buefy.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/buefy/dist/buefy.min.css">
<div id="app" class="container">
    
    <section>
        <b-field>
            <b-input placeholder="Search..."
                type="search"
                icon="magnify">
            </b-input>
            <p class="control">
                <button class="button is-primary">Search</button>
            </p>
        </b-field>

        <b-field>
            <b-input placeholder="This is expanded" expanded></b-input>
            <p class="control">
                <span class="button is-static">@gmail.com</span>
            </p>
        </b-field>
    </section>

</div>

JavaScript

const app = new Vue()

app.$mount('#app')