mirror of
https://github.com/amir20/dozzle.git
synced 2025-12-21 21:33:18 +01:00
e1635a36c8
Also fix issue where the last line's dropdown is cut off and creates overflow on the events container. Fixed this by (1) moving the last dropdown up a bit and (2) setting the event container's overflow property as `hidden`
44 lines
794 B
Vue
44 lines
794 B
Vue
<template>
|
|
<div class="dropdown is-hoverable">
|
|
<div class="dropdown-trigger">
|
|
<button class="button" aria-haspopup="true" aria-controls="dropdown-menu">
|
|
<span class="icon">
|
|
<mdi-dots-vertical />
|
|
</span>
|
|
</button>
|
|
</div>
|
|
<div class="dropdown-menu" id="dropdown-menu" role="menu">
|
|
<div class="dropdown-content">
|
|
<slot></slot>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup></script>
|
|
|
|
<style lang="scss" scoped>
|
|
.minimal .button {
|
|
background-color: rgba(0, 0, 0, 0);
|
|
border: none;
|
|
padding: 0.1em;
|
|
height: 100%;
|
|
|
|
& > .icon {
|
|
height: 100%;
|
|
& > svg {
|
|
height: 0.85em;
|
|
}
|
|
}
|
|
}
|
|
.is-top {
|
|
& .dropdown-menu {
|
|
top: 0;
|
|
}
|
|
|
|
&.is-last .dropdown-menu {
|
|
top: -30px;
|
|
}
|
|
}
|
|
</style>
|