From c89199f762ee5a1ba9506d6229f14bbeccff2b77 Mon Sep 17 00:00:00 2001 From: Bernardo Waldhelm Date: Thu, 29 Dec 2022 14:16:04 -0300 Subject: [PATCH] feat(home): adicionando Header mobile home --- package.json | 5 + src/_variaveis.scss | 1 + src/assets/imgs/close-menu-mobile.png | Bin 0 -> 269 bytes src/assets/imgs/menu-hamburger-header.png | Bin 0 -> 217 bytes src/components/Container/Container.tsx | 15 ++ src/components/Header/Header.module.scss | 153 +++++++++--------- src/components/Header/Header.tsx | 10 +- .../HeaderMobile/HeaderMobile.module.scss | 62 +++++++ src/components/HeaderMobile/HeaderMobile.tsx | 38 +++++ src/components/MenuMobile/MenuMobile.scss | 84 ++++++++++ src/components/MenuMobile/MenuMobile.tsx | 34 ++++ src/pages/Home.tsx | 4 + yarn.lock | 116 ++++++++++++- 13 files changed, 436 insertions(+), 86 deletions(-) create mode 100644 src/assets/imgs/close-menu-mobile.png create mode 100644 src/assets/imgs/menu-hamburger-header.png create mode 100644 src/components/Container/Container.tsx create mode 100644 src/components/HeaderMobile/HeaderMobile.module.scss create mode 100644 src/components/HeaderMobile/HeaderMobile.tsx create mode 100644 src/components/MenuMobile/MenuMobile.scss create mode 100644 src/components/MenuMobile/MenuMobile.tsx diff --git a/package.json b/package.json index b0e35a9..a3128a8 100644 --- a/package.json +++ b/package.json @@ -10,10 +10,12 @@ "@types/node": "^16.7.13", "@types/react": "^18.0.0", "@types/react-dom": "^18.0.0", + "@types/styled-components": "^5.1.26", "node-sass": "^8.0.0", "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "5.0.1", + "styled-components": "^5.3.6", "typescript": "^4.4.2", "web-vitals": "^2.1.0" }, @@ -40,5 +42,8 @@ "last 1 firefox version", "last 1 safari version" ] + }, + "resolutions": { + "styled-components": "^5" } } diff --git a/src/_variaveis.scss b/src/_variaveis.scss index 6c7ee19..e5206fc 100644 --- a/src/_variaveis.scss +++ b/src/_variaveis.scss @@ -4,6 +4,7 @@ $font-family: 'Roboto', sans-serif; /* Colors */ $color-black: #000; +$color-black-transparent: rgba(69, 69, 69, 0.7); $color-white: #fff; $color-primary-700: #F2F2F2; diff --git a/src/assets/imgs/close-menu-mobile.png b/src/assets/imgs/close-menu-mobile.png new file mode 100644 index 0000000000000000000000000000000000000000..db20eb24d94f895068417d8049e27a49d626c4ef GIT binary patch literal 269 zcmeAS@N?(olHy`uVBq!ia0vp^{2``W z$lZxy-8q?;Kn_c~qpu?a!^VE@KZ&eB{vuBo$B+ufxsw_N9SnFFjGF|lngnwWahR>( zz0ttilfa@ZaggKUE+wUxTmR`j_praTg@Ms!O^pM~bp4nqe-4mCk zHOb14TwSA|T@fsNn!DAh(M{<6w8%!j$0w9D4gLr<$7pTx6#V|iUR$YNUUj3Gn4gAx zu)k|_JlnMAt!vE|=p}kv`~LbI8?$8r|7OKcJUd%-f2^+Y`^&KQ`tL32w-c;^u4V9a L^>bP0l+XkKf7x7| literal 0 HcmV?d00001 diff --git a/src/assets/imgs/menu-hamburger-header.png b/src/assets/imgs/menu-hamburger-header.png new file mode 100644 index 0000000000000000000000000000000000000000..ff82bdf5f431941fa5848b5e90da77d64f7c8926 GIT binary patch literal 217 zcmeAS@N?(olHy`uVBq!ia0vp^GC(ZO!3HEHPU(jODb50q$YKTtZeb8+WSBKa0w~B> z9OUlAu {
- +
) diff --git a/src/components/HeaderMobile/HeaderMobile.module.scss b/src/components/HeaderMobile/HeaderMobile.module.scss new file mode 100644 index 0000000..28362f6 --- /dev/null +++ b/src/components/HeaderMobile/HeaderMobile.module.scss @@ -0,0 +1,62 @@ +@import '../../_variaveis.scss'; + +.header-mobile { + display: none; + padding: 25px 16px; + background: $color-black; + width: calc(100% - 32px); + height: 89px; + + @media #{$mq-tablet}, #{$mq-mobile} { + display: block; + + } + + &__top { + display: flex; + justify-content: space-between; + align-items: center; + + &__icon-hamburger { + background-color: transparent; + border: none; + } + } + + &__input { + display: flex; + flex-direction: row; + align-items: center; + padding: 7px 16px; + gap: 10px; + + background: $color-white; + border: 2px solid $color-primary-700; + border-radius: 5px; + + width: calc(100% - 32px); + height: 12px; + margin-top: 25px; + + background-image: url("../../assets/imgs/search-icon-header.png"); + background-size: 18px; + background-repeat: no-repeat; + background-position: bottom 50% right 16px; + + font-family: $font-family; + font-style: normal; + font-weight: 400; + font-size: 14px; + line-height: 16px; + color: $color-primary-500; + + &::placeholder { + font-family: $font-family; + font-style: normal; + font-weight: 400; + font-size: 14px; + line-height: 16px; + color: $color-primary-500; + } + } +} diff --git a/src/components/HeaderMobile/HeaderMobile.tsx b/src/components/HeaderMobile/HeaderMobile.tsx new file mode 100644 index 0000000..b3b5cfc --- /dev/null +++ b/src/components/HeaderMobile/HeaderMobile.tsx @@ -0,0 +1,38 @@ +import { useState } from 'react'; + +import styles from './HeaderMobile.module.scss' + +import { MenuMobile } from '../MenuMobile/MenuMobile'; +import hamburger from '../../assets/imgs/menu-hamburger-header.png' +import logo from '../../assets/imgs/m3-acdemy-logo.png' +import cart from '../../assets/imgs/cart-icon-header.png' + +const HeaderMobile = () => { + const [menuIsVisible, setMenuIsVisible] = useState(false); + + return ( + <> +
+
+ + + Logo M3-ACADEMY + + + + Img do Carrinho + +
+ + + + + ) +} + +export { HeaderMobile } diff --git a/src/components/MenuMobile/MenuMobile.scss b/src/components/MenuMobile/MenuMobile.scss new file mode 100644 index 0000000..fcd559a --- /dev/null +++ b/src/components/MenuMobile/MenuMobile.scss @@ -0,0 +1,84 @@ +@import '../../variaveis'; + +.container-menu { + position: absolute; + backdrop-filter: blur(1px); + width: 100%; + height: 100%; + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: 5; + + background: $color-black-transparent; + opacity: 0; + pointer-events: none; + transition: all 0.4s ease-in-out; + + &.opened { + opacity: 1; + pointer-events: all; + } + + &__wrapper { + width: 90%; + background-color: $color-white; + height: 585px; + } + + &__top { + display: flex; + align-items: center; + justify-content: space-between; + + width: calc(100% - 32px); + height: 78px; + padding: 0 16px; + + background: $color-black; + + &__log { + font-family: $font-family; + font-style: normal; + font-weight: 400; + font-size: 14px; + line-height: 16px; + color: $color-white; + text-decoration: none; + + margin-right: 55px; + } + + &__close { + background: transparent; + border: none; + } + } + + &__bottom { + padding: 0 16px; + width: calc(100% - 32px); + + &__list { + display: flex; + align-items: flex-start; + justify-content: center; + flex-direction: column; + margin-top: 31px; + + &__items-menu { + margin-bottom: 12px; + font-family: $font-family; + font-style: normal; + font-weight: 500; + font-size: 14px; + line-height: 16px; + text-transform: uppercase; + text-decoration: none; + color: $color-primary-400; + + } + } + } +} diff --git a/src/components/MenuMobile/MenuMobile.tsx b/src/components/MenuMobile/MenuMobile.tsx new file mode 100644 index 0000000..d34d8c8 --- /dev/null +++ b/src/components/MenuMobile/MenuMobile.tsx @@ -0,0 +1,34 @@ +import './MenuMobile.scss' + +import close from '../../assets/imgs/close-menu-mobile.png' + +interface MenuMobileProps { + menuIsVisible: boolean; + setMenuIsVisible: React.Dispatch>; +} + +const MenuMobile = ({menuIsVisible, setMenuIsVisible }: MenuMobileProps) => { + return ( +
+
+
+ + ENTRAR + + +
+ +
+
+ ) +} + +export { MenuMobile } diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx index db863d9..554d035 100644 --- a/src/pages/Home.tsx +++ b/src/pages/Home.tsx @@ -1,12 +1,16 @@ import React from 'react'; import { Header } from '../components/Header/Header'; +import { HeaderMobile } from '../components/HeaderMobile/HeaderMobile'; import './Home.scss'; function Home() { return ( + < >
+ + ); } diff --git a/yarn.lock b/yarn.lock index a6f2aca..7498998 100644 --- a/yarn.lock +++ b/yarn.lock @@ -75,7 +75,7 @@ "@jridgewell/gen-mapping" "^0.3.2" jsesc "^2.5.1" -"@babel/helper-annotate-as-pure@^7.18.6": +"@babel/helper-annotate-as-pure@^7.16.0", "@babel/helper-annotate-as-pure@^7.18.6": version "7.18.6" resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.18.6.tgz#eaa49f6f80d5a33f9a5dd2276e6d6e451be0a6bb" integrity sha512-duORpUiYrEpzKIop6iNbjnwKLAKnJ47csTyRACyEmWj0QdUrm5aqNJGHSSEQSUAvNW0ojX0dOmK9dZduvkfeXA== @@ -168,7 +168,7 @@ dependencies: "@babel/types" "^7.20.7" -"@babel/helper-module-imports@^7.10.4", "@babel/helper-module-imports@^7.18.6": +"@babel/helper-module-imports@^7.0.0", "@babel/helper-module-imports@^7.10.4", "@babel/helper-module-imports@^7.16.0", "@babel/helper-module-imports@^7.18.6": version "7.18.6" resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.18.6.tgz#1e3ebdbbd08aad1437b428c50204db13c5a3ca6e" integrity sha512-0NFvs3VkuSYbFi1x2Vd6tKrywq+z/cLeYC/RJNFrIX/30Bf5aiGYbtvGXolEktzJH8o5E5KJ3tT+nkxuuZFVlA== @@ -1052,7 +1052,7 @@ "@babel/parser" "^7.20.7" "@babel/types" "^7.20.7" -"@babel/traverse@^7.20.10", "@babel/traverse@^7.20.5", "@babel/traverse@^7.20.7", "@babel/traverse@^7.7.2": +"@babel/traverse@^7.20.10", "@babel/traverse@^7.20.5", "@babel/traverse@^7.20.7", "@babel/traverse@^7.4.5", "@babel/traverse@^7.7.2": version "7.20.10" resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.20.10.tgz#2bf98239597fcec12f842756f186a9dde6d09230" integrity sha512-oSf1juCgymrSez8NI4A2sr4+uB/mFd9MXplYGPEBnfAuWmmyeVcHa6xLPiaRBcXkcb/28bgxmQLTVwFKE1yfsg== @@ -1193,6 +1193,28 @@ resolved "https://registry.yarnpkg.com/@csstools/selector-specificity/-/selector-specificity-2.0.2.tgz#1bfafe4b7ed0f3e4105837e056e0a89b108ebe36" integrity sha512-IkpVW/ehM1hWKln4fCA3NzJU8KwD+kIOvPZA4cqxoJHtE21CCzjyp+Kxbu0i5I4tBNOlXPL9mjwnWlL0VEG4Fg== +"@emotion/is-prop-valid@^1.1.0": + version "1.2.0" + resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-1.2.0.tgz#7f2d35c97891669f7e276eb71c83376a5dc44c83" + integrity sha512-3aDpDprjM0AwaxGE09bOPkNxHpBd+kA6jty3RnaEXdweX1DF1U3VQpPYb0g1IStAuK7SVQ1cy+bNBBKp4W3Fjg== + dependencies: + "@emotion/memoize" "^0.8.0" + +"@emotion/memoize@^0.8.0": + version "0.8.0" + resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.8.0.tgz#f580f9beb67176fa57aae70b08ed510e1b18980f" + integrity sha512-G/YwXTkv7Den9mXDO7AhLWkE3q+I92B+VqAE+dYG4NGPaHZGvt3G8Q0p9vmE+sq7rTGphUbAvmQ9YpbfMQGGlA== + +"@emotion/stylis@^0.8.4": + version "0.8.5" + resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.8.5.tgz#deacb389bd6ee77d1e7fcaccce9e16c5c7e78e04" + integrity sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ== + +"@emotion/unitless@^0.7.4": + version "0.7.5" + resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.5.tgz#77211291c1900a700b8a78cfafda3160d76949ed" + integrity sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg== + "@eslint/eslintrc@^1.4.0": version "1.4.0" resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-1.4.0.tgz#8ec64e0df3e7a1971ee1ff5158da87389f167a63" @@ -1971,6 +1993,14 @@ dependencies: "@types/node" "*" +"@types/hoist-non-react-statics@*": + version "3.3.1" + resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f" + integrity sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA== + dependencies: + "@types/react" "*" + hoist-non-react-statics "^3.3.0" + "@types/html-minifier-terser@^6.0.0": version "6.1.0" resolved "https://registry.yarnpkg.com/@types/html-minifier-terser/-/html-minifier-terser-6.1.0.tgz#4fc33a00c1d0c16987b1a20cf92d20614c55ac35" @@ -2148,6 +2178,15 @@ resolved "https://registry.yarnpkg.com/@types/stack-utils/-/stack-utils-2.0.1.tgz#20f18294f797f2209b5f65c8e3b5c8e8261d127c" integrity sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw== +"@types/styled-components@^5.1.26": + version "5.1.26" + resolved "https://registry.yarnpkg.com/@types/styled-components/-/styled-components-5.1.26.tgz#5627e6812ee96d755028a98dae61d28e57c233af" + integrity sha512-KuKJ9Z6xb93uJiIyxo/+ksS7yLjS1KzG6iv5i78dhVg/X3u5t1H7juRWqVmodIdz6wGVaIApo1u01kmFRdJHVw== + dependencies: + "@types/hoist-non-react-statics" "*" + "@types/react" "*" + csstype "^3.0.2" + "@types/testing-library__jest-dom@^5.9.1": version "5.14.5" resolved "https://registry.yarnpkg.com/@types/testing-library__jest-dom/-/testing-library__jest-dom-5.14.5.tgz#d113709c90b3c75fdb127ec338dad7d5f86c974f" @@ -2850,6 +2889,22 @@ babel-plugin-polyfill-regenerator@^0.4.1: dependencies: "@babel/helper-define-polyfill-provider" "^0.3.3" +"babel-plugin-styled-components@>= 1.12.0": + version "2.0.7" + resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-2.0.7.tgz#c81ef34b713f9da2b7d3f5550df0d1e19e798086" + integrity sha512-i7YhvPgVqRKfoQ66toiZ06jPNA3p6ierpfUuEWxNF+fV27Uv5gxBkf8KZLHUCc1nFA9j6+80pYoIpqCeyW3/bA== + dependencies: + "@babel/helper-annotate-as-pure" "^7.16.0" + "@babel/helper-module-imports" "^7.16.0" + babel-plugin-syntax-jsx "^6.18.0" + lodash "^4.17.11" + picomatch "^2.3.0" + +babel-plugin-syntax-jsx@^6.18.0: + version "6.18.0" + resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946" + integrity sha512-qrPaCSo9c8RHNRHIotaufGbuOBN8rtdC4QrrFFc43vyWCCz7Kl7GL1PGaXtMGQZUXrkCjNEgxDfmAuAabr/rlw== + babel-plugin-transform-react-remove-prop-types@^0.4.24: version "0.4.24" resolved "https://registry.yarnpkg.com/babel-plugin-transform-react-remove-prop-types/-/babel-plugin-transform-react-remove-prop-types-0.4.24.tgz#f2edaf9b4c6a5fbe5c1d678bfb531078c1555f3a" @@ -3128,6 +3183,11 @@ camelcase@^6.2.0, camelcase@^6.2.1: resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.3.0.tgz#5685b95eb209ac9c0c177467778c9c84df58ba9a" integrity sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA== +camelize@^1.0.0: + version "1.0.1" + resolved "https://registry.yarnpkg.com/camelize/-/camelize-1.0.1.tgz#89b7e16884056331a35d6b5ad064332c91daa6c3" + integrity sha512-dU+Tx2fsypxTgtLoE36npi3UqcjSSMNYfkqgmoEhtZrraP5VWq0K7FkWVTYa8eMPtnU/G2txVsfdCJTn9uzpuQ== + caniuse-api@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-3.0.0.tgz#5e4d90e2274961d46291997df599e3ed008ee4c0" @@ -3480,6 +3540,11 @@ css-blank-pseudo@^3.0.3: dependencies: postcss-selector-parser "^6.0.9" +css-color-keywords@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/css-color-keywords/-/css-color-keywords-1.0.0.tgz#fea2616dc676b2962686b3af8dbdbe180b244e05" + integrity sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg== + css-declaration-sorter@^6.3.1: version "6.3.1" resolved "https://registry.yarnpkg.com/css-declaration-sorter/-/css-declaration-sorter-6.3.1.tgz#be5e1d71b7a992433fb1c542c7a1b835e45682ec" @@ -3549,6 +3614,15 @@ css-select@^4.1.3: domutils "^2.8.0" nth-check "^2.0.1" +css-to-react-native@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/css-to-react-native/-/css-to-react-native-3.0.0.tgz#62dbe678072a824a689bcfee011fc96e02a7d756" + integrity sha512-Ro1yETZA813eoyUp2GDBhG2j+YggidUmzO1/v9eYBKR2EHVEniE2MI/NqpTQ954BMpTPZFsGNPm46qFB9dpaPQ== + dependencies: + camelize "^1.0.0" + css-color-keywords "^1.0.0" + postcss-value-parser "^4.0.2" + css-tree@1.0.0-alpha.37: version "1.0.0-alpha.37" resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-1.0.0-alpha.37.tgz#98bebd62c4c1d9f960ec340cf9f7522e30709a22" @@ -5046,6 +5120,13 @@ he@^1.2.0: resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f" integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw== +hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.3.0: + version "3.3.2" + resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" + integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw== + dependencies: + react-is "^16.7.0" + hoopy@^0.1.4: version "0.1.4" resolved "https://registry.yarnpkg.com/hoopy/-/hoopy-0.1.4.tgz#609207d661100033a9a9402ad3dea677381c1b1d" @@ -7253,7 +7334,7 @@ picocolors@^1.0.0: resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c" integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ== -picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.2.2, picomatch@^2.2.3, picomatch@^2.3.1: +picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.2.2, picomatch@^2.2.3, picomatch@^2.3.0, picomatch@^2.3.1: version "2.3.1" resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42" integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA== @@ -7812,7 +7893,7 @@ postcss-unique-selectors@^5.1.1: dependencies: postcss-selector-parser "^6.0.5" -postcss-value-parser@^4.0.0, postcss-value-parser@^4.1.0, postcss-value-parser@^4.2.0: +postcss-value-parser@^4.0.0, postcss-value-parser@^4.0.2, postcss-value-parser@^4.1.0, postcss-value-parser@^4.2.0: version "4.2.0" resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514" integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ== @@ -8061,7 +8142,7 @@ react-error-overlay@^6.0.11: resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-6.0.11.tgz#92835de5841c5cf08ba00ddd2d677b6d17ff9adb" integrity sha512-/6UZ2qgEyH2aqzYZgQPxEnz33NJ2gNsnHA2o5+o4wW9bLM/JYQitNP9xPhsXwC08hMMovfGe/8retsdDsczPRg== -react-is@^16.13.1: +react-is@^16.13.1, react-is@^16.7.0: version "16.13.1" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== @@ -8619,6 +8700,11 @@ setprototypeof@1.2.0: resolved "https://registry.yarnpkg.com/setprototypeof/-/setprototypeof-1.2.0.tgz#66c9a24a73f9fc28cbe66b09fed3d33dcaf1b424" integrity sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw== +shallowequal@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8" + integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ== + shebang-command@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-2.0.0.tgz#ccd0af4f8835fbdc265b82461aaf0c36663f34ea" @@ -8992,6 +9078,22 @@ style-loader@^3.3.1: resolved "https://registry.yarnpkg.com/style-loader/-/style-loader-3.3.1.tgz#057dfa6b3d4d7c7064462830f9113ed417d38575" integrity sha512-GPcQ+LDJbrcxHORTRes6Jy2sfvK2kS6hpSfI/fXhPt+spVzxF6LJ1dHLN9zIGmVaaP044YKaIatFaufENRiDoQ== +styled-components@^5, styled-components@^5.3.6: + version "5.3.6" + resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-5.3.6.tgz#27753c8c27c650bee9358e343fc927966bfd00d1" + integrity sha512-hGTZquGAaTqhGWldX7hhfzjnIYBZ0IXQXkCYdvF1Sq3DsUaLx6+NTHC5Jj1ooM2F68sBiVz3lvhfwQs/S3l6qg== + dependencies: + "@babel/helper-module-imports" "^7.0.0" + "@babel/traverse" "^7.4.5" + "@emotion/is-prop-valid" "^1.1.0" + "@emotion/stylis" "^0.8.4" + "@emotion/unitless" "^0.7.4" + babel-plugin-styled-components ">= 1.12.0" + css-to-react-native "^3.0.0" + hoist-non-react-statics "^3.0.0" + shallowequal "^1.1.0" + supports-color "^5.5.0" + stylehacks@^5.1.1: version "5.1.1" resolved "https://registry.yarnpkg.com/stylehacks/-/stylehacks-5.1.1.tgz#7934a34eb59d7152149fa69d6e9e56f2fc34bcc9" @@ -9000,7 +9102,7 @@ stylehacks@^5.1.1: browserslist "^4.21.4" postcss-selector-parser "^6.0.4" -supports-color@^5.3.0: +supports-color@^5.3.0, supports-color@^5.5.0: version "5.5.0" resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f" integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==