@cn-ui/core
Version:
The @cn-ui/core is a collection of UI components and utilities for building modern web applications with SolidJS.
46 lines (40 loc) • 939 B
CSS
.popover__content {
box-shadow:
0 6px 16px 0 rgba(0, 0, 0, 0.08),
0 3px 6px -4px rgba(0, 0, 0, 0.12),
0 9px 28px 8px rgba(0, 0, 0, 0.05);
}
.popover__arrow,
.popover__arrow::before {
width: 0.5rem;
height: 0.5rem;
position: absolute;
z-index: -1;
}
.popover__arrow::before {
content: "";
transform: rotate(45deg);
top: 0;
left: 0;
--at-apply: bg-design-thick;
}
.popover__arrow::before {
transition:
transform 0.2s ease-out,
visibility 0.2s ease-out;
visibility: visible;
transform: translateX(0px) rotate(45deg);
transform-origin: center;
}
[data-popper-placement^="top"] > .popover__arrow {
bottom: -0.2rem;
}
[data-popper-placement^="bottom"] > .popover__arrow {
top: -0.2rem;
}
[data-popper-placement^="left"] > .popover__arrow {
right: -0.2rem;
}
[data-popper-placement^="right"] > .popover__arrow {
left: -0.2rem;
}