reorg + started content

pocketbase/pb_migrations/1692982727_created_articles.js

@@ -0,0 +1,55 @@
+/// <reference path="../pb_data/types.d.ts" />
+migrate((db) => {
+  const collection = new Collection({
+    "id": "esuoxbzyb74u5de",
+    "created": "2023-08-25 16:58:47.470Z",
+    "updated": "2023-08-25 16:58:47.470Z",
+    "name": "articles",
+    "type": "base",
+    "system": false,
+    "schema": [
+      {
+        "system": false,
+        "id": "73ayywzr",
+        "name": "title",
+        "type": "text",
+        "required": false,
+        "unique": false,
+        "options": {
+          "min": null,
+          "max": null,
+          "pattern": ""
+        }
+      },
+      {
+        "system": false,
+        "id": "evdktwpq",
+        "name": "file",
+        "type": "file",
+        "required": false,
+        "unique": false,
+        "options": {
+          "maxSelect": 1,
+          "maxSize": 5242880,
+          "mimeTypes": [],
+          "thumbs": [],
+          "protected": false
+        }
+      }
+    ],
+    "indexes": [],
+    "listRule": null,
+    "viewRule": null,
+    "createRule": null,
+    "updateRule": null,
+    "deleteRule": null,
+    "options": {}
+  });
+
+  return Dao(db).saveCollection(collection);
+}, (db) => {
+  const dao = new Dao(db);
+  const collection = dao.findCollectionByNameOrId("esuoxbzyb74u5de");
+
+  return dao.deleteCollection(collection);
+})

website/app/(pages)/accupuncture/page.tsx

@@ -0,0 +1,17 @@
+import AccuForDocs from "./views/AccuForDocs";
+import BasicsAndHist from "./views/BasicsAndHist";
+import EarAccupuncture from "./views/EarAccupuncture";
+import ScalpAccupuncture from "./views/ScalpAccupuncture";
+
+const Accupuncture = () => {
+  return (
+    <main>
+      <BasicsAndHist></BasicsAndHist>
+      <EarAccupuncture></EarAccupuncture>
+      <ScalpAccupuncture></ScalpAccupuncture>
+      <AccuForDocs></AccuForDocs>
+    </main>
+  );
+};
+
+export default Accupuncture;

website/app/(pages)/accupuncture/views/AccuForDocs.tsx

@@ -0,0 +1,9 @@
+const AccuForDocs = () => {
+  return (
+    <section className="min-h-screen" id="accufordocs">
+      AccuForDocs
+    </section>
+  );
+};
+
+export default AccuForDocs;

website/app/(pages)/accupuncture/views/BasicsAndHist.tsx

@@ -0,0 +1,9 @@
+const BasicsAndHist = () => {
+  return (
+    <section className="min-h-screen" id="basicsandhist">
+      BasicsAndHist
+    </section>
+  );
+};
+
+export default BasicsAndHist;

website/app/(pages)/accupuncture/views/EarAccupuncture.tsx

@@ -0,0 +1,9 @@
+const EarAccupuncture = () => {
+  return (
+    <section className="min-h-screen" id="earaccupuncture">
+      EarAccupuncture
+    </section>
+  );
+};
+
+export default EarAccupuncture;

website/app/(pages)/accupuncture/views/ScalpAccupuncture.tsx

@@ -0,0 +1,9 @@
+const ScalpAccupuncture = () => {
+  return (
+    <section className="min-h-screen" id="scalpaccupuncture">
+      ScalpAccupuncture
+    </section>
+  );
+};
+
+export default ScalpAccupuncture;

website/app/(pages)/articles/page.tsx

@@ -0,0 +1,13 @@
+import ArtsForDocs from "./views/ArtsForDocs";
+import ArtsForPatients from "./views/ArtsForPatients";
+
+const Articles = () => {
+  return (
+    <main>
+      <ArtsForPatients></ArtsForPatients>
+      <ArtsForDocs></ArtsForDocs>
+    </main>
+  );
+};
+
+export default Articles;

