hoektoe · hoektoe · Aug 30, 2024 · Aug 30, 2024 · Aug 30, 2024 · Sep 3, 2024
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -2,6 +2,6 @@
     "editor.formatOnSave": true,
     "vetur.validation.template": false,
     "editor.codeActionsOnSave": {
-      "source.fixAll.eslint": true
+      "source.fixAll.eslint": "explicit"
     }
-  }
+  }
diff --git a/assets/images/logo-block.svg b/assets/images/logo-block.svg
diff --git a/components/CallToAction.js b/components/CallToAction.js
@@ -7,18 +7,18 @@ import Link from "next/link";
 export default function CallToAction({ blok }) {
   return (
     <SbEditable content={blok} key={blok._uid}>
-      <div className="bg-accent-600">
+      <div className="bg-gray-200">
         <div className="px-4 py-12 mx-auto max-w-7xl sm:px-6 lg:py-24 lg:px-8 lg:flex lg:items-center lg:justify-between">
           <div>
-            <h2 className="pb-3 text-3xl font-extrabold tracking-tight text-white md:text-4xl">
+            <h2 className="pb-3 text-3xl font-extrabold tracking-tight text-gray-900 md:text-4xl">
               <span className="block">{blok.title}</span>
             </h2>
-            <div className="text-accent-100">{render(blok.description)}</div>
+            <div className="text-gray-800">{render(blok.description)}</div>
           </div>
           <div className="flex mt-8 lg:mt-0 lg:flex-shrink-0">
             <div className="inline-flex rounded-md shadow">
               <Link href={blok.button_link.cached_url}>
-                <a className="inline-flex items-center justify-center px-5 py-3 text-base font-medium text-white border border-transparent rounded-md bg-brand-600 hover:bg-brand-700">
+                <a className="inline-flex items-center justify-center px-5 py-3 text-base font-medium text-white border border-transparent rounded-md bg-brand-800 hover:bg-brand-700">
                   {blok.button_text}
                 </a>
               </Link>

diff --git a/components/ContactForm.js b/components/ContactForm.js
@@ -5,7 +5,7 @@ import { MailIcon, PhoneIcon } from "@heroicons/react/outline";
 import { useRouter } from "next/router";
 import { useFormspark } from "@formspark/use-formspark";
 
-const FORMSPARK_FORM_ID = "d9x4tlQD";
+const FORMSPARK_FORM_ID = "b5OJMmFQv";
 
 function transactionID() {
   return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) {
@@ -221,7 +221,7 @@ export default function ContactForm({ blok }) {
                       className="flex-shrink-0 w-6 h-6 text-brand-200"
                       aria-hidden="true"
                     />
-                    <span className="ml-3">therapy@michellesmit.com</span>
+                    <span className="ml-3">adam@thecounsellorscouch.com</span>
                   </dd>
                 </dl>
                 <div className="max-w-3xl mt-6 text-base text-brand-50">
@@ -360,7 +360,7 @@ export default function ContactForm({ blok }) {
                     <button
                       type="submit"
                       disabled={submitting}
-                      className="inline-flex items-center justify-center w-full px-6 py-3 mt-2 text-base font-medium text-white border border-transparent rounded-md shadow-sm bg-brand-600 hover:bg-brand-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-brand-500 sm:w-auto"
+                      className="inline-flex items-center justify-center w-full px-6 py-3 mt-2 text-base font-medium text-white border border-transparent rounded-md shadow-sm bg-brand-800 hover:bg-brand-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-brand-500 sm:w-auto"
                     >
                       {submitting && "..."}
                       {!submitting && trans.submit[locale]}

diff --git a/components/DynamicComponent.js b/components/DynamicComponent.js
@@ -14,6 +14,7 @@ import CallToAction from "./CallToAction";
 import ContactForm from "./ContactForm";
 import Testimonial from "./Testimonial";
 import Prose from "./Prose";
+import Services from "./Services";
 
 const Components = {
   teaser: Teaser,
@@ -31,6 +32,7 @@ const Components = {
   "contact-form": ContactForm,
   testimonial: Testimonial,
   prose: Prose,
+  services: Services,
 };
 
 const DynamicComponent = ({ blok }) => {

diff --git a/components/Footer.js b/components/Footer.js
@@ -3,33 +3,23 @@ import Image from "next/image";
 
 const trans = {
   tagline: {
-    en: "Psychologist - Face to Face Therapy",
+    en: "Addiction Practitioner",
     af: "Voorligting Sielkundige - Terapie in persoon",
   },
-  qualifications: {
-    en: "M. Psych, Hons Psych",
-    af: "M. Sielk., Hons. Sielk.",
-  },
+
   description: {
-    en: "HPCSA registered counselling psychologist based in Paarl. Online & face to face therapy available.",
+    en: "SACSSP registered social worker based in Winelands.",
     af: "HPCSA-geregistreerde voorligting sielkundige gebaseer in Paarl.",
   },
   about: {
     en: "About",
     af: "Meer oor my",
   },
   therapy: {
-    en: "Therapy Services",
+    en: "Services",
     af: "Terapiedienste",
   },
-  rates: {
-    en: "Rates & Insurance",
-    af: "Tariewe & Medies",
-  },
-  counselling: {
-    en: "Counselling Psychologist",
-    af: "Voorligting Sielkundige",
-  },
+
   copyright: {
     en: "Copyright",
     af: "Kopiereg",
@@ -38,46 +28,36 @@ const trans = {
 
 export default function Footer({ locale, locales }) {
   return (
-    <footer className="relative pt-4 pb-6 bg-accent-700">
-      <div className="pt-8 border-t-4 bg-accent-700 border-brand">
+    <footer className="relative pt-4 pb-6 bg-accent-900">
+      <div className="pt-8 border-t-4 bg-accent-900 border-brand">
         <div className="relative px-4 mx-auto max-w-7xl sm:px-6 lg:px-8">
           <div className="flex flex-wrap">
-            <div className="flex justify-center w-full px-4 pb-6 md:pb-0 md:justify-start lg:w-2/12">
+            <div className="flex justify-center w-full px-4 pb-6 responsive md:pb-0 md:justify-start lg:w-2/12">
               <Image
-                alt="Michelle Smit Logo Artum Lilly"
-                src="https://a.storyblok.com/f/101001/x/00dafa5eda/logo-block.svg"
+                alt="Adam Labuschagne Logo Artum Lilly"
+                src="https://a.storyblok.com/f/302764/600x400/0f72e58a98/untitled-design-2.png"
                 className="object cover"
-                width={150}
-                height={150}
+                width={600}
+                height={400}
               />
             </div>
             <div className="w-full px-4 text-center md:text-left lg:w-6/12">
-              <div className="text-3xl font-semibold uppercase text-brand-500">
-                Michelle Smit
+              <div className="text-3xl font-semibold uppercase text-brand-200">
+                Adam Labuschagne
               </div>
               <div className="mt-0 text-lg text-white">
                 {trans.tagline[locale]}
               </div>
-              <div className="mt-0 mb-6 text-brand-300">
-                {trans.qualifications[locale]}
-              </div>
+
               <p className="text-gray-200">{trans.description[locale]}</p>
               <div className="mt-2">
                 <ul className="text-sm text-gray-700 list-unstyled">
                   <li>
                     <a
-                      href="mailto:[email protected]"
-                      className="text-brand-400"
-                    >
-                      [email protected]
-                    </a>
-                  </li>
-                  <li>
-                    <a
-                      href="mailto:[email protected]"
-                      className="text-brand-500"
+                      href="mailto:[email protected]"
+                      className="text-brand-200"
                     >
-                      practicemanager@michellesmit.com
+                      adam@thecounsellorscouch.com
                     </a>
                   </li>
                 </ul>
@@ -92,32 +72,18 @@ export default function Footer({ locale, locales }) {
                   <ul className="list-unstyled">
                     <li>
                       <Link href="/about">
-                        <a className="block pb-2 text-sm text-gray-300 hover:text-brand-400">
+                        <a className="block pb-2 text-sm text-gray-100 hover:text-brand-400">
                           {trans.about[locale]}
                         </a>
                       </Link>
                     </li>
                     <li>
                       <Link href="/therapy-services">
-                        <a className="block pb-2 text-sm text-gray-300 hover:text-brand-400">
+                        <a className="block pb-2 text-sm text-gray-100 hover:text-brand-400">
                           {trans.therapy[locale]}
                         </a>
                       </Link>
                     </li>
-                    <li>
-                      <Link href="/rates-and-insurance">
-                        <a className="block pb-2 text-sm text-gray-300 hover:text-brand-400">
-                          {trans.rates[locale]}
-                        </a>
-                      </Link>
-                    </li>
-                    {/* <li>
-                      <Link href="/rates-and-insurance">
-                        <a className="block pb-2 text-sm text-gray-300 hover:text-brand-400">
-                          Sien in Afrikaans
-                        </a>
-                      </Link>
-                    </li> */}
                   </ul>
                 </div>
               </div>
@@ -127,16 +93,12 @@ export default function Footer({ locale, locales }) {
           <div className="flex flex-wrap items-center justify-center md:justify-between">
             <div className="w-full px-4 mx-auto text-center md:w-4/12">
               <div className="py-1 text-sm text-gray-300">
-                {trans.copyright[locale]} © 2021 Michelle Smit -{" "}
-                {trans.counselling[locale]}
+                {trans.copyright[locale]} © 2024 Adam Labuschagne
               </div>
             </div>
           </div>
         </div>
       </div>
-      <a href="https://nappycare.co.za/" className="hidden">
-        nappycare.co.za
-      </a>
     </footer>
   );
 }
diff --git a/components/Head.js b/components/Head.js
@@ -5,20 +5,26 @@ import { HOME_META_IMAGE_URL } from "lib/constant";
 const Head = ({ title, description }) => (
   <NextHead>
     <meta charSet="UTF-8" />
-    <title>{title || ""}</title>
-    <meta name="description" content={description || ""} />
+    <title>{`The Counsellors Couch - Adam Labuschagne` || ""}</title>
+    <meta
+      name="description"
+      content={
+        `The Counsellor's Couch offers compassionate and professional mental health counseling services, providing a safe space for individuals to explore personal challenges, improve well-being, and achieve personal growth.` ||
+        ""
+      }
+    />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta
       name="keywords"
-      content="Online Counselling, Psychologist, South Africa, Noordhoek, Kommetjie, Therapy Services, Depression, Anxiety, Relationship, Michelle Smit, Counselling Psychologist, Online Therapy"
+      content="Online Session with Adam Labuschagne, Addiction Practitioner"
     />
     <meta name="twitter:card" content="summary" />
     <link rel="icon" type="image/png" href="/meta/favicon.ico" />
     <link rel="apple-touch-icon" href="/meta/apple-touch-icon.png" />
     <meta name="og:image" content={HOME_META_IMAGE_URL} />
     <meta name="twitter:image" content={HOME_META_IMAGE_URL} />
     <meta name="theme-color" content="#96C5C5" />
-    <meta name="og:url" content="https://www.michellesmit.com/" />
+    <meta name="og:url" content="https://www.thecounsellorscouch.com/" />
   </NextHead>
 );
 

diff --git a/components/HeaderBanner.js b/components/HeaderBanner.js
@@ -2,24 +2,28 @@
 import { AtSymbolIcon, XIcon } from "@heroicons/react/outline";
 
 export default function HeaderBanner({ locale }) {
-
   return (
-    <div className="text-xs bg-accent-600">
-      <div className="px-3 py-2 mx-auto max-w-7xl sm:px-6 lg:px-8">
-        <div className="flex flex-wrap items-center justify-between">
+    <div className="text-xs bg-brand-900">
+      <div className="px-3 py-2 mx-auto sm:px-6 lg:px-8">
+        <div className="flex flex-wrap items-center justify-between overflow-hidden">
           <div className="flex items-center flex-1 w-100">
-            <span className="flex p-1 rounded-lg bg-brand-800">
+            <span className="flex p-1 rounded-lg bg-brand-700">
               <AtSymbolIcon className="w-3 h-3 text-white" aria-hidden="true" />
             </span>
             <p className="ml-3 font-medium text-white truncate">
-              <span className="md:hidden">[email protected]</span>
-              <span className="hidden md:inline">[email protected]</span>
+              <span className="md:hidden">[email protected]</span>
+              <span className="hidden md:inline">
+                [email protected]
+              </span>
             </p>
           </div>
-          <div className="flex-shrink-0 ml-8 order-3 w-full sm:order-2 sm:mt-0 sm:w-auto">
-            <a href="https://www.google.com/maps/place/33%C2%B049'26.7%22S+18%C2%B056'17.9%22E/@-33.82409,18.9361023,17z/data=!3m1!4b1!4m5!3m4!1s0x0:0xa56137bb04d3db77!8m2!3d-33.82409!4d18.938291
-" className="text-white">
-              Psychologist based in Paarl
+          <div className="flex-shrink-0 order-3 w-full ml-8 sm:order-2 sm:mt-0 sm:w-auto">
+            <a
+              href="https://www.google.com/maps/place/33%C2%B049'26.7%22S+18%C2%B056'17.9%22E/@-33.82409,18.9361023,17z/data=!3m1!4b1!4m5!3m4!1s0x0:0xa56137bb04d3db77!8m2!3d-33.82409!4d18.938291
+"
+              className="text-white"
+            >
+              Addiction Practitioner based in Winelands
             </a>
           </div>
           <div className="flex-shrink-0 order-2 hidden sm:order-3 sm:ml-3">

diff --git a/components/Headline.js b/components/Headline.js
@@ -4,16 +4,16 @@ import SbEditable from "storyblok-react";
 export default function Headline({ blok }) {
   return (
     <SbEditable content={blok} key={blok._uid}>
-      <div className="max-w-4xl px-4 py-12 mx-auto sm:py-12 sm:px-6 lg:px-8">
+      <div className="max-w-4xl px-4 pt-12 pb-0 mx-auto sm:px-6 lg:px-8">
         <div className="text-center">
-          <div className="text-base font-bold tracking-wide uppercase text-brand-700">
+          <div className="text-base font-bold tracking-wide uppercase text-brand-800">
             {blok.subtitle}
           </div>
 
           {blok.make_title_h1 && (
             <h1
               id={blok.scroll_to_hash && blok.scroll_to_hash}
-              className="text-4xl font-extrabold leading-tight text-accent-500 sm:text-5xl sm:tracking-tight lg:text-6xl"
+              className="text-4xl font-extrabold leading-tight text-accent-800 sm:text-5xl sm:tracking-tight lg:text-6xl"
             >
               {blok.title}
             </h1>
@@ -22,7 +22,7 @@ export default function Headline({ blok }) {
           {!blok.make_title_h1 && (
             <h2
               id={blok.scroll_to_hash && blok.scroll_to_hash}
-              className="text-4xl font-extrabold leading-tight text-accent-500 sm:text-5xl sm:tracking-tight lg:text-6xl"
+              className="text-4xl font-extrabold leading-tight text-accent-800 sm:text-5xl sm:tracking-tight lg:text-6xl"
             >
               {blok.title}
             </h2>

diff --git a/components/HeroImageOnRight.js b/components/HeroImageOnRight.js
@@ -7,15 +7,15 @@ import { render } from "storyblok-rich-text-react-renderer";
 export default function HeroImageOnRight({ blok }) {
   return (
     <SbEditable content={blok} key={blok._uid}>
-      <div className="relative bg-gray-50">
+      <div className="relative bg-brand-800">
         <main className="lg:relative">
           <div className="w-full pt-16 pb-20 mx-auto text-center max-w-7xl lg:py-48 lg:text-left">
             <div className="px-4 lg:w-1/2 sm:px-8 xl:pr-16">
-              <h1 className="text-4xl font-extrabold tracking-tight text-gray-900 sm:text-5xl md:text-6xl lg:text-5xl xl:text-6xl">
+              <h1 className="text-4xl font-extrabold tracking-tight text-white sm:text-5xl md:text-6xl lg:text-5xl xl:text-6xl">
                 <span className="block xl:inline">{blok.headline}</span>
               </h1>
               {blok.description && (
-                <div className="max-w-md mx-auto mt-3 text-lg text-gray-500 sm:text-xl md:mt-5 md:max-w-3xl">
+                <div className="max-w-md mx-auto mt-3 text-lg text-gray-50 sm:text-xl md:mt-5 md:max-w-3xl">
                   {render(blok.description)}
                 </div>
               )}
@@ -26,22 +26,23 @@ export default function HeroImageOnRight({ blok }) {
                       <Link href={blok.link_secondary_href.cached_url}>
                         <a
                           href={blok.link_secondary_href.cached_url}
-                          className="flex items-center justify-center w-full px-8 py-3 text-base font-medium text-white border border-transparent rounded-md bg-brand-600 hover:bg-brand-700 md:py-4 md:text-lg md:px-10"
+                          className="flex items-center justify-center w-full px-8 py-3 text-base font-medium text-white border border-transparent rounded-md bg-brand-700 hover:bg-brand-600 md:py-4 md:text-lg md:px-10"
                         >
                           {blok.link_secondary_text}
                         </a>
                       </Link>
                     </div>
                   )}
-                {blok.link_primary_href.cached_url && blok.link_primary_text && (
-                  <div className="mt-3 rounded-md shadow sm:mt-0 sm:ml-3">
-                    <Link href={blok.link_primary_href.cached_url}>
-                      <a className="flex items-center justify-center w-full px-8 py-3 text-base font-medium bg-white border border-transparent rounded-md text-brand-600 hover:bg-gray-50 md:py-4 md:text-lg md:px-10">
-                        {blok.link_primary_text}
-                      </a>
-                    </Link>
-                  </div>
-                )}
+                {blok.link_primary_href.cached_url &&
+                  blok.link_primary_text && (
+                    <div className="mt-3 rounded-md shadow sm:mt-0 sm:ml-3">
+                      <Link href={blok.link_primary_href.cached_url}>
+                        <a className="flex items-center justify-center w-full px-8 py-3 text-base font-medium bg-white border border-transparent rounded-md text-brand-800 hover:bg-gray-50 md:py-4 md:text-lg md:px-10">
+                          {blok.link_primary_text}
+                        </a>
+                      </Link>
+                    </div>
+                  )}
               </div>
             </div>
           </div>

diff --git a/components/ImageWithTextOnRight.js b/components/ImageWithTextOnRight.js
@@ -38,7 +38,7 @@ export default function ImageWithTextOnLeft({ blok }) {
                 <div className="rounded-md shadow">
                   {blok.button_text && blok.button_link.cached_url && (
                     <Link href={blok.button_link.cached_url}>
-                      <a className="flex items-center justify-center px-5 py-3 text-base font-medium text-white border border-transparent rounded-md bg-brand-600 hover:bg-brand-700">
+                      <a className="flex items-center justify-center px-5 py-3 text-base font-medium text-white border border-transparent rounded-md bg-brand-800 hover:bg-brand-700">
                         {blok.button_text}
                       </a>
                     </Link>