[HomePanel] 스타일 수정

- 서브카테고리 부분 스타일 수정
This commit is contained in:
junghoon86.park
2024-02-14 15:40:41 +09:00
parent fae4d70be4
commit 0ccfaacf77
4 changed files with 16 additions and 14 deletions

View File

@@ -5,13 +5,17 @@ import SpotlightContainerDecorator
from '@enact/spotlight/SpotlightContainerDecorator'; from '@enact/spotlight/SpotlightContainerDecorator';
import ri from '@enact/ui/resolution'; import ri from '@enact/ui/resolution';
import {
scaleH,
scaleW,
} from '../../../../utils/helperMethods';
import CategoryNavItem from '../CategoryNav/CategoryNavItem/CategoryNavItem'; import CategoryNavItem from '../CategoryNav/CategoryNavItem/CategoryNavItem';
import css from './CategoryNav.module.less'; import css from './CategoryNav.module.less';
const LIST_ITEM_CONF = { const LIST_ITEM_CONF = {
ITEM_WIDTH: 210 * 2, ITEM_WIDTH: 210,
ITEM_HEIGHT: 236 * 2, ITEM_HEIGHT: 235,
SAPCING: 30 * 2, SAPCING: 30,
}; };
const Container = SpotlightContainerDecorator( const Container = SpotlightContainerDecorator(
@@ -50,12 +54,12 @@ export default function CategoryNav({
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"
spacing={ri.scale(LIST_ITEM_CONF.SAPCING)} spacing={scaleW(LIST_ITEM_CONF.SAPCING)}
/> />
)} )}
</Container> </Container>

View File

@@ -2,7 +2,7 @@
@import "../../../../style/utils.module.less"; @import "../../../../style/utils.module.less";
.container { .container {
.size(@w: 100%, @h:236px); .size(@w: 100%, @h:235px);
z-index: 10; z-index: 10;
background-color: @BG_COLOR_01; background-color: @BG_COLOR_01;
.font(@fontFamily: @baseFontBold, @fontSize: 28px); .font(@fontFamily: @baseFontBold, @fontSize: 28px);

View File

@@ -16,8 +16,6 @@ import {
import Spottable from '@enact/spotlight/Spottable'; import Spottable from '@enact/spotlight/Spottable';
import { getSubCategory } from '../../../actions/mainActions'; import { getSubCategory } from '../../../actions/mainActions';
import TBody from '../../../components/TBody/TBody';
import TGrid from '../../../components/TGrid/TGrid';
import { import {
scaleH, scaleH,
scaleW, scaleW,
@@ -44,7 +42,7 @@ const SubCategory = () => {
const categoryItemInfos = useSelector( const categoryItemInfos = useSelector(
(state) => state.main.subCategoryData.categoryItemInfos (state) => state.main.subCategoryData.categoryItemInfos
); );
const [currentLgCatCd, setCurrentLgCatCd] = useState(); const [currentLgCatCd, setCurrentLgCatCd] = useState(null);
const handleCategoryNav = (lgCatCd) => { const handleCategoryNav = (lgCatCd) => {
if (currentLgCatCd === lgCatCd) { if (currentLgCatCd === lgCatCd) {
@@ -58,6 +56,7 @@ const SubCategory = () => {
if (categoryInfos && !currentLgCatCd) { if (categoryInfos && !currentLgCatCd) {
const initialLgCatCd = categoryInfos[0].lgCatCd; const initialLgCatCd = categoryInfos[0].lgCatCd;
setCurrentLgCatCd(initialLgCatCd); setCurrentLgCatCd(initialLgCatCd);
console.log("###ttt", currentLgCatCd);
} }
}, [categoryInfos]); }, [categoryInfos]);
@@ -66,8 +65,7 @@ const SubCategory = () => {
dispatch( dispatch(
getSubCategory({ getSubCategory({
lgCatCd: currentLgCatCd, lgCatCd: currentLgCatCd,
patnrIdList: null, pageSize: "10",
pageSize: 10,
tabType: "CAT00102", tabType: "CAT00102",
filterType: "CAT00202", filterType: "CAT00202",
}) })
@@ -118,7 +116,7 @@ const SubCategory = () => {
minWidth: scaleW(324), minWidth: scaleW(324),
minHeight: scaleH(438), minHeight: scaleH(438),
}} }}
spacing={scaleW(0)} spacing={scaleW(4)}
noScrollByWheel noScrollByWheel
scrollMode="translate" scrollMode="translate"
className={css.grid} className={css.grid}

View File

@@ -10,7 +10,7 @@
} }
.grid { .grid {
height: 478px; height: 458px;
overflow: unset; overflow: unset;
> div { > div {
overflow: unset !important; overflow: unset !important;