Updates 3/10/2021

dadoagency · Mar 9, 2021 · ce91375 · ce91375
1 parent 0574637
commit ce91375
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 7 deletions.
diff --git a/src/templates/AdvertorialType4/Footer/Footer.style.js b/src/templates/AdvertorialType4/Footer/Footer.style.js
@@ -9,6 +9,8 @@ export const Container = styled.div`
     font-weight: 200;
     padding-top: 20px;
     padding-bottom: 20px;
+    padding-left: 1rem;
+    padding-right: 1rem;
 `;
 export const Row1 = styled.div`
     display:block;

diff --git a/src/templates/AdvertorialType4/Heading/Heading.js b/src/templates/AdvertorialType4/Heading/Heading.js
@@ -1,14 +1,15 @@
-import React from 'react'
+import React, { useContext } from 'react'
 import * as S from "./Heading.style"
 import { useStaticQuery, graphql } from "gatsby"
+import PageContext from "../../../context/PageContext"
 
 export default ({ heading }) => {
-
+  const { redirectDestination } = useContext(PageContext)
     const data = useStaticQuery(graphql`
     {
       file(base: {eq: "author-avatar.png"}) {
         childImageSharp {
-          fixed {
+          fixed(height: 50) {
             src
           }
         }
@@ -22,14 +23,14 @@ export default ({ heading }) => {
         <>
         <S.Headline>{heading}</S.Headline>
         <S.Categorization>
-            <S.Title>DOG / ELDERLY</S.Title>
+            <S.Title href={redirectDestination}>DOG / ELDERLY</S.Title>
             <S.Line />
         </S.Categorization>
         <S.Author>
             <S.Avatar src={ImageSrc} />
             <S.Meta>
                 BY:
-                <S.Name>
+                <S.Name href={redirectDestination}>
                     REBECCA T
                 </S.Name>
                 <S.Date>

diff --git a/src/templates/AdvertorialType4/Heading/Heading.style.js b/src/templates/AdvertorialType4/Heading/Heading.style.js
@@ -16,11 +16,15 @@ align-items: center;
 margin-bottom: 15px;
 margin-top: 0;
 `
-export const Title = styled.div`
+export const Title = styled.a`
 color: #E26447;
 font-weight: 600;
 font-size: 16px;
 text-transform: uppercase;
+text-decoration: none;
+&:hover {
+    text-decoration: underline;
+}
 `
 export const Line = styled.div`
 background: #E26447;
@@ -62,11 +66,15 @@ color: #969696;
 flex: 1 1;
 font-weight:bold;
 `
-export const Name = styled.span`
+export const Name = styled.a`
 margin: 0 5px;
 color: #E26447;
 font-weight: 600;
 font-size: 16px;
 text-transform: uppercase;
+text-decoration: none;
+&:hover {
+    text-decoration: underline;
+}
 `
 export const Date = styled.span``
diff --git a/src/templates/AdvertorialType4/style.scss b/src/templates/AdvertorialType4/style.scss
@@ -6,6 +6,10 @@
       color: #424242;
       margin-bottom: 100px;
 
+      @media screen and (max-width:890px) {
+          margin-bottom: 20px;
+      }
+
       h1, h2, h3, h4, h5, h6 {
         text-align: inherit;
       }
@@ -65,6 +69,24 @@
         margin: 0;
       }
 
+      .toc-box {
+        background: #E5E8F1;
+        border: none;
+        padding: 20px 30px;
+        margin: 30px 0;
+        & ul {
+          @media screen and (max-width:890px) {
+            padding-inline-start: 0px;
+          }
+        }
+        & li {
+          list-style-type: none;
+          margin-bottom: 10px;
+          & p {
+            margin: 0;
+          }
+        }
+      }
 
 
     }