Bulma (0.7.5) button with html content

by jorgeluis

HTML

<link rel="stylesheet" href="https://unpkg.com/buefy/dist/buefy.min.css">
<script src="https://unpkg.com/vue/dist/vue.min.js"></script>
<script src="https://unpkg.com/buefy/dist/buefy.min.js"></script>
<div id="app" class="container">

    <button type="button" class="collapse-trigger">
      <div>
        <h3 class="collapse-title has-text-link">
          Button title
        </h3>
        <div class="churro has-background-info"></div>
      </div>
    </button>
    
</div>

SCSS

.collapse-trigger {
  width: 100%;
  border: 0;
  background-color: transparent;
  padding-left: 0;
  text-align: left;
}

.collapse-title {
  font-size: 1.1rem;
  margin-bottom: 0.5rem;
  font-weight: 600;
}

.churro {
  border-radius: 3px;
  height: 6px;
  width: 100%;
  margin: 0.5rem 0;
}

JavaScript

const app = new Vue()
app.$mount('#app')