diff --git a/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx b/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx index c1e0fa0e..08424dbc 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx +++ b/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx @@ -11,6 +11,7 @@ import VirtualGridList from '@enact/sandstone/VirtualList'; import { SpotlightContainerDecorator, } from '@enact/spotlight/SpotlightContainerDecorator'; +import Spottable from '@enact/spotlight/Spottable'; import SectionTitle from '../../../components/SectionTitle/SectionTitle'; import TGrid from '../../../components/TGrid/TGrid'; @@ -22,6 +23,7 @@ import { import css from './BestSeller.module.less'; import BestSellerItem from './BestSellerItem/BestSellerItem'; +const SpottableComponent = Spottable("div"); const Container = SpotlightContainerDecorator( { enterTo: "last-focused", leaveFor: { left: "", right: "" } }, "div" @@ -34,14 +36,23 @@ const BestSeller = () => { const renderItem = useCallback( ({ index, ...rest }) => { const itemData = bestSellerDatas[index]; - return ( - - ); + if (index !== bestSellerDatas.length) { + return ( + + ); + } else { + return ( + + ); + } }, [bestSellerDatas] ); @@ -53,7 +64,7 @@ const BestSeller = () => { {bestSellerDatas && bestSellerDatas.length > 0 && ( h2 { @@ -20,3 +21,23 @@ } } } +.addItem { + width: 198px; + height: 438px; + background-color: #fff; + border: 1px solid #e4e4e4; + border-radius: 12px; + background-image: url("../../../../assets/icon/button_icon/ic-more-nor.svg"); + background-size: 66px 66px; + background-position: center center; + background-repeat: no-repeat; + &:focus, + &:hover, + &:focus-within, + &:active { + border: 4px solid @PRIMARY_COLOR_RED; + box-sizing: border-box; + border-radius: 12px; + background-image: url("../../../../assets/icon/button_icon/ic-more-sel.svg"); + } +} diff --git a/com.twin.app.shoptime/src/views/HomePanel/HomeOnSale/HomeOnSale.module.less b/com.twin.app.shoptime/src/views/HomePanel/HomeOnSale/HomeOnSale.module.less index b4316043..7041f4b5 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/HomeOnSale/HomeOnSale.module.less +++ b/com.twin.app.shoptime/src/views/HomePanel/HomeOnSale/HomeOnSale.module.less @@ -3,17 +3,6 @@ padding: 60px 0px 0px 60px; width: 100%; - .subTitle { - border-left: 6px solid #c70850; - padding-left: 12px; - box-sizing: border-box; - color: #1a1a1a; - font-weight: bold; - font-family: "LGSmartUIBold"; - font-size: 42px; - margin-bottom: 20px; - } - .grid { height: 300px; overflow: unset; diff --git a/com.twin.app.shoptime/src/views/HomePanel/PopularShow/PopularShow.jsx b/com.twin.app.shoptime/src/views/HomePanel/PopularShow/PopularShow.jsx index cf73a7da..66c01153 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/PopularShow/PopularShow.jsx +++ b/com.twin.app.shoptime/src/views/HomePanel/PopularShow/PopularShow.jsx @@ -14,6 +14,7 @@ import { VirtualGridList } from '@enact/sandstone/VirtualList'; import { SpotlightContainerDecorator, } from '@enact/spotlight/SpotlightContainerDecorator'; +import Spottable from '@enact/spotlight/Spottable'; import SectionTitle from '../../../components/SectionTitle/SectionTitle'; import { @@ -24,6 +25,7 @@ import { import css from '../PopularShow/PopularShow.module.less'; import PopularShowItem from './PopularShowItem/PopularShowItem'; +const SpottableComponent = Spottable("div"); const Container = SpotlightContainerDecorator( { enterTo: "last-focused" }, "div" @@ -36,9 +38,22 @@ const PopularShow = ({ ...rest }) => { const renderItem = useCallback( ({ index, ...rest }) => { const itemData = topInfos[index]; - return ( - - ); + if (index !== topInfos.length) { + return ( + + ); + } else { + return ( + + ); + } }, [topInfos] ); @@ -49,7 +64,7 @@ const PopularShow = ({ ...rest }) => {
{topInfos && topInfos.length > 0 && ( { const renderItem = useCallback( ({ index, ...rest }) => { const itemData = categoryItemInfos[index]; - - return ( - - ); + if (index !== categoryItemInfos.length) { + return ( + + ); + } else { + return ( + + ); + } }, [categoryItemInfos] ); + return ( {
{categoryItemInfos && categoryItemInfos.length > 0 && (