From dc7ee62f830cd25d410e49e061890f9f6bc9125d Mon Sep 17 00:00:00 2001 From: quocsonnguyen Date: Fri, 27 Aug 2021 10:36:04 +0700 Subject: [PATCH] :spakles: feat: Home Feature --- .../home/HomeFeature/HomeFeature.module.scss | 43 -------------- .../modules/home/HomeFeature/HomeFeature.tsx | 23 ------- .../{desktop.png => 10h30-11h-desktop.png} | Bin .../{mobile.png => 10h30-11h-mobile.png} | Bin .../home/HomeFeature/assets/8h-desktop.png | Bin 0 -> 4726 bytes .../home/HomeFeature/assets/8h-mobile.png | Bin 0 -> 2456 bytes .../home/HomeFeature/assets/green-desktop.png | Bin 0 -> 4919 bytes .../HomeFeature/HomeFeature.module.scss | 14 +++++ .../components/HomeFeature/HomeFeature.tsx | 22 +++++++ .../HomeFeatureItem.module.scss | 56 ++++++++++++++++++ .../HomeFeatureItem}/HomeFeatureItem.tsx | 14 +++-- .../home/HomeFeature/components/index.ts | 1 + 12 files changed, 101 insertions(+), 72 deletions(-) delete mode 100644 src/components/modules/home/HomeFeature/HomeFeature.module.scss delete mode 100644 src/components/modules/home/HomeFeature/HomeFeature.tsx rename src/components/modules/home/HomeFeature/assets/{desktop.png => 10h30-11h-desktop.png} (100%) rename src/components/modules/home/HomeFeature/assets/{mobile.png => 10h30-11h-mobile.png} (100%) create mode 100644 src/components/modules/home/HomeFeature/assets/8h-desktop.png create mode 100644 src/components/modules/home/HomeFeature/assets/8h-mobile.png create mode 100644 src/components/modules/home/HomeFeature/assets/green-desktop.png create mode 100644 src/components/modules/home/HomeFeature/components/HomeFeature/HomeFeature.module.scss create mode 100644 src/components/modules/home/HomeFeature/components/HomeFeature/HomeFeature.tsx create mode 100644 src/components/modules/home/HomeFeature/components/HomeFeatureItem/HomeFeatureItem.module.scss rename src/components/modules/home/HomeFeature/{ => components/HomeFeatureItem}/HomeFeatureItem.tsx (52%) create mode 100644 src/components/modules/home/HomeFeature/components/index.ts diff --git a/src/components/modules/home/HomeFeature/HomeFeature.module.scss b/src/components/modules/home/HomeFeature/HomeFeature.module.scss deleted file mode 100644 index f9f799ae6..000000000 --- a/src/components/modules/home/HomeFeature/HomeFeature.module.scss +++ /dev/null @@ -1,43 +0,0 @@ -@import '../../../../styles/utilities'; - -.homeFeature { - @apply spacing-horizontal-left; - overflow-x: hidden; - - @screen md { - @apply spacing-horizontal grid grid-cols-3; - - } -} - -.homeFeatureItem { - @apply inline-block align-middle; - - .itemImg { - @apply float-left clear-both; - width: 5.6rem; - height: 5.6rem; - - @screen md { - @apply float-left clear-both; - width: 11.2rem; - height: 11.2rem; - } - } - - .itemText { - @apply collection-subtitle; - width: 28rem; - height: 9.6rem; - margin-left: 2.4rem; - - @screen md { - @apply collection-subtitle text-justify; - width: 36rem; - height: 9.6rem; - margin-left: 2.4rem; - color: red; - } - } - -} \ No newline at end of file diff --git a/src/components/modules/home/HomeFeature/HomeFeature.tsx b/src/components/modules/home/HomeFeature/HomeFeature.tsx deleted file mode 100644 index 04611ac75..000000000 --- a/src/components/modules/home/HomeFeature/HomeFeature.tsx +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react' -import s from './HomeFeature.module.scss' - -import HomeFeatureItem from './HomeFeatureItem' - -import img from './assets/desktop.png' - -interface HomeFeatureProps { - -} - -const HomeFeature = ({ }: HomeFeatureProps) => { - return ( -
- - - -
- ) - -} - -export default HomeFeature diff --git a/src/components/modules/home/HomeFeature/assets/desktop.png b/src/components/modules/home/HomeFeature/assets/10h30-11h-desktop.png similarity index 100% rename from src/components/modules/home/HomeFeature/assets/desktop.png rename to src/components/modules/home/HomeFeature/assets/10h30-11h-desktop.png diff --git a/src/components/modules/home/HomeFeature/assets/mobile.png b/src/components/modules/home/HomeFeature/assets/10h30-11h-mobile.png similarity index 100% rename from src/components/modules/home/HomeFeature/assets/mobile.png rename to src/components/modules/home/HomeFeature/assets/10h30-11h-mobile.png diff --git a/src/components/modules/home/HomeFeature/assets/8h-desktop.png b/src/components/modules/home/HomeFeature/assets/8h-desktop.png new file mode 100644 index 0000000000000000000000000000000000000000..403996dc9b278a072cade69ad4275972a5dc6e7b GIT binary patch literal 4726 zcmbuDTfm>5@ho1VI^ybPbU1lu^

