diff --git a/src/components/ContactForm.js b/src/components/ContactForm.js index a83e39f..46e1b6f 100644 --- a/src/components/ContactForm.js +++ b/src/components/ContactForm.js @@ -40,6 +40,7 @@ const StyledContactForm = styled.form` input[type='text'], input[type='email'] { + font-family: 'Montserrat', san-serif; width: 100%; border: none; background-color: #fec5bb; @@ -58,6 +59,7 @@ const StyledContactForm = styled.form` background-color: #fec5bb; border-bottom: 1px solid white; resize: none; + font-family: 'Montserrat', san-serif; font-size: 1rem; color: #2f2e41; } diff --git a/src/components/HomeServices.js b/src/components/HomeServices.js index f6a621f..bd98a0c 100644 --- a/src/components/HomeServices.js +++ b/src/components/HomeServices.js @@ -21,8 +21,12 @@ const StyledServicesDescription = styled.p` const StyledServicesGrid = styled.div` display: grid; - grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); + grid-template-columns: 1fr; grid-gap: 5rem; + + @media (min-width: 768px) { + grid-template-columns: 1fr 1fr; + } `; const StyledServiceItem = styled.div` @@ -32,7 +36,7 @@ const StyledServiceItem = styled.div` margin-bottom: 0.5rem; } p { - max-width: 25rem; + width: 100%; } `; @@ -52,7 +56,6 @@ export default function HomeServices({ servicesTitle, servicesDescription, }) { - const servicesArray = services.nodes; return ( {servicesTitle} @@ -60,19 +63,25 @@ export default function HomeServices({ {servicesDescription} - {servicesArray.map((service) => ( - - - - -

{service.serviceTitle}

-

{service.serviceDescription}

-
- ))} + {services.length > 0 + ? services.map((service) => ( + + + {service.serviceImage ? ( + + ) : null} + +

{service.serviceTitle}

+

{service.serviceDescription}

+
+ )) + : null}
); diff --git a/src/components/Navigation.js b/src/components/Navigation.js index 55d9ee3..283233b 100644 --- a/src/components/Navigation.js +++ b/src/components/Navigation.js @@ -36,7 +36,7 @@ const StyledLogo = styled.a` font-weight: 600; @media (min-width: 768px) { - font-size: 1.7rem; + font-size: 2rem; } `; diff --git a/src/pages/index.js b/src/pages/index.js index 8229e2b..ab98469 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -8,7 +8,6 @@ import SEO from '../components/SEO'; export default function IndexPage({ data }) { const { sanityHomepage } = data; - const { allSanityHomepageServices } = data; return (
@@ -18,7 +17,7 @@ export default function IndexPage({ data }) { heroButtonText={sanityHomepage.heroButtonText} /> @@ -48,14 +47,11 @@ export const query = graphql` whoWeAreDescription contactFormTitle contactFormDescription - } - allSanityHomepageServices { - nodes { + services { serviceTitle serviceDescription serviceImage { asset { - id gatsbyImageData } }