owncast/web/components/ui/Popover/Popover.module.scss
janWilejan f112f9813d
NotifyReminderPopup uses a custom Popover (#3194)
* NotifyReminderPopup uses a custom Popover

* fix Popover resizing in storybook

* Prettified Code!

---------

Co-authored-by: janWilejan <>
Co-authored-by: janWilejan <janWilejan@users.noreply.github.com>
2023-07-21 15:58:14 -07:00

37 lines
581 B
SCSS

.anchor {
position: relative;
left: 50%;
width: 0;
height: 0;
}
.popover {
background-color: var(--theme-color-components-primary-button-background);
position: absolute;
bottom: 10px;
right: -20px;
border-radius: 5px;
width: max-content;
}
.popover>.title {
padding: 10px;
padding-bottom: 0;
}
.popover>.content {
padding: 10px;
padding-top: 0;
}
// Popover tail
.popover::after {
content: '';
border: 10px solid transparent;
border-top-color: var(--theme-color-components-primary-button-background);
right: 10px;
position: absolute;
}