fengyuanchen/vue-feather

Icon alignment not equivalent to the base feather-icons

Closed this issue · 1 comments

This is with the base feather-icons package

<div v-if="currentEditingSection == section.id" class="w-50 mx-auto">
  <div class="rounded p-1" style="background-color: #F44174;" @click="editSection(section.id, index)">
    <i class="feather-12 text-white" data-feather="check"></i>
  </div>
</div>

This is what it looks like -

image

This is the vue-feather package

<div v-if="currentEditingSection == section.id" class="w-50 mx-auto">
  <div class="rounded p-1" style="background-color: #F44174;" @click="editSection(section.id, index)">
    <vue-feather type="check" class="text-white" size="12"></vue-feather>
  </div>
</div>

This is what it looks like -

image

Alignments do not match

Just align it with your custom CSS styles.