website/app/(pages)/articles/views/ArtsForDocs.tsx

@@ -0,0 +1,9 @@
+const ArtsForDocs = () => {
+  return (
+    <section className="min-h-screen" id="artsfordocs">
+      ArtsForDocs
+    </section>
+  );
+};
+
+export default ArtsForDocs;

website/app/(pages)/articles/views/ArtsForPatients.tsx

@@ -0,0 +1,9 @@
+const ArtsForPatients = () => {
+  return (
+    <section className="min-h-screen" id="artsforpatients">
+      ArtsForPatients
+    </section>
+  );
+};
+
+export default ArtsForPatients;

website/app/(pages)/nor/page.tsx

@@ -0,0 +1,15 @@
+import NOR from "./views/NOR";
+import NORArticles from "./views/NORArticles";
+import NORVideos from "./views/NORVideos";
+
+const NeuroOcularRelease = () => {
+  return (
+    <main>
+      <NOR></NOR>
+      <NORArticles></NORArticles>
+      <NORVideos></NORVideos>
+    </main>
+  );
+};
+
+export default NeuroOcularRelease;

website/app/(pages)/nor/views/NOR.tsx

@@ -0,0 +1,9 @@
+const NOR = () => {
+  return (
+    <section className="min-h-screen" id="nor">
+      NOR
+    </section>
+  );
+};
+
+export default NOR;

website/app/(pages)/nor/views/NORArticles.tsx

@@ -0,0 +1,9 @@
+const NORArticles = () => {
+  return (
+    <section className="min-h-screen" id="norarticles">
+      NORArticles
+    </section>
+  );
+};
+
+export default NORArticles;

website/app/(pages)/nor/views/NORVideos.tsx

@@ -0,0 +1,9 @@
+const NORVideos = () => {
+  return (
+    <section className="min-h-screen" id="norvideos">
+      NORVideos
+    </section>
+  );
+};
+
+export default NORVideos;

website/app/(pages)/osteopathy/page.tsx

@@ -0,0 +1,15 @@
+import OsteoForDocs from "./views/OsteoForDocs";
+import PediatricCare from "./views/PediatricCare";
+import WhatIsOsteo from "./views/OsteoBasics";
+
+const Osteopathy = () => {
+  return (
+    <main>
+      <WhatIsOsteo></WhatIsOsteo>
+      <PediatricCare></PediatricCare>
+      <OsteoForDocs></OsteoForDocs>
+    </main>
+  );
+};
+
+export default Osteopathy;

website/app/(pages)/osteopathy/views/OsteoBasics.tsx

@@ -0,0 +1,9 @@
+const OsteoBasics = () => {
+  return (
+    <section className="min-h-screen" id="osteobasics">
+      OsteoBasics
+    </section>
+  );
+};
+
+export default OsteoBasics;

website/app/(pages)/osteopathy/views/OsteoForDocs.tsx

@@ -0,0 +1,9 @@
+const OsteoForDocs = () => {
+  return (
+    <section className="min-h-screen" id="osteofordocs">
+      OsteoForDocs
+    </section>
+  );
+};
+
+export default OsteoForDocs;

website/app/(pages)/osteopathy/views/PediatricCare.tsx

@@ -0,0 +1,9 @@
+const PediatricCare = () => {
+  return (
+    <section className="min-h-screen" id="pediatriccare">
+      PediatricCare
+    </section>
+  );
+};
+
+export default PediatricCare;

website/app/accupuncture/page.tsx

@@ -1,9 +0,0 @@
-const Accupuncture = () => {
-  return (
-    <main>
-      <div className="h-screen">Accupuncture</div>
-    </main>
-  );
-};
-
-export default Accupuncture;

website/app/articles/page.tsx

@@ -1,9 +0,0 @@
-const Articles = () => {
-  return (
-    <main>
-      <div className="h-screen">Articles</div>
-    </main>
-  );
-};
-
-export default Articles;

