<template>
  <div class="field is-grouped">
    <div class="control is-expanded">
  <span :class="`icon-text fsb-${size||17} ${type || 'has-text-findata'}`">
    <b>{{ title }}</b>
    <span class="material-symbols-outlined">
chevron_right
</span>
  </span>
</div>
<div class="control" v-if="note">
  <span class="icon-text px-2 fs-14 has-text-grey-dark" v-for="v in note">
    <span class="mdi mdi-circle" :style="`color:${v.color}`"></span>
    <span class="ml-2">{{ v.text }}</span>
  </span>
</div>
</div>
</template>
<script>
export default {
  props: ['type', 'size', 'title', 'note', 'convert']
}
</script>