65 lines
1.7 KiB
SCSS
65 lines
1.7 KiB
SCSS
@use 'sass:math';
|
|
|
|
.p-overlaypanel {
|
|
background: $overlayContentBg;
|
|
color: $panelContentTextColor;
|
|
border: $overlayContentBorder;
|
|
border-radius: $borderRadius;
|
|
box-shadow: $overlayContainerShadow;
|
|
|
|
.p-overlaypanel-content {
|
|
padding: $panelContentPadding;
|
|
}
|
|
|
|
.p-overlaypanel-close {
|
|
background: $buttonBg;
|
|
color: $buttonTextColor;
|
|
width: $actionIconWidth;
|
|
height: $actionIconHeight;
|
|
transition: $actionIconTransition;
|
|
border-radius: $actionIconBorderRadius;
|
|
position: absolute;
|
|
top: math.div(-1 * $actionIconWidth, 2);
|
|
right: math.div(-1 * $actionIconWidth, 2);
|
|
|
|
&:enabled:hover {
|
|
background: $buttonHoverBg;
|
|
color: $buttonTextHoverColor;
|
|
}
|
|
}
|
|
|
|
&:after {
|
|
border: solid transparent;
|
|
border-color: rgba($overlayContentBg, 0);
|
|
border-bottom-color: $overlayContentBg;
|
|
}
|
|
|
|
&:before {
|
|
border: solid transparent;
|
|
|
|
@if (nth($overlayContentBorder, 2) == 'none') {
|
|
border-color: rgba($overlayContentBg, 0);
|
|
border-bottom-color: scale-color($overlayContentBg, $lightness: -5%);
|
|
}
|
|
@else {
|
|
border-color: rgba(nth($overlayContentBorder, 3), 0);
|
|
border-bottom-color: scale-color(nth($overlayContentBorder, 3), $lightness: -5%);
|
|
}
|
|
}
|
|
|
|
&.p-overlaypanel-flipped {
|
|
&:after {
|
|
border-top-color: $overlayContentBg;
|
|
}
|
|
|
|
&:before {
|
|
@if (nth($overlayContentBorder, 2) == 'none') {
|
|
border-top-color: $overlayContentBg;
|
|
}
|
|
@else {
|
|
border-top-color: nth($overlayContentBorder, 3);
|
|
}
|
|
}
|
|
}
|
|
}
|