website/app/globals.css

@@ -1,4 +1,4 @@
-@import url(https://fonts.bunny.net/css?family=abel:400|cormorant:700|frank-ruhl-libre:300);
+@import url(https://fonts.bunny.net/css?family=abel:400|cormorant:700);
 
 @tailwind base;
 @tailwind components;

website/app/nor/page.tsx

@@ -1,9 +0,0 @@
-const NeuroOcularRelease = () => {
-  return (
-    <main>
-      <div className="h-screen">NeuroOcularRelease</div>
-    </main>
-  );
-};
-
-export default NeuroOcularRelease;

website/app/osteopathy/page.tsx

@@ -1,9 +0,0 @@
-const Osteopathy = () => {
-  return (
-    <main>
-      <div className="h-screen">Osteopathy</div>
-    </main>
-  );
-};
-
-export default Osteopathy;

website/app/page.tsx

@@ -1,13 +1,9 @@
-import Accomplishments from "./views/Accomplishments";
-import ClinicalPhilosophy from "./views/ClinicalPhilosophy";
 import Introduction from "./views/Introduction";
 
 const Home = () => {
   return (
     <main>
       <Introduction></Introduction>
-      <ClinicalPhilosophy></ClinicalPhilosophy>
-      <Accomplishments></Accomplishments>
     </main>
   );
 };

website/app/views/AcademicWork.tsx

@@ -0,0 +1,9 @@
+const AcademicWork = () => {
+  return (
+    <section className="min-h-screen" id="academicwork">
+      AcademicWork
+    </section>
+  );
+};
+
+export default AcademicWork;

website/app/views/Accomplishments.tsx

@@ -1,190 +0,0 @@
-const Accomplishments = () => {
-  const cardClass =
-    " overflow-hidden border-style-double border-primary-500 border-2 bg-primary-100 rounded-md drop-shadow-sm flex items-center bg-opacity-75 ";
-  return (
-    <section className="text-primary-500 overflow-hidden" id="accomplishments">
-      <div className="min-h-screen w-full bg-primary-300 flex items-center relative z-[-2]">
-        <div className="w-11/12 lg:w-5/6 mx-auto flex flex-col">
-          <h2 className="font-cormorant text-5xl my-16 md:mt-32 text-left">
-            Not only a caring physician...
-          </h2>
-          <div className="grid md:grid-rows-2 md:grid-cols-6 md:gap-8 gap-y-3 gap-x-1 w-full">
-            <div className={cardClass + "col-span-3"}>
-              <div className="relative">
-                <div className="before:absolute before:-left-64 before:-top-64 before:z-[-1] before:content-textAccent2">
-                  <div className="p-6">
-                    <h3 className="font-bold">Professional Experience</h3>
-                    <ul className="list-[square] ml-8">
-                      <li>
-                        <i>President</i> of Feely Center for Optimal Health, his
-                        private osteopathic practice.
-                      </li>
-                      <li>
-                        <i>President </i>of{" "}
-                        <a
-                          href="https://www.ommtests.com"
-                          className="underline"
-                        >
-                          OMMtests.com
-                        </a>{" "}
-                        and{" "}
-                        <a
-                          href="https://www.tcmtests.com"
-                          className="underline"
-                        >
-                          TCMtests.com
-                        </a>
-                        , test-prep sites for osteopathic doctors and
-                        accupuncturists, respectively.
-                      </li>
-                      <li>
-                        <i>Registered Investment Adviser</i> at Womack
-                        Investment Advisers.
-                      </li>
-                      <li>
-                        <i>National Director of Quality Management</i> at
-                        American WholeHealth.
-                      </li>
-                    </ul>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            <div className={cardClass + "col-span-3"}>
-              <div className="relative">
-                <div className="before:absolute before:-right-64 before:-top-64 before:z-[-1] before:content-textAccent2">
-                  <div className="p-6">
-                    <h3 className="font-bold ">Board Certifications</h3>
-                    <ul className="list-[square] ml-8">
-                      <li>American Board of Medical Acupuncture</li>
-
-                      <li>
-                        American Board of Independent Medical Examiners{" "}
-                        {"(CIME)"}
-                      </li>
-
-                      <li>
-                        American Board of Quality Assurance and Utilization
-                        Review Physicians
-                      </li>
-
-                      <li>
-                        American Osteopathic Board of Special Proficiency in
-                        Manipulative Medicine
-                      </li>
-
-                      <li>American Board of Osteopathic Family Practice</li>
-                    </ul>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            <div className={cardClass + "col-span-3"}>
-              <div className="relative">
-                <div className="before:absolute before:-left-64 before:-bottom-64 before:z-[-1] before:content-textAccent2">
-                  <div className="p-6">
-                    <h3 className="font-bold">Academic Appointments</h3>
-                    <ul className="list-[square] ml-8">
-                      <li>
-                        <i>
-                          Clinical Associate Professor of Osteopathic
-                          Manipulative Medicine.
-                        </i>{" "}
-                        at Chicago College of Osteopathic Medicine/Midwestern
-                        University Medicine.
-                      </li>
-                      <li>
-                        <i>Adjunct Associate Professor</i> at Touro University,
-                        A.T. Still University, and Western University.
-                      </li>
-                      <li>
-                        <i>Consultant</i> to the World Health Organization for
-                        integrative medicine.
-                      </li>
-                    </ul>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            <div className={cardClass + "h-48 justify-center"}>
-              <div className="flex flex-col items-center p-6">
-                <div className="text-2xl font-bold">3</div>
-                <div className="text-center">books written</div>
-              </div>
-            </div>
-            <div className={cardClass + "h-48 justify-center"}>
-              <div className="flex flex-col items-center p-6">
-                <div className="text-2xl font-bold">9</div>
-                <div className="text-center">articles & abstracts</div>
-              </div>
-            </div>
-            <div className={cardClass + "h-48 justify-center"}>
-              <div className="relative">
-                <div className="before:absolute before:-right-128 before:-bottom-64 before:z-[-1] before:content-textAccent2">
-                  <div className="flex flex-col items-center p-6 ">
-                    <div className="text-2xl font-bold">76</div>
-                    <div className="text-center">lectures given</div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div className="relative">
-            <div className="before:absolute lg:before:content-textAccent4 before:z-[-1] before:-right-12 before:top-8 ">
-              <h2 className="font-cormorant text-5xl my-16 text-right">
-                ...an{" "}
-                <span className="text-primary-100">
-                  accomplished professional.
-                </span>
-              </h2>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div className="bg-primary-100 items-center my-3 mx-8 flex justify-center md:justify-between flex-wrap">
-        <img
-          src="/feelycenter.png"
-          alt="Feely Center Logo"
-          className="m-5 max-h-[80px] rounded-md drop-shadow-sm"
-        />
-        <img
-          src="/midwestern_college.jpg"
-          alt="Midwestern College Logo"
-          className="m-5 max-h-[80px] rounded-md drop-shadow-sm"
-        />
-        <img
-          src="/omm_logo.png"
-          alt="OMM Logo"
-          className="m-5 max-h-[80px] rounded-md drop-shadow-sm"
-        />
-        <img
-          src="/tcm_tests.png"
-          alt="TCM Logo"
-          className="m-5 max-h-[80px] rounded-md drop-shadow-sm"
-        />
-        <img
-          src="/womack.png"
-          alt="Womack Logo"
-          className="m-5 max-h-[80px] rounded-md drop-shadow-sm"
-        />
-      </div>
-    </section>
-  );
-};
-
-export default Accomplishments;
-
-// <p className="">
-//   Richard is also widely known for his work in osteopathic
-//   manipulation, cranial osteopathy, and acupuncture. He is a
-//   sought-after lecturer, educator, and author. He has written about
-//   integrative medical treatments and has edited several prestigious
-//   medical journals, including{" "}
-//   <span className="italic">
-//     Clinical Cranial Osteopathy: Selected Readings
-//   </span>
-//   .
-// </p>

website/app/views/CertsAndFellows.tsx

@@ -0,0 +1,9 @@
+const CertsAndFellows = () => {
+  return (
+    <section className="min-h-screen" id="certsandfellows">
+      CertsAndFellows
+    </section>
+  );
+};
+
+export default CertsAndFellows;

website/app/views/ClinicalPhilosophy.tsx

@@ -1,66 +0,0 @@
-const ClinicalPhilosophy = () => {
-  return (
-    <section className="text-primary-500" id="philosophy">
-      <div className="min-h-screen w-full bg-primary-100 flex items-center relative z-[-2] overflow-hidden">
-        <div className="w-11/12 lg:w-5/6 mt-32 mb-16 md:my-12 lg:mb-16 mx-auto flex flex-col gap-12 items-center">
-          <div className="relative">
-            <div className="before:absolute lg:before:content-textAccent3 before:z-[-1] before:-left-16 before:-top-8">
-              <h2 className="font-cormorant text-6xl mb-4 text-center">
-                A <span className="text-secondary-500">unique</span> approach to
-                medicine.
-              </h2>
-            </div>
-          </div>
-          <div className="flex items-center flex-col gap-12 md:gap-4 md:flex-row md:justify-around">
-            <div className="basis-4/12">
-              <img
-                className="shadow-lg shadow-tertiary-400 rounded-3xl max-w-sm w-full"
-                src="/dr_feely_brick_wall.webp"
-                alt="Picture of Dr. Feely"
-              />
-            </div>
-            <div className="basis-6/12 flex flex-col gap-5 md:gap-10 text-lg">
-              <div className="relative">
-                <div className="before:absolute before:-right-48 before:-top-32 before:z-[-1] before:content-textAccent2">
-                  <p className="">
-                    Dr. Richard Feely has served the Chicago area with high
-                    quality medical care marked by a holistic approach. As a
-                    specialist in osteopathic medicine, Dr. Feely views your
-                    health in the context of your lifestyle and environment,
-                    providing you with comprehensive care that has lasting
-                    results.
-                  </p>
-                </div>
-              </div>
-
-              <p className="">
-                After an evaluation, Dr. Feely will give you access to every
-                health resource you need, enabling you to not only feel better
-                in the short term, but live a healthier lifestyle and acheive
-                optimal health.
-              </p>
-
-              <div className="relative">
-                <div className="before:absolute before:content-quote before:z-[2] before:-left-2 before:top-2">
-                  <div className="bg-gray-200 rounded-sm drop-shadow-md mx-4 bg-opacity-75">
-                    <p className="p-5 font-cormorant text-xl">
-                      As an osteopathic physician, my education and philosophy
-                      of care centers around treating the whole person. I don’t
-                      look at or treat only the symptoms you may present with. I
-                      consider everything about you and your life.
-                    </p>
-                    <p className="px-5 pb-5 text-right italic">
-                      &mdash;Dr. Richard Feely
-                    </p>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-};
-
-export default ClinicalPhilosophy;

website/app/views/EduAndProExp.tsx

@@ -0,0 +1,58 @@
+const EduAndProExp = () => {
+  return (
+    <section className="min-h-screen" id="eduandproexp">
+      <div className="">
+        <div>Education</div>
+        <div>
+          <div>Truman State University</div>
+          <div>B.S. - Zoology/Chemistry</div>
+        </div>
+        <div>
+          <div>
+            A.T. Still University, Kirksville College of Osteopathic Medicine
+          </div>
+          <div>
+            Doctor of Osteopathy, Pre-doctoral fellow in Osteopathic Theory and
+            Methods
+          </div>
+        </div>
+        <div>
+          <div>Davenport Osteopathic Hospital</div>
+          <div>Rotating Internship Training Program</div>
+        </div>
+      </div>
+      <div className="">
+        <div>Professional Experience</div>
+        <div>
+          <div>Feely Center for Optimal Health</div>
+          <div>2000-Present</div>
+          <div>President</div>
+          <div>
+            A private osteopathic integrative medical practice with locations in
+            Chicago and Olympia Fields, IL
+          </div>
+        </div>
+        <div>
+          <div>TCMtests, LLC</div>
+          <div>2003-Present</div>
+          <div>Founder and President</div>
+          <div>
+            The leading online board certification test prep site for
+            Acupuncturist and Oriental Medical Doctors
+          </div>
+        </div>
+        <div>
+          <div></div>
+          <div>2003-Present</div>
+          <div>Founder and President</div>
+          <div>
+            The leading online board certification test prep site for
+            Acupuncturist and Oriental Medical Doctors
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+};
+
+export default EduAndProExp;

website/app/views/Introduction.tsx

@@ -1,7 +1,17 @@
+"use client";
+
+import Carousel from "@/components/Carousel";
+import { ChevronDoubleDownIcon } from "@heroicons/react/24/solid";
+import drFeelyPic from "@/public/dr_feely_headshot.png";
+import Image from "next/image";
+
 const Introduction = () => {
   return (
-    <section className="text-primary-100" id="introduction">
-      <div className="min-h-screen w-full bg-primary-500 flex items-center relative z-[-2] overflow-hidden">
+    <section
+      className="text-primary-100 relative min-h-screen bg-primary-500 z-[-20]"
+      id="introduction"
+    >
+      <div className="min-h-screen bg-transparent w-full flex items-center relative z-[-2] overflow-hidden">
         <div className="w-11/12 lg:w-5/6 mt-32 my-14 md:mt-12 md:my-0 mx-auto flex items-center flex-col gap-12 md:gap-4 md:flex-row md:justify-around">
           <hgroup className="basis-6/12">
             <div className="relative">
@@ -20,14 +30,23 @@ const Introduction = () => {
             </p>
           </hgroup>
           <div className="basis-4/12 flex justify-center">
-            <img
-              className="shadow-superPortraitR shadow-secondary-500 rounded-3xl max-w-sm w-full"
-              src="/dr_feely_headshot.png"
+            <Image
+              className="shadow-superPortraitR shadow-secondary-500 rounded-3xl max-w-sm w-full md:max-w-md"
+              src={drFeelyPic}
               alt="Headshot of Dr. Feely"
             />
           </div>
         </div>
+        <div className="bg-secondary-500 rounded-full hidden md:inline-block ml-[-10px] mb-3 absolute bottom-0 left-1/2 animate-bounce drop-shadow-xl p-1.5">
+          <a href="/#philosophy">
+            <ChevronDoubleDownIcon
+              width="20px"
+              className=""
+            ></ChevronDoubleDownIcon>
+          </a>
         </div>
+      </div>
+      <Carousel className="absolute top-0 left-0 h-full w-full z-[-10]"></Carousel>
     </section>
   );
 };

website/components/Carousel.tsx

@@ -0,0 +1,52 @@
+"use client";
+
+import Image from "next/image";
+import chicagoPic from "@/public/homepage_carousel/chicago.jpg";
+import indianapolisPic from "@/public/homepage_carousel/indianapolis.webp";
+import naturePic from "@/public/homepage_carousel/nature.jpg";
+import { useEffect, useState } from "react";
+import { useTransition, animated } from "@react-spring/web";
+
+interface Props {
+  className?: string;
+}
+
+const Carousel = ({ className }: Props) => {
+  const [backgroundIndex, setBackgroundIndex] = useState(0);
+  const backgroundImages = [
+    { image: chicagoPic, desc: "Chicago Skyline" },
+    { image: indianapolisPic, desc: "Indianapolis Skyline" },
+    { image: naturePic, desc: "Two women hiking in the mountains" },
+  ];
+
+  useEffect(() => {
+    const interval = setInterval(() => {
+      setBackgroundIndex(
+        (prevIndex) => (prevIndex + 1) % backgroundImages.length
+      );
+    }, 10000);
+
+    return () => clearInterval(interval);
+  }, []);
+
+  const transitions = useTransition(backgroundIndex, {
+    key: backgroundIndex,
+    from: { opacity: 0 },
+    enter: { opacity: 0.25 },
+    leave: { opacity: 0 },
+    config: { duration: 2500 },
+    exitBeforeEnter: true,
+  });
+
+  return transitions((style, item) => (
+    <animated.div style={style} className={className}>
+      <Image
+        src={backgroundImages[item].image}
+        alt={backgroundImages[item].desc}
+        className="h-full w-full object-cover"
+      />
+    </animated.div>
+  ));
+};
+
+export default Carousel;

website/components/Navbar/index.tsx

@@ -3,6 +3,9 @@
 import { useEffect, useState } from "react";
 import { Bars3Icon, XMarkIcon } from "@heroicons/react/24/solid";
 import NavPages from "./NavPages";
+import logo from "@/public/logo.png";
+import logo_small from "@/public/logo_small.png";
+import Image from "next/image";
 
 const Navbar = () => {
   const [currentPage, setCurrentPage] = useState("/");
@@ -24,13 +27,22 @@ const Navbar = () => {
   return (
     <nav
       className={
-        "bg-primary-500 text-primary-100 fixed top-0  w-full " +
+        "bg-primary-500 text-primary-100 fixed top-0 z-40 w-full " +
         (isTopOfPage
           ? "bg-transparent"
-          : "z-40 bg-opacity-75 backdrop-blur-sm drop-shadow")
+          : "bg-opacity-75 backdrop-blur-sm drop-shadow")
       }
     >
       <div className="mx-auto w-11/12 lg:w-5/6 flex justify-between items-center">
+        <div className="flex justify-between items-center">
+          <Image
+            src={isTopOfPage ? logo_small : logo_small}
+            alt="Feely Center Logo"
+            className={
+              "drop-shadow-2xl " +
+              (isTopOfPage ? "w-32 md:w-44" : "w-16 md:w-24")
+            }
+          />
           <div
             className={
               "font-cormorant text-2xl p-5 " +
@@ -39,6 +51,7 @@ const Navbar = () => {
           >
             Richard A. Feely, DO
           </div>
+        </div>
 
         {/* Burger icon */}
         <div className="md:hidden w-[30px] text-tertiary-300 ">

website/package.json

@@ -10,6 +10,7 @@
   },
   "dependencies": {
     "@heroicons/react": "^2.0.18",
+    "@react-spring/web": "^9.7.3",
     "@types/node": "20.4.4",
     "@types/react": "18.2.15",
     "@types/react-dom": "18.2.7",

website/pnpm-lock.yaml

@@ -8,6 +8,9 @@ dependencies:
   '@heroicons/react':
     specifier: ^2.0.18
     version: 2.0.18(react@18.2.0)
+  '@react-spring/web':
+    specifier: ^9.7.3
+    version: 9.7.3(react-dom@18.2.0)(react@18.2.0)
   '@types/node':
     specifier: 20.4.4
     version: 20.4.4
@@ -287,6 +290,54 @@ packages:
       tslib: 2.6.0
     dev: false
 
+  /@react-spring/animated@9.7.3(react@18.2.0):
+    resolution: {integrity: sha512-5CWeNJt9pNgyvuSzQH+uy2pvTg8Y4/OisoscZIR8/ZNLIOI+CatFBhGZpDGTF/OzdNFsAoGk3wiUYTwoJ0YIvw==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@react-spring/shared': 9.7.3(react@18.2.0)
+      '@react-spring/types': 9.7.3
+      react: 18.2.0
+    dev: false
+
+  /@react-spring/core@9.7.3(react@18.2.0):
+    resolution: {integrity: sha512-IqFdPVf3ZOC1Cx7+M0cXf4odNLxDC+n7IN3MDcVCTIOSBfqEcBebSv+vlY5AhM0zw05PDbjKrNmBpzv/AqpjnQ==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@react-spring/animated': 9.7.3(react@18.2.0)
+      '@react-spring/shared': 9.7.3(react@18.2.0)
+      '@react-spring/types': 9.7.3
+      react: 18.2.0
+    dev: false
+
+  /@react-spring/shared@9.7.3(react@18.2.0):
+    resolution: {integrity: sha512-NEopD+9S5xYyQ0pGtioacLhL2luflh6HACSSDUZOwLHoxA5eku1UPuqcJqjwSD6luKjjLfiLOspxo43FUHKKSA==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@react-spring/types': 9.7.3
+      react: 18.2.0
+    dev: false
+
+  /@react-spring/types@9.7.3:
+    resolution: {integrity: sha512-Kpx/fQ/ZFX31OtlqVEFfgaD1ACzul4NksrvIgYfIFq9JpDHFwQkMVZ10tbo0FU/grje4rcL4EIrjekl3kYwgWw==}
+    dev: false
+
+  /@react-spring/web@9.7.3(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-BXt6BpS9aJL/QdVqEIX9YoUy8CE6TJrU0mNCqSoxdXlIeNcEBWOfIyE6B14ENNsyQKS3wOWkiJfco0tCr/9tUg==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+      react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      '@react-spring/animated': 9.7.3(react@18.2.0)
+      '@react-spring/core': 9.7.3(react@18.2.0)
+      '@react-spring/shared': 9.7.3(react@18.2.0)
+      '@react-spring/types': 9.7.3
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /@rushstack/eslint-patch@1.3.2:
     resolution: {integrity: sha512-V+MvGwaHH03hYhY+k6Ef/xKd6RYlc4q8WBx+2ANmipHJcKuktNcI/NgEsJgdSUF6Lw32njT6OnrRsKYCdgHjYw==}
     dev: false

website/shared/outline.json

@@ -0,0 +1,83 @@
+{
+  "pages": [
+    {
+      "name": "Home",
+      "route": "/",
+      "sections": [
+        { "name": "Introduction", "id": "#introduction" },
+        {
+          "name": "Education and Professional Experience",
+          "id": "#eduandproexp"
+        },
+        {
+          "name": "Board Certifications and Fellowships",
+          "id": "#certsandfellows"
+        },
+        {
+          "name": "Academic Work",
+          "id": "#academicwork"
+        }
+      ]
+    },
+    {
+      "name": "Osteopathy",
+      "route": "/osteopathy",
+      "sections": [
+        { "name": "Basics", "id": "#osteobasics" },
+        {
+          "name": "Pediatric Care",
+          "id": "#pediatriccare"
+        },
+        {
+          "name": "For Doctors",
+          "id": "#osteofordocs"
+        }
+      ]
+    },
+    {
+      "name": "Accupuncture",
+      "route": "/accupuncture",
+      "sections": [
+        { "name": "Basics and History", "route": "/#basicsandhist" },
+        {
+          "name": "Ear Accupuncture",
+          "id": "#earaccupuncture"
+        },
+        {
+          "name": "Scalp Accupuncture",
+          "id": "#scalpaccupuncture"
+        },
+        {
+          "name": "For Doctors",
+          "id": "#accufordocs"
+        }
+      ]
+    },
+    {
+      "name": "Articles",
+      "route": "/articles",
+      "sections": [
+        { "name": "For Patients", "id": "/#artsforpatients" },
+        {
+          "name": "For Doctors",
+          "id": "/#artsfordoctors"
+        }
+      ]
+    },
+    {
+      "name": "Neuro Ocular Release",
+      "route": "/nor",
+      "sections": [
+        { "name": "NOR", "id": "/#nor" },
+        {
+          "name": "Articles",
+          "id": "/#norarticles"
+        },
+        {
+          "name": "Videos",
+          "id": "/#norvideos"
+        }
+      ]
+    }
+  ]
+}