amis/scss/components/form/_sub-form.scss
2019-12-06 09:58:08 +08:00

82 lines
1.9 KiB
SCSS

.#{$ns}SubForm {
&-values {
display: inline-block;
margin-top: -$gap-xs;
padding: (
$Form-input-height - $Form-input-lineHeight * $Form-input-fontSize -
px2rem(2px)
)/2 0;
}
&-value {
cursor: pointer;
user-select: none;
line-height: $Form-input-lineHeight * $Form-input-fontSize - px2rem(2px);
display: inline-block;
font-size: $Form-selectValue-fontSize;
color: $Form-selectValue-color;
background: $Form-selectValue-bg;
border: px2rem(1px) solid $Form-selectValue-borderColor;
border-radius: 2px;
margin-right: $gap-xs;
margin-top: $gap-xs;
&:hover {
background-color: darken($Form-selectValue-bg, 5%);
}
&.is-disabled {
pointer-events: none;
opacity: $Button-onDisabled-opacity;
}
}
&-valueIcon {
cursor: pointer;
border-right: px2rem(1px) solid $Form-selectValue-borderColor;
padding: 1px 5px;
&:hover {
background-color: darken($Form-selectValue-bg, 5%);
}
}
&-valueLabel {
padding: 0 $gap-xs;
}
&-addBtn {
font-size: $SubForm--addBtn-fontSize;
@include button-size(
$SubForm--addBtn-paddingY,
$SubForm--addBtn-paddingX,
$SubForm--addBtn-fontSize,
$SubForm--addBtn-lineHeight,
$SubForm--addBtn-borderRadius,
$SubForm--addBtn-height
);
@include button-variant(
$SubForm--addBtn-bg,
$SubForm--addBtn-border,
$SubForm--addBtn-color,
$SubForm--addBtn-onHover-bg,
$SubForm--addBtn-onHover-border,
$SubForm--addBtn-onHover-color,
$SubForm--addBtn-onActive-bg,
$SubForm--addBtn-onActive-border,
$SubForm--addBtn-onActive-color
);
&.is-disabled {
pointer-events: none;
opacity: $Button-onDisabled-opacity;
}
}
}
.#{$ns}SubFormControl {
padding-top: $Form-input-height - $SubForm--addBtn-height;
}