This commit is contained in:
2026-01-05 12:47:14 +08:00
commit 1fc846fae3
1614 changed files with 162035 additions and 0 deletions

View File

@@ -0,0 +1,253 @@
@import "../popup/index";
.nut-popover {
position: absolute;
display: inline-block;
word-break: normal;
.nut-popover-arrow {
position: absolute;
width: 0;
height: 0;
border: 8px solid transparent;
&-top {
bottom: 0;
margin-bottom: -8px;
border-top-color: $popover-white-background-color;
border-bottom-width: 0;
}
&-bottom {
top: 0;
margin-top: -8px;
border-top-width: 0;
border-bottom-color: $popover-white-background-color;
&.nut-popover-arrow--bottom {
left: 50%;
transform: translateX(-50%);
}
&.nut-popover-arrow--bottom-start {
left: 16px;
transform: translateX(0%);
}
&.nut-popover-arrow--bottom-end {
right: 16px;
transform: translateX(0%);
}
}
&-left {
right: 0;
margin-right: -8px;
border-right-width: 0;
border-left-color: $popover-white-background-color;
&.nut-popover-arrow--left {
top: 50%;
transform: translateY(-50%);
}
&.nut-popover-arrow--left-start {
top: 16px;
transform: translateY(0%);
}
&.nut-popover-arrow--left-end {
bottom: 16px;
transform: translateY(0%);
}
}
&-right {
left: 0;
margin-left: -8px;
border-right-color: $popover-white-background-color;
border-left-width: 0;
&.nut-popover-arrow--right {
top: 50%;
transform: translateY(-50%);
}
&.nut-popover-arrow--right-start {
top: 16px;
transform: translateY(0%);
}
&.nut-popover-arrow--right-end {
bottom: 16px;
transform: translateY(0%);
}
}
}
.nut-popover-content {
position: absolute;
z-index: 9999;
max-height: initial;
overflow-y: initial;
font-size: 14px;
font-weight: normal;
color: #333;
background: #fff;
border-radius: 5px;
box-shadow: 0 2px 12px #3232331f;
opacity: 1;
transition: opacity 0.15s,
transform 0.15s;
&-group {
display: block;
width: 100%;
height: 100%;
}
.nut-popover-menu-item {
display: flex;
align-items: center;
padding: 8px;
border-bottom: 1px solid $popover-border-bottom-color;
&:first-child {
margin-top: 15px;
}
&:last-child {
margin-bottom: 2px;
border-bottom: none;
}
.nut-popover-item-img {
margin-right: 3px;
vertical-align: top;
}
.nut-popover-menu-item-name {
width: 100%;
text-align: center;
word-break: keep-all;
}
&.nut-popover-menu-disabled {
color: $popover-disable-color;
cursor: not-allowed;
}
}
&--top {
.nut-popover-arrow--top {
left: 50%;
transform: translateX(-50%);
}
}
&--top-end {
right: 0;
.nut-popover-arrow--top-end {
right: 16px;
transform: translateX(0%);
}
}
&--top-start {
left: 0;
.nut-popover-arrow--top-start {
left: 16px;
transform: translateX(0%);
}
}
&--bottom-end {
right: 0;
}
&--left-end {
bottom: 0;
}
&--left-start {
top: 0;
}
&--right-end {
bottom: 0;
}
&--right-start {
top: 0;
}
}
}
.nut-popover--dark {
.nut-popover-content {
color: $popover-white-background-color;
background: $popover-dark-background-color;
&--bottom,
&--bottom-start,
&--bottom-end {
.nut-popover-arrow {
border-bottom-color: $popover-dark-background-color;
}
}
&--top,
&--top-start,
&--top-end {
.nut-popover-arrow {
border-top-color: $popover-dark-background-color;
}
}
&--left,
&--left-start,
&--left-end {
.nut-popover-arrow {
border-left-color: $popover-dark-background-color;
}
}
&--right,
&--right-start,
&--right-end {
.nut-popover-arrow {
border-right-color: $popover-dark-background-color;
}
}
}
}
.nut-popover-enter-from,
.nut-popover-leave-active {
opacity: 0;
transform: scale(0.8);
}
.nut-popover-enter-active {
transition-timing-function: ease-out;
}
.nut-popover-leave-active {
transition-timing-function: ease-in;
}
.nut-popover-content-bg {
position: fixed;
top: 0;
left: 0;
z-index: 300;
width: 100%;
height: 100%;
background: transparent;
}
.nut-popover-wrapper {
display: inline-block;
}