[improvement] Sku: use currentColor in the background style of price tag and sku item (#3946)

This commit is contained in:
codpoe 2019-07-24 15:17:04 +08:00 committed by neverland
parent 42afafac2b
commit 43e0bd0123
2 changed files with 32 additions and 5 deletions

View File

@ -79,15 +79,27 @@
}
&__price-tag {
position: relative;
display: inline-block;
margin-left: @padding-xs;
padding: 0 5px;
overflow: hidden;
color: @red;
font-size: @font-size-sm;
line-height: 16px;
vertical-align: middle;
background-color: @sku-price-tag-color;
border-radius: 8px;
&::before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: currentColor;
opacity: .1;
content: '';
}
}
&__close-icon {
@ -123,19 +135,31 @@
}
&__item {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 40px;
margin: 0 @padding-sm @padding-sm 0;
overflow: hidden;
color: @text-color;
font-size: 13px;
line-height: 16px;
vertical-align: middle;
background: @sku-item-background-color;
border-radius: 4px;
&::before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: @sku-item-background-color;
content: '';
}
&-img {
z-index: 1;
width: 24px;
height: 24px;
margin: 4px 0 4px 4px;
@ -144,12 +168,17 @@
}
&-name {
z-index: 1;
padding: @padding-xs;
}
&--active {
color: @red;
background: @sku-item-active-background-color;
&::before {
background: currentColor;
opacity: .1;
}
}
&--disabled {

View File

@ -653,8 +653,6 @@
@uploader-file-name-text-color: @gray-darker;
// Sku
@sku-price-tag-color: rgba(227, 20, 54, .1);
@sku-item-background-color: #f7f8fa;
@sku-item-active-background-color: rgba(227, 20, 54, .1);
@sku-icon-gray-color: #dcdde0;
@sku-upload-mask-color: rgba(50, 50, 51, .8);