From 429b6fbb02bbbdfb6cd838e4318a7d1b3f4189d5 Mon Sep 17 00:00:00 2001 From: jangheon Pyo Date: Wed, 20 Mar 2024 10:23:38 +0900 Subject: [PATCH] =?UTF-8?q?[TabLayout]=20Logo=20=EC=B6=9C=EB=A0=A5=20?= =?UTF-8?q?=EB=B0=A9=EC=8B=9D=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Detail Notes : 1. 간헐적으로 LNB 열릴때 로고가 늘어짐 현상이 일어나는 것 확인함
- Logo를 Icon과 full 로고 2개 사용하던것을 full로고 하나로 통합 --- .../icons/ic-lnb-shoptime-symbol@3x.png | Bin 7894 -> 0 bytes .../src/components/TabLayout/TabLayout.jsx | 64 ++++++++---------- .../TabLayout/TabLayout.module.less | 11 ++- 3 files changed, 32 insertions(+), 43 deletions(-) delete mode 100644 com.twin.app.shoptime/assets/images/icons/ic-lnb-shoptime-symbol@3x.png diff --git a/com.twin.app.shoptime/assets/images/icons/ic-lnb-shoptime-symbol@3x.png b/com.twin.app.shoptime/assets/images/icons/ic-lnb-shoptime-symbol@3x.png deleted file mode 100644 index 3d2c797767ddd73024d9b7a25509e9c47c6d488d..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 7894 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 Ar2qf` diff --git a/com.twin.app.shoptime/src/components/TabLayout/TabLayout.jsx b/com.twin.app.shoptime/src/components/TabLayout/TabLayout.jsx index bf67489b..9d9d682c 100644 --- a/com.twin.app.shoptime/src/components/TabLayout/TabLayout.jsx +++ b/com.twin.app.shoptime/src/components/TabLayout/TabLayout.jsx @@ -4,44 +4,37 @@ import React, { useMemo, useRef, useState, -} from 'react'; +} from "react"; -import classNames from 'classnames'; -import { - useDispatch, - useSelector, -} from 'react-redux'; +import classNames from "classnames"; +import { useDispatch, useSelector } from "react-redux"; //아이콘 -import { Job } from '@enact/core/util'; +import { Job } from "@enact/core/util"; //enact -import Skinnable from '@enact/sandstone/Skinnable'; -import Spotlight from '@enact/spotlight'; -import SpotlightContainerDecorator - from '@enact/spotlight/SpotlightContainerDecorator'; -import { Cancelable } from '@enact/ui/Cancelable'; +import Skinnable from "@enact/sandstone/Skinnable"; +import Spotlight from "@enact/spotlight"; +import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator"; +import { Cancelable } from "@enact/ui/Cancelable"; //이미지 -import shoptimeFullIcon - from '../../../assets/images/icons/ic-lnb-logo-shoptime@3x.png'; -import shopTimeIcon - from '../../../assets/images/icons/ic-lnb-shoptime-symbol@3x.png'; -import { gnbOpened } from '../../actions/commonActions'; -import { resetPanels } from '../../actions/panelActions'; -import { panel_names } from '../../utils/Config'; -import { SpotlightIds } from '../../utils/SpotlightIds'; -import TScroller from '../TScroller/TScroller'; -import CategoryIcon from './iconComponents/CategoryIcon'; -import FeaturedBrandIcon from './iconComponents/FeaturedBrandIcon'; -import HomeIcon from './iconComponents/HomeIcon'; -import HotPicksIcon from './iconComponents/HotPicksIcon'; -import MyPageIcon from './iconComponents/MyPageIcon'; -import OnSaleIcon from './iconComponents/OnSaleIcon'; -import SearchIcon from './iconComponents/SearchIcon'; -import TrendingNowIcon from './iconComponents/TrendingNowIcon'; -import TabItem from './TabItem'; -import TabItemSub from './TabItemSub'; -import css from './TabLayout.module.less'; +import shoptimeFullIcon from "../../../assets/images/icons/ic-lnb-logo-shoptime@3x.png"; +import { gnbOpened } from "../../actions/commonActions"; +import { resetPanels } from "../../actions/panelActions"; +import { panel_names } from "../../utils/Config"; +import { SpotlightIds } from "../../utils/SpotlightIds"; +import TScroller from "../TScroller/TScroller"; +import CategoryIcon from "./iconComponents/CategoryIcon"; +import FeaturedBrandIcon from "./iconComponents/FeaturedBrandIcon"; +import HomeIcon from "./iconComponents/HomeIcon"; +import HotPicksIcon from "./iconComponents/HotPicksIcon"; +import MyPageIcon from "./iconComponents/MyPageIcon"; +import OnSaleIcon from "./iconComponents/OnSaleIcon"; +import SearchIcon from "./iconComponents/SearchIcon"; +import TrendingNowIcon from "./iconComponents/TrendingNowIcon"; +import TabItem from "./TabItem"; +import TabItemSub from "./TabItemSub"; +import css from "./TabLayout.module.less"; const Container = SpotlightContainerDecorator( { enterTo: "default-element", preserveId: true }, @@ -533,7 +526,7 @@ export default function TabLayout({ topPanelName, onTabActivated }) { onMouseLeave={onTabBlur(COLLABSED_MAIN)} >

- +

{tabs.map((item, index) => (

- +

{tabActivated && diff --git a/com.twin.app.shoptime/src/components/TabLayout/TabLayout.module.less b/com.twin.app.shoptime/src/components/TabLayout/TabLayout.module.less index 44d84688..052fdaa4 100644 --- a/com.twin.app.shoptime/src/components/TabLayout/TabLayout.module.less +++ b/com.twin.app.shoptime/src/components/TabLayout/TabLayout.module.less @@ -37,22 +37,21 @@ z-index: 1; > .logo { + width: 54px; + height: 54px; + overflow: hidden; margin: 60px 24px 84px 42px; > img { - width: 54px; + width: 234px; height: 54px; } - // margin: -40px 24px 84px 42px; } &.expanded { width: 402px; > .logo { - > img { - width: 234px; - height: 54px; - } + width: 234px; } }