解决 select zindex 问题

This commit is contained in:
liaoxuezhi 2019-11-14 20:27:49 +08:00
parent a9978def00
commit 15c65cef4c
1 changed files with 268 additions and 264 deletions

View File

@ -8,7 +8,10 @@
background: $Form-select-bg;
border-radius: $Form-select-borderRadius;
height: $Form-selectOption-height;
$paddingY: ($Form-selectOption-height - $Form-input-lineHeight * $Form-input-fontSize - $Form-select-borderWidth * 2)/2;
$paddingY: (
$Form-selectOption-height - $Form-input-lineHeight * $Form-input-fontSize -
$Form-select-borderWidth * 2
)/2;
padding: $paddingY 0 $paddingY $Form-select-paddingX;
cursor: pointer;
color: $Form-select-color;
@ -33,7 +36,6 @@
position: relative;
flex-grow: 1;
line-height: 1;
}
&-placeholder {
@ -42,8 +44,6 @@
user-select: none;
}
&-value {
line-height: $Form-input-lineHeight * $Form-input-fontSize;
white-space: nowrap;
@ -52,7 +52,6 @@
text-overflow: ellipsis;
}
&--multi {
height: auto;
min-height: $Form-selectOption-height;
@ -167,7 +166,9 @@
&-option {
cursor: pointer;
min-width: px2rem(120px);
padding: ($Form-select-menu-height - $Form-input-lineHeight * $Form-input-fontSize)/2 $Form-select-paddingX;
padding: (
$Form-select-menu-height - $Form-input-lineHeight * $Form-input-fontSize
)/2 $Form-select-paddingX;
&.is-active {
color: $Form-select-menu-onActive-color;
@ -208,7 +209,9 @@
line-height: $Form-input-lineHeight;
font-size: $Form-select-input-fontSize;
user-select: none;
padding: ($Form-select-menu-height - $Form-input-lineHeight * $Form-input-fontSize)/2 $Form-select-paddingX;
padding: (
$Form-select-menu-height - $Form-input-lineHeight * $Form-input-fontSize
)/2 $Form-select-paddingX;
}
&-option-hl {
@ -218,7 +221,9 @@
&-addBtn {
display: block;
cursor: pointer;
padding: ($Form-select-menu-height - $Form-input-lineHeight * $Form-input-fontSize)/2 $Form-select-paddingX;
padding: (
$Form-select-menu-height - $Form-input-lineHeight * $Form-input-fontSize
)/2 $Form-select-paddingX;
&:hover {
text-decoration: none;
@ -275,7 +280,7 @@
border-top-left-radius: 0;
border-top-right-radius: 0;
min-width: px2rem(100px);
z-index: 2;
z-index: 10;
&.#{$ns}PopOver--leftTopLeftBottom {
margin-top: -($Form-select-popoverGap - $Form-select-outer-borderWidth);
@ -288,7 +293,6 @@
// 需要能撑开
@include media-breakpoint-up(sm) {
.#{$ns}Form-control--sizeXs > .#{$ns}Select,
.#{$ns}Form-control--sizeSm > .#{$ns}Select,
.#{$ns}Form-control--sizeMd > .#{$ns}Select,