c|HA#?b>8oDu5+$)UFYG6H#5 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 { + return ( +

+ Webshop owner will upload products at 10:30pm shoppers can buy fresh products at 11pm.} /> + + Most fresh fish and seafood will be listed at 8am from inventory.} /> + + Show that food will be shipped in a greengrocery plastic bag.} /> +
+ ) + +} + +export default HomeFeature diff --git a/src/components/modules/home/HomeFeature/components/HomeFeatureItem/HomeFeatureItem.module.scss b/src/components/modules/home/HomeFeature/components/HomeFeatureItem/HomeFeatureItem.module.scss new file mode 100644 index 000000000..217ed0f98 --- /dev/null +++ b/src/components/modules/home/HomeFeature/components/HomeFeatureItem/HomeFeatureItem.module.scss @@ -0,0 +1,56 @@ +@import '../../../../../../styles/utilities'; + +.homeFeatureItem { + @apply flex; + align-items: center; + vertical-align: middle; + height: fit-content; + + .itemImg { + @apply float-left clear-both; + min-width: 9.6rem; + max-width: 11.2rem; + margin-right: 2.4rem; + &.firstImg { + content:url("../../assets/10h30-11h-mobile.png"); + } + &.secondImg { + content:url("../../assets/8h-mobile.png"); + } + @screen md { + @apply float-left clear-both; + min-width: 9.6rem; + max-width: 11.2rem; + margin-right: 2.4rem; + &.firstImg { + content:url("../../assets/10h30-11h-desktop.png"); + } + &.secondImg { + content:url("../../assets/8h-desktop.png"); + } + &.thirdImg { + content:url("../../assets/green-desktop.png"); + } + } + } + + .itemText { + display: flex; + font-size: 1.6rem; + line-height: 2.4rem; + width: 28rem; + height: 9.6rem; + color: #000; + margin-right: 2.4rem; + align-items: center; + @screen md { + display: flex; + width: 28rem; + height: 9.6rem; + color: #000; + margin-right: 2.4rem; + align-items: center; + } + } + +} \ No newline at end of file diff --git a/src/components/modules/home/HomeFeature/HomeFeatureItem.tsx b/src/components/modules/home/HomeFeature/components/HomeFeatureItem/HomeFeatureItem.tsx similarity index 52% rename from src/components/modules/home/HomeFeature/HomeFeatureItem.tsx rename to src/components/modules/home/HomeFeature/components/HomeFeatureItem/HomeFeatureItem.tsx index 50b01abd0..d09624f93 100644 --- a/src/components/modules/home/HomeFeature/HomeFeatureItem.tsx +++ b/src/components/modules/home/HomeFeature/components/HomeFeatureItem/HomeFeatureItem.tsx @@ -1,18 +1,20 @@ import React from 'react' -import s from './HomeFeature.module.scss' -import Image from 'next/image' +import classNames from 'classnames' +import s from './HomeFeatureItem.module.scss' + interface HomeFeatureItemProps { - image?: any; - children: string; + image: string; + children: any; } const HomeFeatureItem = ({ image, children }: HomeFeatureItemProps) => { return (
- home feature item img - {/* home feature item img */} + home feature item img
{children}
) diff --git a/src/components/modules/home/HomeFeature/components/index.ts b/src/components/modules/home/HomeFeature/components/index.ts new file mode 100644 index 000000000..c4f31a879 --- /dev/null +++ b/src/components/modules/home/HomeFeature/components/index.ts @@ -0,0 +1 @@ +export { default as HomeFuture } from './HomeFeature/HomeFeature'; \ No newline at end of file