Dev

gatsby-config.js

@@ -5,6 +5,20 @@ module.exports = {
     author: `Bitlogic.io`,
   },
   plugins: [
+    {
+      resolve: `gatsby-plugin-google-gtag`,
+      options: {
+        // You can add multiple tracking ids and a pageview event will be fired for all of them.
+        trackingIds: [
+          "G-BKGQR6SJWV", // Google Analytics / G
+        ],
+        // This object is used for configuration specific to this plugin
+        pluginConfig: {
+          // Puts tracking script in the head instead of the body
+          head: true,
+        },
+      },
+    },
     "gatsby-plugin-react-helmet",
 
     {
@@ -37,6 +51,7 @@ module.exports = {
           `blog-page`,
           `bitway-page`,
           `contact-page`,
+          `global-config`,
         ],
       },
     },
@@ -47,12 +62,12 @@ module.exports = {
       options: {
         defaults: {
           formats: [`auto`, `webp`],
-          placeholder: `blurred`,
+          // placeholder: `blurred`,
           quality: 100,
           breakpoints: [750, 1080, 1366, 1920],
           backgroundColor: `transparent`,
         },
-      }, 
+      },
     },
     {
       resolve: `gatsby-plugin-manifest`,

package.json

@@ -12,6 +12,7 @@
     "gatsby-image": "^3.11.0",
     "gatsby-plugin-gatsby-cloud": "^3.0.0",
     "gatsby-plugin-google-analytics": "^3.12.0",
+    "gatsby-plugin-google-gtag": "^3.13.0",
     "gatsby-plugin-google-marketing-platform": "^0.2.0",
     "gatsby-plugin-hubspot": "^1.3.5",
     "gatsby-plugin-image": "^1.12.0",
@@ -34,6 +35,7 @@
     "react-hubspot-form": "^1.3.7",
     "react-icons": "^4.2.0",
     "react-markdown": "^6.0.2",
+    "react-script-tag": "^1.1.2",
     "react-showdown": "^2.3.1",
     "sass": "^1.35.1"
   },

public/page-data/index/page-data.json

@@ -2,4 +2,4 @@
     "componentChunkName": "component---src-pages-index-js",
     "path": "/",
     "result": {"pageContext":{}},
-    "staticQueryHashes": ["1687125271","176670904","2751633039","2900147843","3549188850","3658105631","4179863467","882490824"]}
+    "staticQueryHashes": ["1128713364","1687125271","176670904","2751633039","2900147843","3549188850","4109181808","4179863467","882490824"]}

src/components/BitwayPage/Gallery/Gallery.js

@@ -1,6 +1,6 @@
 import React from "react"
 import "./Gallery.scss"
-import { getImage, GatsbyImage } from "gatsby-plugin-image"
+import { getImage } from "gatsby-plugin-image"
 import { BgImage } from "gbimage-bridge"
 
 const layouts = {

src/components/BitwayPage/Paragraph/Paragraph.scss

@@ -18,7 +18,7 @@
     line-height: 30px;
     letter-spacing: 0em;
     text-align: left;
-    padding: 0 80px 20px;
+    // padding: 0 80px 20px;
     & * {
       font-size: 20px;
     }
@@ -71,7 +71,6 @@
       line-height: 26px;
       letter-spacing: 0em;
       text-align: left;
-
     }
     & > div > p {
       font-family: $primary-font;
@@ -81,7 +80,7 @@
       line-height: 26px;
       letter-spacing: 0em;
       text-align: left;
-      padding: 0 20px 0px 0px;
+      // padding: 0 20px 0px 0px;
       & * {
         font-size: 15px;
       }
@@ -95,19 +94,22 @@
 @media (min-width: $breakpoint-desktop) {
   .bitway-paragraph {
     & h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    font-size: $extra-large;
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+      font-size: $extra-large;
       & span {
-        padding:15px 10px 5px;
+        padding: 15px 10px 5px;
         & p {
           font-size: $extra-large;
         }
       }
+    }
 
-  }
+    & > div > p {
+    padding: 0 80px 20px;
+    }
   }
 }

src/components/BlogArticle/BlogArticle.js → src/components/BlogPage/BlogArticle/BlogArticle.js

