mirror of
https://github.com/frappe/books.git
synced 2024-11-10 07:40:55 +00:00
fix(ui): remove popover space and arrow
This commit is contained in:
parent
6f0a5ab23d
commit
4fbcd9da5f
@ -13,7 +13,6 @@
|
||||
class="bg-white rounded border shadow-md popover-container relative z-10"
|
||||
v-show="isOpen"
|
||||
>
|
||||
<div v-if="!hideArrow" class="popover-arrow" ref="popover-arrow"></div>
|
||||
<slot name="content" :togglePopover="togglePopover"></slot>
|
||||
</div>
|
||||
</div>
|
||||
@ -27,10 +26,6 @@ export default {
|
||||
name: 'Popover',
|
||||
emits: ['open', 'close'],
|
||||
props: {
|
||||
hideArrow: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
showPopup: {
|
||||
default: null,
|
||||
},
|
||||
@ -84,22 +79,6 @@ export default {
|
||||
if (!this.popper) {
|
||||
this.popper = createPopper(this.$refs.reference, this.$refs.popover, {
|
||||
placement: this.placement,
|
||||
modifiers: !this.hideArrow
|
||||
? [
|
||||
{
|
||||
name: 'arrow',
|
||||
options: {
|
||||
element: this.$refs['popover-arrow'],
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'offset',
|
||||
options: {
|
||||
offset: [0, 10],
|
||||
},
|
||||
},
|
||||
]
|
||||
: [],
|
||||
});
|
||||
} else {
|
||||
this.popper.update();
|
||||
@ -139,46 +118,3 @@ export default {
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.popover-arrow,
|
||||
.popover-arrow::after {
|
||||
position: absolute;
|
||||
width: theme('spacing.4');
|
||||
height: theme('spacing.4');
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.popover-arrow::after {
|
||||
content: '';
|
||||
background: white;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.popover-container[data-popper-placement^='top'] > .popover-arrow {
|
||||
bottom: calc(theme('spacing.2') * -1);
|
||||
}
|
||||
|
||||
.popover-container[data-popper-placement^='top'] > .popover-arrow::after {
|
||||
border-bottom: 1px solid theme('borderColor.gray.400');
|
||||
border-right: 1px solid theme('borderColor.gray.400');
|
||||
border-bottom-right-radius: 6px;
|
||||
}
|
||||
|
||||
.popover-container[data-popper-placement^='bottom'] > .popover-arrow {
|
||||
top: calc(theme('spacing.2') * -1);
|
||||
}
|
||||
|
||||
.popover-container[data-popper-placement^='bottom'] > .popover-arrow::after {
|
||||
border-top: 1px solid theme('borderColor.gray.400');
|
||||
border-left: 1px solid theme('borderColor.gray.400');
|
||||
border-top-left-radius: 6px;
|
||||
}
|
||||
|
||||
.popover-container[data-popper-placement^='left'] > .popover-arrow {
|
||||
right: calc(theme('spacing.2') * -1);
|
||||
}
|
||||
|
||||
.popover-container[data-popper-placement^='right'] > .popover-arrow {
|
||||
left: calc(theme('spacing.2') * -1);
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user