optrader/shoptime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FeaturedBrandsPanel] virtualGridList 단위 및 css 수정

Browse Source 
Detail Notes :

1. LiveProductList and QuickMenu, ri.scale → scaleW, scaleH (from helpMethods)
2. css 수정, color 변수 적용 및 BG 변경
This commit is contained in:
younghoon100.park
2024-02-08 13:13:41 +09:00
parent e48365aded
commit a87e355b2b
4 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
com.twin.app.shoptime/src/views/FeaturedBrandsPanel/LiveChannels/LiveProductList/LiveProductList.jsx
View File

@@ -1,15 +1,15 @@
import React, { useCallback } from "react"; import React, { useCallback } from "react";
import { VirtualGridList } from "@enact/sandstone/VirtualList"; import { VirtualGridList } from "@enact/sandstone/VirtualList";
import ri from "@enact/ui/resolution";
import TItemCard from "../../../../components/TItemCard/TItemCard"; import TItemCard from "../../../../components/TItemCard/TItemCard";
import { scaleH, scaleW } from "../../../../utils/helperMethods";
import css from "./LiveProductList.module.less"; import css from "./LiveProductList.module.less";
const LIST_ITEM_CONF = { const LIST_ITEM_CONF = {
ITEM_WIDTH: 660 * 2, ITEM_WIDTH: 660,
ITEM_HEIGHT: 236 * 2, ITEM_HEIGHT: 236,
SAPCING: 12 * 2, SAPCING: 12,
}; };
export default function LiveProductList({ brandProductInfo, onCardClick }) { export default function LiveProductList({ brandProductInfo, onCardClick }) {
@@ -50,12 +50,12 @@ export default function LiveProductList({ brandProductInfo, onCardClick }) {
direction="vertical" direction="vertical"
itemRenderer={renderItem} itemRenderer={renderItem}
itemSize={{ itemSize={{
minWidth: ri.scale(LIST_ITEM_CONF.ITEM_WIDTH), minWidth: scaleW(LIST_ITEM_CONF.ITEM_WIDTH),
minHeight: ri.scale(LIST_ITEM_CONF.ITEM_HEIGHT), minHeight: scaleH(LIST_ITEM_CONF.ITEM_HEIGHT),
}} }}
noScrollByWheel noScrollByWheel
scrollMode="translate" scrollMode="translate"
spacing={ri.scale(LIST_ITEM_CONF.SAPCING)} spacing={scaleW(LIST_ITEM_CONF.SAPCING)}
verticalScrollbar="hidden" verticalScrollbar="hidden"
/> />
)} )}

2
com.twin.app.shoptime/src/views/FeaturedBrandsPanel/LiveChannels/LiveProductList/LiveProductList.module.less
View File

@@ -8,7 +8,7 @@
&::after { &::after {
.position(@position: absolute, @bottom: 0, @left: 0); .position(@position: absolute, @bottom: 0, @left: 0);
.size(@w: 100%, @h: 50px); .size(@w: 100%, @h: 50px);
background-image: linear-gradient(to bottom, transparent 65%, @COLOR_WHITE); background-image: linear-gradient(to bottom, transparent 65%, @BG_COLOR_01);
content: ""; content: "";
} }

10
com.twin.app.shoptime/src/views/FeaturedBrandsPanel/QuickMenu/QuickMenu.jsx
View File

@@ -2,14 +2,14 @@ import React, { useCallback, useEffect } from "react";
import { VirtualGridList } from "@enact/sandstone/VirtualList"; import { VirtualGridList } from "@enact/sandstone/VirtualList";
import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator"; import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
import ri from "@enact/ui/resolution";
import { scaleH, scaleW } from "../../../utils/helperMethods";
import QuickMenuItem from "../QuickMenu/QuickMenuItem/QuickMenuItem"; import QuickMenuItem from "../QuickMenu/QuickMenuItem/QuickMenuItem";
import css from "./QuickMenu.module.less"; import css from "./QuickMenu.module.less";
const LIST_ITEM_CONF = { const LIST_ITEM_CONF = {
ITEM_WIDTH: 138 * 2, ITEM_WIDTH: 138,
ITEM_HEIGHT: 138 * 2, ITEM_HEIGHT: 138,
}; };
const Container = SpotlightContainerDecorator( const Container = SpotlightContainerDecorator(
@@ -48,8 +48,8 @@ export default function QuickMenu({
horizontalScrollbar="hidden" horizontalScrollbar="hidden"
itemRenderer={renderItem} itemRenderer={renderItem}
itemSize={{ itemSize={{
minWidth: ri.scale(LIST_ITEM_CONF.ITEM_WIDTH), minWidth: scaleW(LIST_ITEM_CONF.ITEM_WIDTH),
minHeight: ri.scale(LIST_ITEM_CONF.ITEM_HEIGHT), minHeight: scaleH(LIST_ITEM_CONF.ITEM_HEIGHT),
}} }}
noScrollByWheel noScrollByWheel
scrollMode="translate" scrollMode="translate"

2
com.twin.app.shoptime/src/views/FeaturedBrandsPanel/QuickMenu/QuickMenu.module.less
View File

@@ -4,7 +4,7 @@
.container { .container {
.size(@w: 100%, @h: 180px); .size(@w: 100%, @h: 180px);
padding: 18px 60px; padding: 18px 60px;
background-color: #e7e7e7; background-color: @BG_COLOR_01;
.virtualGridList { .virtualGridList {
overflow: unset; overflow: unset;