@@ -1,20 +1,29 @@
 import React from "react"
 import { getImage, GatsbyImage } from "gatsby-plugin-image"
 import { Link } from "gatsby"
-import MarkdownView from "react-showdown"
+import showdown from "showdown"
 import "./BlogArticle.scss"
 
 
 const BlogArticle = ({ title, summary, image, slug, text }) => {
+  let converter = new showdown.Converter()
+  let html = converter.makeHtml(summary)
+
+  const ReplaceHtml = () => {
+    return { __html: html }
+  }
+
   return (
     <div className="article__container">
-      <div className="article__image">
-        <GatsbyImage image={getImage(image.localFile)} alt={title} />
-      </div>
+      <GatsbyImage
+        image={getImage(image.localFile)}
+        alt={title}
+        className="article__image"
+      />
       <div className="article__description">
         <h3>{title}</h3>
         <div>
-          <MarkdownView markdown={summary} />
+          <p dangerouslySetInnerHTML={ReplaceHtml()} />
         </div>
         <div className="article__link">
           <Link to={slug}>{text}</Link>

src/components/BlogArticle/BlogArticle.scss → src/components/BlogPage/BlogArticle/BlogArticle.scss

@@ -1,4 +1,4 @@
-@import "../../styles/global.scss";
+@import "../../../styles/global.scss";
 .article {
   &__container {
     display: flex;
@@ -9,18 +9,16 @@
   }
 
   &__image {
-    width: 290px;
-    margin: auto 0;
-
-    img {
-      height: 165px;
-    }
+    width: 100%;
+    height: 150px;
+    transition: opacity 3s ease-in;
   }
 
   &__description {
     display: flex;
     flex-direction: column;
     width: 100%;
+    height: 150px;
     padding: 0 15px;
 
     h3 {
@@ -66,11 +64,7 @@
 
     &__image {
       width: 100%;
-
-      img {
-        width: 500px;
-        height: 300px;
-      }
+      height: 300px;
     }
 
     &__description {
@@ -84,7 +78,7 @@
 
       p,
       a {
-        font-size: 18px;
+        font-size: 16px;
         line-height: 30px;
       }
     }

src/components/BlogPage/BlogContainer.js

@@ -3,8 +3,8 @@ import React from "react"
 import { useBanner, useBlog } from "../../hooks"
 
 import Layout from "../../components/layout"
-import BlogGrid from '../BlogGrid/BlogGrid'
-import BlogArticle from '../BlogArticle/BlogArticle'
+import BlogGrid from './BlogGrid/BlogGrid'
+import BlogArticle from './BlogArticle/BlogArticle'
 
 import { Seo, BannerActionCall } from "../index"
 
@@ -15,7 +15,6 @@ const Blog = () => {
   const bannerData = useBanner()
   const blogData = useBlog()
   const data = blogData?.allStrapiBlogCategory?.nodes
-  console.log(data)
 
   const bannerBlog = bannerData?.allStrapiBanners?.nodes.find(
     banner => banner.page === "blog" && banner.type === "bgColor"
@@ -39,9 +38,11 @@ const Blog = () => {
       )}
       {data.length > 0 && (
         <div className="blog__container">
-          <div className="banner__container">
-            <h3 dangerouslySetInnerHTML={{ __html: bannerBlog.summary }} />
-          </div>
+          {bannerBlog && (
+            <div className="banner__container">
+              <h3 dangerouslySetInnerHTML={{ __html: bannerBlog.summary }} />
+            </div>
+          )}
           {data?.map((article, idx) => (
             <BlogGrid key={idx} title={article.name}>
               {article?.articles?.map((item, idx) => (
@@ -58,9 +59,7 @@ const Blog = () => {
           ))}
         </div>
       )}
-      {bannerActionCall && (
-        <BannerActionCall banner={bannerActionCall} />
-      )}
+      {bannerActionCall && <BannerActionCall banner={bannerActionCall} />}
     </Layout>
   )
 }

src/components/BlogGrid/BlogGrid.js → src/components/BlogPage/BlogGrid/BlogGrid.js

@@ -1,7 +1,7 @@
 import React from 'react'
 
 import './BlogGrid.scss'
-import Pagination from '../Pagination/Pagination'
+import Pagination from '../../Pagination/Pagination'
 
 const BlogGrid = ({title, children}) => {
   return (

src/components/BlogGrid/BlogGrid.scss → src/components/BlogPage/BlogGrid/BlogGrid.scss

@@ -1,4 +1,4 @@
-@import "../../styles/global.scss";
+@import "../../../styles/global.scss";
 .grid {
     &__container {
         display: flex;

src/components/ContactPage/ContactContainer.js

@@ -13,8 +13,8 @@ const Contact = () => {
 
 
   const { image,  nameImage, title } = contactData?.allStrapiContactPage?.nodes[0]
-  const { formId, portalId } = contactData?.allStrapiContactPage?.nodes[0]?.contactForm
-  const { pageTitle, pageDescription, pageKeywords } = contactData?.allStrapiContactPage?.nodes[0]?.pageMetadata
+  const { formId, portalId } = contactData?.allStrapiContactPage?.nodes[0]?.contactForm || {}
+  const { pageTitle, pageDescription, pageKeywords } = contactData?.allStrapiContactPage?.nodes[0]?.pageMetadata || {}
 
   const contactImage = getImage(image?.localFile)
 

src/components/EdTechCards/EdtechCards.scss

@@ -49,8 +49,7 @@
     flex-direction: column;
     align-items: flex-start;
     justify-content: flex-start;
-
-    /*    margin-right: 20px; */
+    padding-left: 10px;
   }
   &__title {
     font-size: $medium;

src/components/HomePage/HomeContainer/HomeContainer.js

@@ -10,17 +10,21 @@ const Home = () => {
   const data = useHomePage()
 
   const homeSections = data?.allStrapiHome?.nodes[0]?.sections
-  const { pageTitle, pageDescription, pageKeywords } = data?.allStrapiHome?.nodes[0].pageMetadata
+  const { pageTitle, pageDescription, pageKeywords } = data?.allStrapiHome?.nodes[0]?.pageMetadata || {}
 
 
   return (
     <Layout>
-      <Seo 
-        title={pageTitle}
-        description={pageDescription}
-        keywords={pageKeywords} 
-      />
-      <CustomSection sections={homeSections} />
+      {data?.allStrapiHome?.nodes[0]?.pageMetadata && (
+        <Seo
+          title={pageTitle}
+          description={pageDescription}
+          keywords={pageKeywords}
+        />
+      )}
+      {homeSections && (
+        <CustomSection sections={homeSections} />
+      )}
     </Layout>
   )
 }

src/components/Seo/Seo.js

@@ -10,8 +10,7 @@ function Seo({ description, lang, meta, title, keywords }) {
     author,
     robots,
     siteMetadata: { siteDesc, siteKeywords, siteTitle },
-    siteURL,
-  } = data.allStrapiGlobalSeo.nodes[0]
+  } = data?.allStrapiGlobalSeo?.nodes[0]
 
   const metaDescription = description ? description : siteDesc
   const defaultTitle = siteTitle

src/components/ServiceCards/ServiceCards.scss

@@ -62,7 +62,7 @@
     margin-bottom: 10px;
   }
   &__intro {
-    font-size: $medium;
+    font-size: $small;
     font-weight: $normal;
     text-align: center;
   }
@@ -93,5 +93,9 @@
         font-size: $extra-large;
       }
     }
+
+    &__intro {
+      font-size: $medium;
+    }
   }
 }

src/components/layout.js

@@ -2,14 +2,31 @@ import * as React from "react"
 import Header from "./header"
 import "./layout.scss"
 import Footer from "./Footer/Footer"
+import ScriptTag from "react-script-tag"
+import useGlobalConfig from "../hooks/useGlobalConfig"
 
 const Layout = ({ children }) => {
+  const config = useGlobalConfig()
+  const scripts = config?.allStrapiGlobalConfig?.nodes.map(item =>
+    item?.script?.map(script =>
+      script.enable === true ? (
+        <ScriptTag
+          key={script.name}
+          type="text/javascript"
+          src={script.src}
+          id={script.name}
+          async
+          defer
+        />
+      ) : null
+    )
+  )
   return (
     <>
+      {scripts}
       <Header />
 
       <main>{children}</main>
-
       <Footer />
       {/*© {new Date().getFullYear()}, Built with*/}
     </>