diff --git a/src/components/Footer/ContactData/contactData.js b/src/components/Footer/ContactData/contactData.js index a7485e37..90875fde 100644 --- a/src/components/Footer/ContactData/contactData.js +++ b/src/components/Footer/ContactData/contactData.js @@ -1,32 +1,41 @@ -import React from "react"; -import { useFooter } from '../../../hooks'; +import { Link } from "gatsby" +import React from "react" +import { useFooter } from "../../../hooks" import FaIcon from "../../FaIcon/FaIcon" -import "./contactData.scss"; +import "./contactData.scss" export default function ContactData() { - const data = useFooter(); - const dataFooter = data?.allStrapiLayout?.nodes[0]?.footer; + const data = useFooter() + const dataFooter = data?.allStrapiLayout?.nodes[0]?.footer + const dataNav = data?.allStrapiLayout?.nodes[0].navbar?.navButton - const contact = dataFooter?.contact?.iconText.map((item) => { + const contact = dataFooter?.contact?.iconText.map(item => { return (

{item.name}

) - }); + }) return ( <> -
+
{dataFooter?.contact?.title}
-

{contact}

+

{contact}

-
- {dataFooter.internalLink?.name} +
+ + {dataFooter.internalLink?.name} +
- ) -} +} \ No newline at end of file diff --git a/src/components/Footer/ContactData/contactData.scss b/src/components/Footer/ContactData/contactData.scss index 5dd2eb18..2ade690b 100644 --- a/src/components/Footer/ContactData/contactData.scss +++ b/src/components/Footer/ContactData/contactData.scss @@ -19,11 +19,13 @@ font-weight: 600; text-decoration: underline; font-size: 18px; + color: $secondary; } } } @media screen and (min-width: $breakpoint-md) { .ContactData__Item { + &__contact { display: block; } @@ -50,3 +52,20 @@ } } } + +@media screen and (min-width: $breakpoint-xl) { + .ContactData__Item { + .icon-text { + font-size: 18px; + svg { + margin-right: 10px; + } + } + &__link { + a { + font-size: 20px; + } + } + } + +} diff --git a/src/components/Footer/Navegation/navegation.js b/src/components/Footer/Navegation/navegation.js index 95e53717..ae5d58ad 100644 --- a/src/components/Footer/Navegation/navegation.js +++ b/src/components/Footer/Navegation/navegation.js @@ -1,26 +1,24 @@ -import React from 'react'; -import { useFooter } from '../../../hooks'; -import { Link } from 'gatsby'; -import './navegation.scss'; +import React from "react" +import { useFooter } from "../../../hooks" +import { Link } from "gatsby" +import "./navegation.scss" export default function Navegation() { - const data = useFooter(); - const dataFooter = data?.allStrapiLayout?.nodes[0].footer; + const data = useFooter() + const dataFooter = data?.allStrapiLayout?.nodes[0].footer + const dataNav = data?.allStrapiLayout?.nodes[0].navbar + console.log(dataNav) - const navegationItems = dataFooter?.navegation?.pageLink; - - const navegationParts = navegationItems?.map((section) => -
  • - {section.name} -
  • - ); - - return ( -
    -
    {dataFooter.navegation?.title}
    -
      - {navegationParts} -
    -
    - ) + return ( +
    +
    {dataFooter.navegation?.title}
    +
      + {dataNav.navbarItem.map(navItem => ( +
    • + {navItem.label} +
    • + ))} +
    +
    + ) } diff --git a/src/components/Footer/Subscription/subscription.js b/src/components/Footer/Subscription/subscription.js index fb73274f..acc4abe5 100644 --- a/src/components/Footer/Subscription/subscription.js +++ b/src/components/Footer/Subscription/subscription.js @@ -1,27 +1,24 @@ -import React from 'react'; -import { useFooter } from '../../../hooks'; -import './subscription.scss'; +import React from "react" +import { useFooter } from "../../../hooks" +import "./subscription.scss" export default function Subscription() { - const data = useFooter(); - const dataSubscription = data?.allStrapiLayout?.nodes[0]?.footer?.subscription; + const data = useFooter() + const dataSubscription = data?.allStrapiLayout?.nodes[0]?.footer?.subscription - return ( -
    -
    {dataSubscription?.title}
    -
    -
    - - -
    -
    + return ( +
    +
    {dataSubscription?.title}
    +
    +
    +
    - ) +
    + +
    + ) } diff --git a/src/components/Footer/Subscription/subscription.scss b/src/components/Footer/Subscription/subscription.scss index 18df0120..4c71118b 100644 --- a/src/components/Footer/Subscription/subscription.scss +++ b/src/components/Footer/Subscription/subscription.scss @@ -2,9 +2,7 @@ .ContactData { &__Item { - .titleSubscription { - display: none; - } + form { margin-bottom: 0px; } @@ -28,6 +26,9 @@ } } @media screen and (min-width: $breakpoint-md) { + .contactData-mobile_button{ + display: none; + } .ContactData { &__Item { .titleSubscription { @@ -60,3 +61,30 @@ } } } + + +@media screen and (max-width: $breakpoint-md) { + .ContactData { + &__Form { + input { + width: 75%; + } + button:not(.contactData-mobile_button) { + width: 70%; + display: none; + } + } + } + .titleSubscription { + display: none; + } + .contactData-mobile_button{ + width: 70%; + @include primaryBtn; + margin-top: 3em; + } + .contactData-container{ + display: flex; + justify-content: center; + } +} diff --git a/src/components/NavBar/NavBar.scss b/src/components/NavBar/NavBar.scss index c3eb7ad1..affc0ea4 100644 --- a/src/components/NavBar/NavBar.scss +++ b/src/components/NavBar/NavBar.scss @@ -9,10 +9,11 @@ } .NavBar__Logo { margin: 16px 28px; - width: 79px; + width: 120px; } + .navbar-toggler .navbar-toggler-icon { - background-image: url("https://strapi-s3-bitlogic.s3.sa-east-1.amazonaws.com/burger_menu_3ae79f1b8e.svg") !important; + background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzMCIgaGVpZ2h0PSIzMCIgdmlld0JveD0iMCAwIDMwIDMwIj48cGF0aCBzdHJva2U9IiMzZjZiZTgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjIiIGQ9Ik00IDdoMjJNNCAxNWgyMk00IDIzaDIyIi8+PC9zdmc+") !important; width: 2rem; height: 2rem; } diff --git a/src/components/NavBar/Navbar.js b/src/components/NavBar/Navbar.js index b01c964e..58028e1e 100644 --- a/src/components/NavBar/Navbar.js +++ b/src/components/NavBar/Navbar.js @@ -6,11 +6,12 @@ import AnimatedNavbar from "./AnimatedNavBar/AnimatedNavbar" import { getImage, GatsbyImage } from "gatsby-plugin-image" import { useNavbar } from "../../hooks/index" - +import menusvg from '../../images/menu.svg' import { useTheme } from "../../context/themeContext" // theme images import moon from "../../images/moon-solid.svg" import sun from "../../images/sun.svg" +console.log(menusvg) const NavBar = () => { const { theme, toggleTheme } = useTheme() const navbarData = useNavbar() @@ -27,7 +28,7 @@ const NavBar = () => { return ( <> - + {