use b-dropdown-item-button and clean up boards dropdown

This commit is contained in:
Gamebrary 2021-05-24 20:40:59 -07:00
parent 4d60b315c3
commit a697df351b

View file

@ -10,31 +10,37 @@
<i class="fas fa-caret-down fa-fw" aria-hidden />
</template>
<div class="d-flex align-items-center justify-content-between">
<span class="ml-2">
{{ board.name }}
</span>
<b-button
variant="secondary"
<b-dropdown-item-button
size="sm"
v-b-modal:edit-board
>
<i class="fas fa-pencil-alt fa-fw" aria-hidden />
</b-button>
</div>
Edit board
</b-dropdown-item-button>
<b-dropdown-divider />
<b-dropdown-item-button
size="sm"
v-b-modal:create-board
>
<i class="fas fa-plus fa-fw" aria-hidden></i>
Create new board
</b-dropdown-item-button>
<!-- TODO: create array map with url already fetched -->
<!-- TODO: filter out current board -->
<template v-if="filteredBoards.length">
<b-dropdown-divider />
<span class="m-2">Other boards</span>
<span class="m-2 text-muted">Other boards:</span>
<b-dropdown-item
v-for="{ id, name, backgroundColor, backgroundUrl } in boards"
<b-dropdown-item-button
v-for="{ id, name, backgroundColor, backgroundUrl } in filteredBoards"
:key="id"
:active="board.name === name"
@click.native="viewBoard(id)"
@click="viewBoard(id)"
>
<b-avatar
rounded
@ -48,7 +54,8 @@
/>
{{ name }}
</b-dropdown-item>
</b-dropdown-item-button>
</template>
</b-dropdown>
</portal>
</template>