[TItemCard] BestSeller TOP Text GUI 변경으로 제거완료
This commit is contained in:
@@ -30,7 +30,6 @@ const IMAGETYPES = {
|
|||||||
// @@pyh Todo, 추후 다국어 resource 추가
|
// @@pyh Todo, 추후 다국어 resource 추가
|
||||||
const STRING_CONF = {
|
const STRING_CONF = {
|
||||||
SOLD_OUT: $L("SOLD OUT"),
|
SOLD_OUT: $L("SOLD OUT"),
|
||||||
TOP: $L("TOP"),
|
|
||||||
};
|
};
|
||||||
|
|
||||||
export const removeDotAndColon = (string) => {
|
export const removeDotAndColon = (string) => {
|
||||||
@@ -206,7 +205,6 @@ export default memo(function TItemCard({
|
|||||||
|
|
||||||
{isBestSeller && rank && (
|
{isBestSeller && rank && (
|
||||||
<div className={css.bestSeller}>
|
<div className={css.bestSeller}>
|
||||||
{STRING_CONF.TOP}
|
|
||||||
<span>{rank}</span>
|
<span>{rank}</span>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -189,18 +189,25 @@
|
|||||||
|
|
||||||
// best seller
|
// best seller
|
||||||
.bestSeller {
|
.bestSeller {
|
||||||
.position(@position: absolute, @top: -1px, @left: 18px);
|
.size(@w:78px, @h:84px);
|
||||||
.flex(@direction: column, @justifyCenter: space-between);
|
display: flex;
|
||||||
padding: 15px 16px 21px;
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
.position(@position: absolute, @top: 0, @left: 18px);
|
||||||
background-color: @COLOR_GRAY07;
|
background-color: @COLOR_GRAY07;
|
||||||
.font(@fontFamily: @robotoFontBold, @fontSize: 24px);
|
|
||||||
color: @COLOR_WHITE;
|
color: @COLOR_WHITE;
|
||||||
border-bottom-left-radius: 79px;
|
border-bottom-left-radius: 79px;
|
||||||
border-bottom-right-radius: 79px;
|
border-bottom-right-radius: 79px;
|
||||||
|
|
||||||
> span {
|
> span {
|
||||||
.font(@fontFamily: @arialFontBold, @fontSize: 42px);
|
.font(@fontFamily: @arialFontBold, @fontSize: 42px);
|
||||||
font-size: 42px;
|
}
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
.size(@w:100%, @h:1px);
|
||||||
|
background-color: @COLOR_GRAY07;
|
||||||
|
.position(@position: absolute, @top: -1px, @left: 0);
|
||||||
|
content: "";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -210,9 +217,11 @@
|
|||||||
.focused(@boxShadow: 22px, @borderRadius: 12px);
|
.focused(@boxShadow: 22px, @borderRadius: 12px);
|
||||||
}
|
}
|
||||||
|
|
||||||
// best seller
|
.bestSeller {
|
||||||
> div:nth-child(3) {
|
|
||||||
background-color: @PRIMARY_COLOR_RED;
|
background-color: @PRIMARY_COLOR_RED;
|
||||||
|
&::before {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user