From 088ea3075bafef04134577a9ff301d34f6688704 Mon Sep 17 00:00:00 2001 From: lytrankieio123 Date: Thu, 26 Aug 2021 17:35:04 +0700 Subject: [PATCH] :art: styles: home video :%s --- package.json | 1 + pages/index.tsx | 3 +- .../common/VideoPlayer/VideoPlayer.tsx | 19 +++++ src/components/common/index.ts | 1 + .../home/HomeVideo/HomeVideo.module.scss | 68 ++++++++++++++++++ .../modules/home/HomeVideo/HomeVideo.tsx | 31 ++++++++ .../modules/home/HomeVideo/assets/bg_left.svg | 19 +++++ .../home/HomeVideo/assets/bg_right.svg | 21 ++++++ .../home/HomeVideo/assets/logo_maggi.png | Bin 0 -> 16137 bytes src/components/modules/home/index.ts | 1 + yarn.lock | 30 +++++++- 11 files changed, 191 insertions(+), 3 deletions(-) create mode 100644 src/components/common/VideoPlayer/VideoPlayer.tsx create mode 100644 src/components/modules/home/HomeVideo/HomeVideo.module.scss create mode 100644 src/components/modules/home/HomeVideo/HomeVideo.tsx create mode 100644 src/components/modules/home/HomeVideo/assets/bg_left.svg create mode 100644 src/components/modules/home/HomeVideo/assets/bg_right.svg create mode 100644 src/components/modules/home/HomeVideo/assets/logo_maggi.png diff --git a/package.json b/package.json index 60f049ce4..91a529d52 100644 --- a/package.json +++ b/package.json @@ -42,6 +42,7 @@ "react-dom": "^17.0.2", "react-fast-marquee": "^1.1.4", "react-merge-refs": "^1.1.0", + "react-player": "^2.9.0", "react-use-measure": "^2.0.4", "sass": "^1.38.0", "swell-js": "^4.0.0-next.0", diff --git a/pages/index.tsx b/pages/index.tsx index 40bfce295..700b10f9e 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -1,12 +1,13 @@ import { Layout } from 'src/components/common'; -import { HomeBanner, HomeCTA, HomeSubscribe } from 'src/components/modules/home'; +import { HomeBanner, HomeCTA, HomeSubscribe, HomeVideo } from 'src/components/modules/home'; export default function Home() { return ( <> + diff --git a/src/components/common/VideoPlayer/VideoPlayer.tsx b/src/components/common/VideoPlayer/VideoPlayer.tsx new file mode 100644 index 000000000..46370202b --- /dev/null +++ b/src/components/common/VideoPlayer/VideoPlayer.tsx @@ -0,0 +1,19 @@ +import React from 'react'; +import ReactPlayer from 'react-player/lazy' + +interface Props { + url: string, + controls?: boolean, + muted?: boolean, +} + +const VideoPlayer = ({ url, controls, muted }: Props) => { + return ( + + ); +}; + +export default VideoPlayer; \ No newline at end of file diff --git a/src/components/common/index.ts b/src/components/common/index.ts index 31f33e011..e143696ea 100644 --- a/src/components/common/index.ts +++ b/src/components/common/index.ts @@ -14,3 +14,4 @@ export { default as Banner} from './Banner/Banner' export { default as Footer} from './Footer/Footer' export { default as MenuDropdown} from './MenuDropdown/MenuDropdown' export { default as NotiMessage} from './NotiMessage/NotiMessage' +export { default as VideoPlayer} from './VideoPlayer/VideoPlayer' diff --git a/src/components/modules/home/HomeVideo/HomeVideo.module.scss b/src/components/modules/home/HomeVideo/HomeVideo.module.scss new file mode 100644 index 000000000..2dad3da21 --- /dev/null +++ b/src/components/modules/home/HomeVideo/HomeVideo.module.scss @@ -0,0 +1,68 @@ +@import "../../../../styles/utilities"; + +.homeVideo { + margin: 2rem auto 3rem; + .top, + .videoWrap > div { + @apply spacing-horizontal; + } + @screen md { + margin: 6.4rem auto 5.6rem; + .top, + .videoWrap > div { + max-width: 60rem; + margin: auto; + padding: 0; + } + } + + @screen lg { + .top, + .videoWrap > div { + max-width: 80rem; + } + } + .top { + margin-bottom: 2rem; + @screen md { + @apply flex items-center; + margin-bottom: 4rem; + .logo { + margin-right: 2.4rem; + margin-bottom: 0; + } + } + .logo { + max-width: 10rem; + margin-bottom: 1rem; + img { + object-fit: cover; + } + } + .heading { + @apply heading-2 font-heading; + } + } + .videoWrap { + @apply relative flex justify-center; + > div { + @apply relative; + width: 100% !important; + z-index: 10; + } + &::before { + @apply absolute bg-primary; + content: ""; + width: 100%; + height: 18rem; + top: 50%; + transform: translateY(-50%); + z-index: 0; + @screen md { + background-image: url("./assets/bg_left.svg"), url("./assets/bg_right.svg"); + background-repeat: no-repeat; + background-position: 5% 0, 95% 0; + } + } + } +} diff --git a/src/components/modules/home/HomeVideo/HomeVideo.tsx b/src/components/modules/home/HomeVideo/HomeVideo.tsx new file mode 100644 index 000000000..9aaeab075 --- /dev/null +++ b/src/components/modules/home/HomeVideo/HomeVideo.tsx @@ -0,0 +1,31 @@ +import Image from 'next/image' +import React from 'react' +import s from './HomeVideo.module.scss' +import LogoBrand from './assets/logo_maggi.png' +import { VideoPlayer } from 'src/components/common' + +interface Props { + className?: string + children?: any +} + +const HomeVideo = ({ }: Props) => { + return ( +
+
+
+ +
+

+ Maggi Sauce Is The Secret Weapon For Making All Your Food +

+
+
+ {/* todo: change url video */} + +
+
+ ) +} + +export default HomeVideo diff --git a/src/components/modules/home/HomeVideo/assets/bg_left.svg b/src/components/modules/home/HomeVideo/assets/bg_left.svg new file mode 100644 index 000000000..d730f777d --- /dev/null +++ b/src/components/modules/home/HomeVideo/assets/bg_left.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + + diff --git a/src/components/modules/home/HomeVideo/assets/bg_right.svg b/src/components/modules/home/HomeVideo/assets/bg_right.svg new file mode 100644 index 000000000..e89652a3a --- /dev/null +++ b/src/components/modules/home/HomeVideo/assets/bg_right.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/modules/home/HomeVideo/assets/logo_maggi.png b/src/components/modules/home/HomeVideo/assets/logo_maggi.png new file mode 100644 index 0000000000000000000000000000000000000000..de0ce8e588033a9eefe00dfd254752cc1db04bff GIT binary patch literal 16137 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 bOZ5K%g~Ac;hQz$D00000NkvXXu0mjfPW0e) literal 0 HcmV?d00001 diff --git a/src/components/modules/home/index.ts b/src/components/modules/home/index.ts index 98afbe092..ca25e8cbe 100644 --- a/src/components/modules/home/index.ts +++ b/src/components/modules/home/index.ts @@ -1,3 +1,4 @@ export { default as HomeBanner } from './HomeBanner/HomeBanner' export { default as HomeCTA } from './HomeCTA/HomeCTA' export { default as HomeSubscribe } from './HomeSubscribe/HomeSubscribe' +export { default as HomeVideo } from './HomeVideo/HomeVideo' diff --git a/yarn.lock b/yarn.lock index f71819fb6..e719b25d1 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2292,7 +2292,7 @@ deep-extend@^0.6.0: resolved "https://registry.yarnpkg.com/deep-extend/-/deep-extend-0.6.0.tgz#c4fa7c95404a17a9c3e8ca7e1537312b736330ac" integrity sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA== -deepmerge@4.2.2, deepmerge@^4.2.2: +deepmerge@4.2.2, deepmerge@^4.0.0, deepmerge@^4.2.2: version "4.2.2" resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-4.2.2.tgz#44d2ea3679b8f4d4ffba33f03d865fc1e7bf4955" integrity sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg== @@ -3657,6 +3657,11 @@ listr@^0.14.3: p-map "^2.0.0" rxjs "^6.3.3" +load-script@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/load-script/-/load-script-1.0.0.tgz#0491939e0bee5643ee494a7e3da3d2bac70c6ca4" + integrity sha1-BJGTngvuVkPuSUp+PaPSuscMbKQ= + loader-utils@1.2.3: version "1.2.3" resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.2.3.tgz#1ff5dc6911c9f0a062531a4c04b609406108c2c7" @@ -3878,6 +3883,11 @@ md5.js@^1.3.4: inherits "^2.0.1" safe-buffer "^5.1.2" +memoize-one@^5.1.1: + version "5.2.1" + resolved "https://registry.yarnpkg.com/memoize-one/-/memoize-one-5.2.1.tgz#8337aa3c4335581839ec01c3d594090cebe8f00e" + integrity sha512-zYiwtZUcYyXKo/np96AGZAckk+FWWsUdJ3cHGGmld7+AhvcWmQyGCYUh1hc4Q/pkOhb65dQR/pqCyK0cOaHz4Q== + merge-stream@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60" @@ -4894,7 +4904,7 @@ promise@^7.1.1: dependencies: asap "~2.0.3" -prop-types@15.7.2: +prop-types@15.7.2, prop-types@^15.7.2: version "15.7.2" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5" integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ== @@ -5029,6 +5039,11 @@ react-dom@^17.0.2: object-assign "^4.1.1" scheduler "^0.20.2" +react-fast-compare@^3.0.1: + version "3.2.0" + resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.0.tgz#641a9da81b6a6320f270e89724fb45a0b39e43bb" + integrity sha512-rtGImPZ0YyLrscKI9xTpV8psd6I8VAtjKCzQDlzyDvqJA8XOW78TXYQwNRNd8g8JZnDu8q9Fu/1v4HPAVwVdHA== + react-fast-marquee@^1.1.4: version "1.2.1" resolved "https://registry.yarnpkg.com/react-fast-marquee/-/react-fast-marquee-1.2.1.tgz#8a8ee91ec0cee04bcff7f1ea5c3fd5a2c4dc227d" @@ -5049,6 +5064,17 @@ react-merge-refs@^1.1.0: resolved "https://registry.yarnpkg.com/react-merge-refs/-/react-merge-refs-1.1.0.tgz#73d88b892c6c68cbb7a66e0800faa374f4c38b06" integrity sha512-alTKsjEL0dKH/ru1Iyn7vliS2QRcBp9zZPGoWxUOvRGWPUYgjo+V01is7p04It6KhgrzhJGnIj9GgX8W4bZoCQ== +react-player@^2.9.0: + version "2.9.0" + resolved "https://registry.yarnpkg.com/react-player/-/react-player-2.9.0.tgz#ef7fe7073434087565f00ff219824e1e02c4b046" + integrity sha512-jNUkTfMmUhwPPAktAdIqiBcVUKsFKrVGH6Ocutj6535CNfM91yrvWxHg6fvIX8Y/fjYUPoejddwh7qboNV9vGA== + dependencies: + deepmerge "^4.0.0" + load-script "^1.0.0" + memoize-one "^5.1.1" + prop-types "^15.7.2" + react-fast-compare "^3.0.1" + react-refresh@0.8.3: version "0.8.3" resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.3.tgz#721d4657672d400c5e3c75d063c4a85fb2d5d68f"