[TabLayout] Logo 출력 방식 변경

Detail Notes :

1. 간헐적으로 LNB 열릴때 로고가 늘어짐 현상이 일어나는 것 확인함
- Logo를 Icon과 full 로고 2개 사용하던것을 full로고 하나로 통합

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)}
       >
         <h1 className={css.logo}>
-          <img src={shopTimeIcon} alt="" />
+          <img src={shoptimeFullIcon} alt="" />
         </h1>
         {tabs.map((item, index) => (
           <TabItem
@@ -575,10 +568,7 @@ export default function TabLayout({ topPanelName, onTabActivated }) {
             onMouseLeave={onTabBlur(ACTIVATED_MAIN)}
           >
             <h1 className={css.logo}>
-              <img
-                src={mainExpanded ? shoptimeFullIcon : shopTimeIcon}
-                alt=""
-              />
+              <img src={shoptimeFullIcon} alt="" />
             </h1>
 
             {tabActivated &&

com.twin.app.shoptime/src/components/TabLayout/TabLayout.module.less

@@ -37,22 +37,21 @@
   z-index: 1;
 
   > .logo {
-    margin: 60px 24px 84px 42px;
-    > img {
     width: 54px;
     height: 54px;
+    overflow: hidden;
+    margin: 60px 24px 84px 42px;
+    > img {
+      width: 234px;
+      height: 54px;
     }
-    // margin: -40px 24px 84px 42px;
   }
 
   &.expanded {
     width: 402px;
 
     > .logo {
-      > img {
       width: 234px;
-        height: 54px;
-      }
     }
   }