@opensig/opendesign
Version:
58 lines (51 loc) • 1.53 kB
CSS
.o-popover {
--popup-bg-color: var(--o-color-fill2);
--popup-shadow: var(--o-shadow-1);
--popup-radius: var(--o-radius_control-s);
--popup-bd: 1px solid var(--o-color-control4);
--popup-padding: 9px 16px;
--popover-text-color: var(--o-color-info1);
--popover-text-size: var(--o-font_size-tip1);
--popover-text-height: var(--o-line_height-tip1);
}
.o-popover {
font-size: var(--popover-text-size);
line-height: var(--popover-text-height);
color: var(--popover-text-color);
}
.o-popover-anchor {
border: var(--popup-bd);
border-bottom: none;
border-right: none;
border-top-left-radius: 2px;
width: 8px;
height: 8px;
background-color: var(--popup-bg-color);
}
.o-popup-pos-left .o-popover-anchor,
.o-popup-pos-lb .o-popover-anchor,
.o-popup-pos-lt .o-popover-anchor {
transform: translate(50%, -50%) rotate(135deg);
}
.o-popup-pos-top .o-popover-anchor,
.o-popup-pos-tl .o-popover-anchor,
.o-popup-pos-tr .o-popover-anchor {
transform: translate(-50%, 50%) rotate(225deg);
}
.o-popup-pos-right .o-popover-anchor,
.o-popup-pos-rt .o-popover-anchor,
.o-popup-pos-rb .o-popover-anchor {
transform: translate(-50%, -50%) rotate(-45deg);
}
.o-popup-pos-bottom .o-popover-anchor,
.o-popup-pos-bl .o-popover-anchor,
.o-popup-pos-br .o-popover-anchor {
transform: translate(-50%, -50%) rotate(45deg);
}
@media (max-width: 1680px) {
.o-popover {
--popover-text-size: var(--o-font_size-tip2);
--popover-text-height: var(--o-line_height-tip2);
--popup-padding: 7px 12px;
}
}