pleroma-fe/src/components/extra_buttons/extra_buttons.vue

58 lines
1.4 KiB
Vue
Raw Normal View History

<template>
2019-07-11 12:31:02 +00:00
<v-popover
v-if="enabled"
trigger="click"
2019-07-11 12:31:02 +00:00
class="extra-button-popover"
:container="false"
>
2019-07-11 12:31:02 +00:00
<div class="popper-wrapper" slot="popover">
2019-05-26 21:13:08 +00:00
<div class="dropdown-menu">
2019-07-05 07:17:44 +00:00
<button
v-if="!status.pinned && canPin"
class="dropdown-item dropdown-item-icon"
@click.prevent="pinStatus"
2019-07-11 12:31:02 +00:00
v-close-popover
2019-07-05 07:17:44 +00:00
>
<i class="icon-pin" /><span>{{ $t("status.pin") }}</span>
</button>
2019-07-05 07:17:44 +00:00
<button
v-if="status.pinned && canPin"
class="dropdown-item dropdown-item-icon"
@click.prevent="unpinStatus"
2019-07-11 12:31:02 +00:00
v-close-popover
2019-07-05 07:17:44 +00:00
>
<i class="icon-pin" /><span>{{ $t("status.unpin") }}</span>
</button>
2019-07-05 07:17:44 +00:00
<button
v-if="canDelete"
class="dropdown-item dropdown-item-icon"
@click.prevent="deleteStatus"
2019-07-11 12:31:02 +00:00
v-close-popover
2019-07-05 07:17:44 +00:00
>
<i class="icon-cancel" /><span>{{ $t("status.delete") }}</span>
</button>
</div>
</div>
2019-07-11 12:31:02 +00:00
<div class="button-icon">
<i class="icon-ellipsis" />
</div>
2019-07-11 12:31:02 +00:00
</v-popover>
</template>
<script src="./extra_buttons.js" ></script>
<style lang="scss">
@import '../../_variables.scss';
2019-05-26 21:13:08 +00:00
@import '../popper/popper.scss';
.icon-ellipsis {
cursor: pointer;
2019-07-11 12:31:02 +00:00
&:hover,
.extra-button-popover.open & {
2019-04-26 20:30:04 +00:00
color: $fallback--text;
color: var(--text, $fallback--text);
}
}
</style>