diff --git a/website/src/components/HomepageContent/index.js b/website/src/components/HomepageContent/index.js
index ff14238..a4e4378 100644
--- a/website/src/components/HomepageContent/index.js
+++ b/website/src/components/HomepageContent/index.js
@@ -1,58 +1,56 @@
-import React from 'react';
-import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
-import HomeIntro from './HomeIntro.mdx';
-import ProjectOverview from './ProjectOverview.md';
-import Supporters from './Supporters.md';
-import ProjectGridTemplate from '@site/src/components/ProjectGridTemplate';
-import styles from './styles.module.css';
+import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
+import HomeIntro from "./HomeIntro.mdx";
+import ProjectOverview from "./ProjectOverview.md";
+import Supporters from "./Supporters.md";
+import ProjectGridTemplate from "@site/src/components/ProjectGridTemplate";
+import styles from "./styles.module.css";
 
 export default function HomepageContent() {
-    // Get baseUrl from Docusaurus context
-    const { siteConfig } = useDocusaurusContext();
-    const { baseUrl } = siteConfig;
+  // Get baseUrl from Docusaurus context
+  const { siteConfig } = useDocusaurusContext();
+  const { baseUrl } = siteConfig;
 
-    return (
-        <main>
-            <section className={styles.sectionContainer}>
-                <div
-                    className={styles.sectionHeader}
-                    style={{ marginBottom: '15px', marginTop: '15px' }}
-                >
-                </div>
-                <div className={styles.sectionIntro}>
-                    <HomeIntro />
-                </div>
-            </section>
+  return (
+    <main>
+      <section className={styles.sectionContainer}>
+        <div
+          className={styles.sectionHeader}
+          style={{ marginBottom: "15px", marginTop: "15px" }}
+        ></div>
+        <div className={styles.sectionIntro}>
+          <HomeIntro />
+        </div>
+      </section>
 
-            <section className={styles.sectionContainer}>
-                <div
-                    className={styles.sectionHeader}
-                    style={{ marginBottom: '15px', marginTop: '15px' }}
-                >
-                    <h1>AboutCode Projects Overview</h1>
-                </div>
+      <section className={styles.sectionContainer}>
+        <div
+          className={styles.sectionHeader}
+          style={{ marginBottom: "15px", marginTop: "15px" }}
+        >
+          <h1>AboutCode Projects Overview</h1>
+        </div>
 
-                <div className={styles.sectionIntro}>
-                    <ProjectOverview />
-                </div>
+        <div className={styles.sectionIntro}>
+          <ProjectOverview />
+        </div>
 
-                <ProjectGridTemplate />
-            </section>
+        <ProjectGridTemplate />
+      </section>
 
-            <section className={styles.sectionContainer}>
-                <div
-                    className={styles.sectionHeader}
-                    style={{ marginBottom: '15px', marginTop: '30px' }}
-                >
-                    <h1>Supporters</h1>
-                </div>
-                <div className={styles.sectionIntro}>
-                    <Supporters />
-                </div>
-            </section>
+      <section className={styles.sectionContainer}>
+        <div
+          className={styles.sectionHeader}
+          style={{ marginBottom: "15px", marginTop: "30px" }}
+        >
+          <h1>Supporters</h1>
+        </div>
+        <div className={styles.sectionIntro}>
+          <Supporters />
+        </div>
+      </section>
 
-            {/* temp dummy div to create space above footer */}
-            <div style={{ marginBottom: '50px' }}></div>
-        </main>
-    );
+      {/* temp dummy div to create space above footer */}
+      <div style={{ marginBottom: "50px" }}></div>
+    </main>
+  );
 }
diff --git a/website/src/components/HomepageHeader/index.js b/website/src/components/HomepageHeader/index.js
index 6a783d5..fa6a448 100644
--- a/website/src/components/HomepageHeader/index.js
+++ b/website/src/components/HomepageHeader/index.js
@@ -1,16 +1,11 @@
-import React from 'react';
-import styles from './styles.module.css';
+import styles from "./styles.module.css";
 
 export default function HomepageHeader() {
   return (
     <div className={styles.fullHero}>
       <div className={styles.heroInner}>
-        <h1 className={styles.heroTitle}>
-          Welcome to AboutCode.org
-        </h1>
-        <p className={styles.heroSubtitle}>
-          FOSS for FOSS
-        </p>
+        <h1 className={styles.heroTitle}>Welcome to AboutCode.org</h1>
+        <p className={styles.heroSubtitle}>FOSS for FOSS</p>
       </div>
     </div>
   );
diff --git a/website/src/components/ProjectGridTemplate/index.js b/website/src/components/ProjectGridTemplate/index.js
index daa471e..214b7db 100644
--- a/website/src/components/ProjectGridTemplate/index.js
+++ b/website/src/components/ProjectGridTemplate/index.js
@@ -1,635 +1,487 @@
-import React, { useState, useEffect } from 'react';
-import styles from './styles.module.css';
-import projects_application from '@site/src/data/projects-application.json';
-import projects_scancode from '@site/src/data/projects-scancode.json';
-import projects_package_url from '@site/src/data/projects-package-url.json';
-import projects_inspectors from '@site/src/data/projects-inspectors.json';
-import projects_libraries from '@site/src/data/projects-libraries.json';
+import React, { useState, useEffect } from "react";
+import styles from "./styles.module.css";
+import projects_application from "@site/src/data/projects-application.json";
+import projects_scancode from "@site/src/data/projects-scancode.json";
+import projects_package_url from "@site/src/data/projects-package-url.json";
+import projects_inspectors from "@site/src/data/projects-inspectors.json";
+import projects_libraries from "@site/src/data/projects-libraries.json";
 
 export default function ProjectGrids() {
-    const [selectedProject, setSelectedProject] = useState(null);
-    const [isModalOpen, setIsModalOpen] = useState(false);
-    const [message, setMessage] = useState('');
-    const [modalMessage, setModalMessage] = useState('');
-
-    // list of data sources
-    const projectSources = [
-        {
-            id: 'application-projects',
-            title: 'Application Projects',
-            data: projects_application,
-            description:
-                'These projects offer an application that you can install in the cloud or a local environment.',
-        },
-        {
-            id: 'scancode-projects',
-            title: 'ScanCode projects',
-            data: projects_scancode,
-            description:
-                'These projects are components or extensions of ScanCode.',
-        },
-        {
-            id: 'purl-projects',
-            title: 'Package-URL (PURL) projects',
-            data: projects_package_url,
-            description:
-                'These projects provide tools and data to support the use of the PURL (Package-URL) or VERS (Version Range Specifier) specifications.',
-        },
-        {
-            id: 'inspectors',
-            title: 'Inspectors',
-            data: projects_inspectors,
-            description:
-                'AboutCode Inspectors are special-purpose analysis tools. You can run them as a ScanCode Toolkit plugin, as steps in a ScanCode.io pipeline, or from the command line.',
-        },
-        {
-            id: 'libraries',
-            title: 'Libraries',
-            data: projects_libraries,
-            description:
-                'AboutCode libraries are key building blocks for the AboutCode software and data stack - they have also been incorporated into other major FOSS projects and are available for use by anyone.',
-        },
-    ];
-
-    const openModal = (project) => {
-        setSelectedProject(project);
-        setIsModalOpen(true);
-    };
-
-    const closeModal = () => {
+  const [selectedProject, setSelectedProject] = useState(null);
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const [message, setMessage] = useState("");
+  const [modalMessage, setModalMessage] = useState("");
+
+  // list of data sources
+  const projectSources = [
+    {
+      id: "application-projects",
+      title: "Application Projects",
+      data: projects_application,
+      description:
+        "These projects offer an application that you can install in the cloud or a local environment.",
+    },
+    {
+      id: "scancode-projects",
+      title: "ScanCode projects",
+      data: projects_scancode,
+      description: "These projects are components or extensions of ScanCode.",
+    },
+    {
+      id: "purl-projects",
+      title: "Package-URL (PURL) projects",
+      data: projects_package_url,
+      description:
+        "These projects provide tools and data to support the use of the PURL (Package-URL) or VERS (Version Range Specifier) specifications.",
+    },
+    {
+      id: "inspectors",
+      title: "Inspectors",
+      data: projects_inspectors,
+      description:
+        "AboutCode Inspectors are special-purpose analysis tools. You can run them as a ScanCode Toolkit plugin, as steps in a ScanCode.io pipeline, or from the command line.",
+    },
+    {
+      id: "libraries",
+      title: "Libraries",
+      data: projects_libraries,
+      description:
+        "AboutCode libraries are key building blocks for the AboutCode software and data stack - they have also been incorporated into other major FOSS projects and are available for use by anyone.",
+    },
+  ];
+
+  const openModal = (project) => {
+    setSelectedProject(project);
+    setIsModalOpen(true);
+  };
+
+  const closeModal = () => {
+    setSelectedProject(null);
+    setIsModalOpen(false);
+  };
+
+  // Close modal on Escape key
+  useEffect(() => {
+    function handleKeyDown(event) {
+      if (event.key === "Escape") {
         setSelectedProject(null);
-        setIsModalOpen(false);
+      }
+    }
+    if (selectedProject) {
+      window.addEventListener("keydown", handleKeyDown);
+    }
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
     };
-
-    // Close modal on Escape key
-    useEffect(() => {
-        function handleKeyDown(event) {
-            if (event.key === 'Escape') {
-                setSelectedProject(null);
-            }
-        }
-        if (selectedProject) {
-            window.addEventListener('keydown', handleKeyDown);
-        }
-        return () => {
-            window.removeEventListener('keydown', handleKeyDown);
-        };
-    }, [selectedProject]);
-
-    // Add tooltip to card and modal.
-    function DescriptionWithTooltip({ text }) {
-        const descRef = React.useRef(null);
-        const [showTooltip, setShowTooltip] = React.useState(false);
-
-        React.useEffect(() => {
-            const el = descRef.current;
-            if (el) {
-                // check if content is overflowing its container
-                setShowTooltip(
-                    el.scrollHeight > el.clientHeight ||
-                        el.scrollWidth > el.clientWidth,
-                );
-            }
-        }, [text]);
-
-        return (
-            <div className={styles.projectDescriptionWrapper}>
-                <div
-                    ref={descRef}
-                    className={`${styles.projectDescription} ${styles.multiline}`}
-                >
-                    {text}
-                </div>
-                {showTooltip && <div className={styles.tooltip}>{text}</div>}
-            </div>
+  }, [selectedProject]);
+
+  // Add tooltip to card and modal.
+  function DescriptionWithTooltip({ text }) {
+    const descRef = React.useRef(null);
+    const [showTooltip, setShowTooltip] = React.useState(false);
+
+    React.useEffect(() => {
+      const el = descRef.current;
+      if (el) {
+        // check if content is overflowing its container
+        setShowTooltip(
+          el.scrollHeight > el.clientHeight || el.scrollWidth > el.clientWidth,
         );
-    }
+      }
+    }, [text]);
 
-    function normalizeToArray(value) {
-        const INVALID_VALUES = new Set(['Not available', 'Not applicable']);
+    return (
+      <div className={styles.projectDescriptionWrapper}>
+        <div
+          ref={descRef}
+          className={`${styles.projectDescription} ${styles.multiline}`}
+        >
+          {text}
+        </div>
+        {showTooltip && <div className={styles.tooltip}>{text}</div>}
+      </div>
+    );
+  }
 
-        if (Array.isArray(value)) {
-            return value.filter(
-                (v) => typeof v === 'string' && !INVALID_VALUES.has(v),
-            );
-        }
+  function normalizeToArray(value) {
+    const INVALID_VALUES = new Set(["Not available", "Not applicable"]);
 
-        if (typeof value === 'string' && !INVALID_VALUES.has(value)) {
-            return [value];
-        }
+    if (Array.isArray(value)) {
+      return value.filter(
+        (v) => typeof v === "string" && !INVALID_VALUES.has(v),
+      );
+    }
 
-        return [];
+    if (typeof value === "string" && !INVALID_VALUES.has(value)) {
+      return [value];
     }
 
-    const leadMaintainers = normalizeToArray(selectedProject?.lead_maintainer);
+    return [];
+  }
 
-    const packageDownloadUrls = normalizeToArray(
-        selectedProject?.package_download_url,
-    );
+  const leadMaintainers = normalizeToArray(selectedProject?.lead_maintainer);
 
-    return (
-        <div className={styles.projectGridWrapper01}>
-            {/* Iterate through each data source */}
-            {projectSources.map((source, sourceIdx) => (
-                <div key={sourceIdx} className={styles.gridSection}>
-                    {/* Add a heading for each grid */}
-                    <div className={styles.sectionTitle}>
-                        {/* <h2>{source.title}</h2> */}
-                        <h2 id={source.id}>{source.title}</h2>
-                    </div>
+  const packageDownloadUrls = normalizeToArray(
+    selectedProject?.package_download_url,
+  );
 
-                    <div className={styles.sectionIntro}>
-                        {source.description}
-                    </div>
+  return (
+    <div className={styles.projectGridWrapper01}>
+      {/* Iterate through each data source */}
+      {projectSources.map((source, sourceIdx) => (
+        <div key={sourceIdx} className={styles.gridSection}>
+          {/* Add a heading for each grid */}
+          <div className={styles.sectionTitle}>
+            {/* <h2>{source.title}</h2> */}
+            <h2 id={source.id}>{source.title}</h2>
+          </div>
 
-                    <div className={styles.projectGridContainer01}>
-                        <div className={styles.projectGrid}>
-                            {/* Iterate through each JSON object (project) in the .json file and create the main card */}
-                            {source.data.map((project, idx) => (
-                                <div
-                                    key={idx}
-                                    className={styles.projectCard}
-                                    onClick={() => openModal(project)}
-                                >
-                                    <div>
-                                        <div className={styles.topRow}>
-                                            <h4 className={styles.projectName}>
-                                                {project.name}
-                                            </h4>
-                                            <div className={styles.logoWrapper}>
-                                                <img
-                                                    src='./img/link.svg'
-                                                    alt='logo'
-                                                    className={styles.logoImg}
-                                                />
-                                            </div>
-                                        </div>
-                                    </div>
-
-                                    <div>
-                                        <div
-                                            className={
-                                                styles.projectDescriptionWrapper
-                                            }
-                                        >
-                                            <DescriptionWithTooltip
-                                                text={project.description.map(
-                                                    (para, idx) => (
-                                                        <p key={idx}>{para}</p>
-                                                    ),
-                                                )}
-                                            />
-                                        </div>
-                                    </div>
-
-                                    <div className={styles.modalLinks01}>
-                                        {project.documentation_url &&
-                                            project.documentation_url !==
-                                                'Not applicable' &&
-                                            project.documentation_url !==
-                                                'Not available' && (
-                                                <div
-                                                    className={
-                                                        styles.modalLinks01
-                                                    }
-                                                >
-                                                    <span
-                                                        style={{
-                                                            fontWeight: 'bold',
-                                                        }}
-                                                    >
-                                                        Documentation URL:{' '}
-                                                    </span>
-                                                    <a
-                                                        href={
-                                                            project.documentation_url
-                                                        }
-                                                        target='_blank'
-                                                        rel='noopener noreferrer'
-                                                        className={
-                                                            styles.modalLinkUrl
-                                                        }
-                                                        onClick={(e) =>
-                                                            e.stopPropagation()
-                                                        }
-                                                    >
-                                                        {
-                                                            project.documentation_url
-                                                        }
-                                                    </a>
-                                                </div>
-                                            )}
-                                    </div>
-
-                                    <div className={styles.modalLinks01}>
-                                        {project.repository_url &&
-                                            project.repository_url !==
-                                                'Not applicable' &&
-                                            project.repository_url !==
-                                                'Not available' && (
-                                                <div
-                                                    className={
-                                                        styles.modalLinks01
-                                                    }
-                                                >
-                                                    <span
-                                                        style={{
-                                                            fontWeight: 'bold',
-                                                        }}
-                                                    >
-                                                        Repository URL:{' '}
-                                                    </span>
-                                                    <a
-                                                        href={
-                                                            project.repository_url
-                                                        }
-                                                        target='_blank'
-                                                        rel='noopener noreferrer'
-                                                        className={
-                                                            styles.modalLinkUrl
-                                                        }
-                                                        onClick={(e) =>
-                                                            e.stopPropagation()
-                                                        }
-                                                    >
-                                                        {project.repository_url}
-                                                    </a>
-                                                </div>
-                                            )}
-                                    </div>
-
-                                    <div className={styles.modalLinks01}>
-                                        {project.service_url &&
-                                            project.service_url !==
-                                                'Not applicable' &&
-                                            project.service_url !==
-                                                'Not available' && (
-                                                <div
-                                                    className={
-                                                        styles.modalLinks01
-                                                    }
-                                                >
-                                                    <span
-                                                        style={{
-                                                            fontWeight: 'bold',
-                                                        }}
-                                                    >
-                                                        Service URL:{' '}
-                                                    </span>
-                                                    <a
-                                                        href={
-                                                            project.service_url
-                                                        }
-                                                        target='_blank'
-                                                        rel='noopener noreferrer'
-                                                        className={
-                                                            styles.modalLinkUrl
-                                                        }
-                                                        onClick={(e) =>
-                                                            e.stopPropagation()
-                                                        }
-                                                    >
-                                                        {project.service_url}
-                                                    </a>
-                                                </div>
-                                            )}
-                                    </div>
-                                </div>
-                            ))}
-                        </div>
+          <div className={styles.sectionIntro}>{source.description}</div>
+
+          <div className={styles.projectGridContainer01}>
+            <div className={styles.projectGrid}>
+              {/* Iterate through each JSON object (project) in the .json file and create the main card */}
+              {source.data.map((project, idx) => (
+                <div
+                  key={idx}
+                  className={styles.projectCard}
+                  onClick={() => openModal(project)}
+                >
+                  <div>
+                    <div className={styles.topRow}>
+                      <h4 className={styles.projectName}>{project.name}</h4>
+                      <div className={styles.logoWrapper}>
+                        <img
+                          src="./img/link.svg"
+                          alt="logo"
+                          className={styles.logoImg}
+                        />
+                      </div>
+                    </div>
+                  </div>
+
+                  <div>
+                    <div className={styles.projectDescriptionWrapper}>
+                      <DescriptionWithTooltip
+                        text={project.description.map((para, idx) => (
+                          <p key={idx}>{para}</p>
+                        ))}
+                      />
                     </div>
+                  </div>
+
+                  <div className={styles.modalLinks01}>
+                    {project.documentation_url &&
+                      project.documentation_url !== "Not applicable" &&
+                      project.documentation_url !== "Not available" && (
+                        <div className={styles.modalLinks01}>
+                          <span
+                            style={{
+                              fontWeight: "bold",
+                            }}
+                          >
+                            Documentation URL:{" "}
+                          </span>
+                          <a
+                            href={project.documentation_url}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className={styles.modalLinkUrl}
+                            onClick={(e) => e.stopPropagation()}
+                          >
+                            {project.documentation_url}
+                          </a>
+                        </div>
+                      )}
+                  </div>
+
+                  <div className={styles.modalLinks01}>
+                    {project.repository_url &&
+                      project.repository_url !== "Not applicable" &&
+                      project.repository_url !== "Not available" && (
+                        <div className={styles.modalLinks01}>
+                          <span
+                            style={{
+                              fontWeight: "bold",
+                            }}
+                          >
+                            Repository URL:{" "}
+                          </span>
+                          <a
+                            href={project.repository_url}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className={styles.modalLinkUrl}
+                            onClick={(e) => e.stopPropagation()}
+                          >
+                            {project.repository_url}
+                          </a>
+                        </div>
+                      )}
+                  </div>
+
+                  <div className={styles.modalLinks01}>
+                    {project.service_url &&
+                      project.service_url !== "Not applicable" &&
+                      project.service_url !== "Not available" && (
+                        <div className={styles.modalLinks01}>
+                          <span
+                            style={{
+                              fontWeight: "bold",
+                            }}
+                          >
+                            Service URL:{" "}
+                          </span>
+                          <a
+                            href={project.service_url}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className={styles.modalLinkUrl}
+                            onClick={(e) => e.stopPropagation()}
+                          >
+                            {project.service_url}
+                          </a>
+                        </div>
+                      )}
+                  </div>
+                </div>
+              ))}
+            </div>
+          </div>
+        </div>
+      ))}
+
+      {/* Popup message - shared across all grids */}
+      {!isModalOpen && message && (
+        <div className={styles.modalAlertOverlay_main}>{message}</div>
+      )}
+
+      {/* Modal - shared across all grids */}
+      {selectedProject && (
+        <div className={styles.modalBackdrop} onClick={closeModal}>
+          <div
+            className={styles.modalContent}
+            onClick={(e) => e.stopPropagation()}
+          >
+            <div className={styles.modalBody}>
+              <>
+                <div className={styles.fullWidthSection}>
+                  <h2>{selectedProject.name}</h2>
+                  <p>
+                    {selectedProject.description.map((para, idx) => (
+                      <p key={idx}>{para}</p>
+                    ))}
+                  </p>
                 </div>
-            ))}
-
-            {/* Popup message - shared across all grids */}
-            {!isModalOpen && message && (
-                <div className={styles.modalAlertOverlay_main}>{message}</div>
-            )}
 
-            {/* Modal - shared across all grids */}
-            {selectedProject && (
-                <div className={styles.modalBackdrop} onClick={closeModal}>
-                    <div
-                        className={styles.modalContent}
-                        onClick={(e) => e.stopPropagation()}
-                    >
-                        <div className={styles.modalBody}>
-                            <>
-                                <div className={styles.fullWidthSection}>
-                                    <h2>{selectedProject.name}</h2>
-                                    <p>
-                                        {selectedProject.description.map(
-                                            (para, idx) => (
-                                                <p key={idx}>{para}</p>
-                                            ),
-                                        )}
-                                    </p>
-                                </div>
-
-                                <div className={styles.column}>
-                                    <div>
-                                        {selectedProject.repository_url &&
-                                            selectedProject.repository_url !==
-                                                'Not applicable' &&
-                                            selectedProject.repository_url !==
-                                                'Not available' && (
-                                                <div
-                                                    className={
-                                                        styles.modalLinks01
-                                                    }
-                                                >
-                                                    <span
-                                                        style={{
-                                                            fontWeight: 'bold',
-                                                        }}
-                                                    >
-                                                        Repository URL:{' '}
-                                                    </span>
-                                                    <a
-                                                        href={
-                                                            selectedProject.repository_url
-                                                        }
-                                                        target='_blank'
-                                                        rel='noopener noreferrer'
-                                                        className={
-                                                            styles.modalLinkUrl
-                                                        }
-                                                    >
-                                                        {
-                                                            selectedProject.repository_url
-                                                        }
-                                                    </a>
-                                                </div>
-                                            )}
-                                    </div>
-
-                                    <div>
-                                        {packageDownloadUrls.length > 0 && (
-                                            <div
-                                                className={styles.modalLinks01}
-                                            >
-                                                <span
-                                                    style={{
-                                                        fontWeight: 'bold',
-                                                    }}
-                                                >
-                                                    Package Download URL
-                                                    {packageDownloadUrls.length >
-                                                    1
-                                                        ? 's'
-                                                        : ''}
-                                                    :{' '}
-                                                </span>
-                                                <ul
-                                                    className={
-                                                        styles.packageDownloadUrlList
-                                                    }
-                                                >
-                                                    {packageDownloadUrls.map(
-                                                        (url, idx) => (
-                                                            <li key={idx}>
-                                                                <a
-                                                                    href={url}
-                                                                    target='_blank'
-                                                                    rel='noopener noreferrer'
-                                                                    className={
-                                                                        styles.modalLinkUrl
-                                                                    }
-                                                                >
-                                                                    {url}
-                                                                </a>
-                                                            </li>
-                                                        ),
-                                                    )}
-                                                </ul>
-                                            </div>
-                                        )}
-                                    </div>
-
-                                    <div>
-                                        {selectedProject.documentation_url &&
-                                            selectedProject.documentation_url !==
-                                                'Not applicable' &&
-                                            selectedProject.documentation_url !==
-                                                'Not available' && (
-                                                <div
-                                                    className={
-                                                        styles.modalLinks01
-                                                    }
-                                                >
-                                                    <span
-                                                        style={{
-                                                            fontWeight: 'bold',
-                                                        }}
-                                                    >
-                                                        Documentation URL:{' '}
-                                                    </span>
-                                                    <a
-                                                        href={
-                                                            selectedProject.documentation_url
-                                                        }
-                                                        target='_blank'
-                                                        rel='noopener noreferrer'
-                                                        className={
-                                                            styles.modalLinkUrl
-                                                        }
-                                                    >
-                                                        {
-                                                            selectedProject.documentation_url
-                                                        }
-                                                    </a>
-                                                </div>
-                                            )}
-                                    </div>
-
-                                    <div>
-                                        {selectedProject.service_url &&
-                                            selectedProject.service_url !==
-                                                'Not applicable' &&
-                                            selectedProject.service_url !==
-                                                'Not available' && (
-                                                <div
-                                                    className={
-                                                        styles.modalLinks01
-                                                    }
-                                                >
-                                                    <span
-                                                        style={{
-                                                            fontWeight: 'bold',
-                                                        }}
-                                                    >
-                                                        Service URL:{' '}
-                                                    </span>
-                                                    <a
-                                                        href={
-                                                            selectedProject.service_url
-                                                        }
-                                                        target='_blank'
-                                                        rel='noopener noreferrer'
-                                                        className={
-                                                            styles.modalLinkUrl
-                                                        }
-                                                    >
-                                                        {
-                                                            selectedProject.service_url
-                                                        }
-                                                    </a>
-                                                </div>
-                                            )}
-                                    </div>
-
-                                    <div>
-                                        {selectedProject.languages &&
-                                            selectedProject.languages !==
-                                                'Not applicable' &&
-                                            selectedProject.languages !==
-                                                'Not available' && (
-                                                <div
-                                                    className={
-                                                        styles.modalLinks01
-                                                    }
-                                                >
-                                                    <span
-                                                        style={{
-                                                            fontWeight: 'bold',
-                                                        }}
-                                                    >
-                                                        Language(s):{' '}
-                                                    </span>
-                                                    {selectedProject.languages}
-                                                </div>
-                                            )}
-                                    </div>
-
-                                    <div>
-                                        {selectedProject.platform &&
-                                            selectedProject.platform !==
-                                                'Not applicable' &&
-                                            selectedProject.platform !==
-                                                'Not available' && (
-                                                <div
-                                                    className={
-                                                        styles.modalLinks01
-                                                    }
-                                                >
-                                                    <span
-                                                        style={{
-                                                            fontWeight: 'bold',
-                                                        }}
-                                                    >
-                                                        Platform:{' '}
-                                                    </span>
-                                                    {selectedProject.platform}
-                                                </div>
-                                            )}
-                                    </div>
-
-                                    <div>
-                                        {selectedProject.software_license &&
-                                            selectedProject.software_license !==
-                                                'Not applicable' &&
-                                            selectedProject.software_license !==
-                                                'Not available' && (
-                                                <div
-                                                    className={
-                                                        styles.modalLinks01
-                                                    }
-                                                >
-                                                    <span
-                                                        style={{
-                                                            fontWeight: 'bold',
-                                                        }}
-                                                    >
-                                                        Software License:{' '}
-                                                    </span>
-                                                    {
-                                                        selectedProject.software_license
-                                                    }
-                                                </div>
-                                            )}
-                                    </div>
-
-                                    <div>
-                                        {selectedProject.data_license &&
-                                            selectedProject.data_license !==
-                                                'Not applicable' &&
-                                            selectedProject.data_license !==
-                                                'Not available' && (
-                                                <div
-                                                    className={
-                                                        styles.modalLinks01
-                                                    }
-                                                >
-                                                    <span
-                                                        style={{
-                                                            fontWeight: 'bold',
-                                                        }}
-                                                    >
-                                                        Data License:{' '}
-                                                    </span>
-                                                    {
-                                                        selectedProject.data_license
-                                                    }
-                                                </div>
-                                            )}
-                                    </div>
-
-                                    {leadMaintainers.length > 0 && (
-                                        <div className={styles.modalLinks01}>
-                                            <span
-                                                style={{ fontWeight: 'bold' }}
-                                            >
-                                                Lead Maintainer
-                                                {leadMaintainers.length > 1
-                                                    ? 's'
-                                                    : ''}
-                                                :{' '}
-                                            </span>
-                                            <ul
-                                                className={
-                                                    styles.maintainerList
-                                                }
-                                            >
-                                                {leadMaintainers.map(
-                                                    (url, idx) => (
-                                                        <li key={idx}>
-                                                            <a
-                                                                href={url}
-                                                                target='_blank'
-                                                                rel='noopener noreferrer'
-                                                                className={
-                                                                    styles.modalLinkUrl
-                                                                }
-                                                            >
-                                                                {url}
-                                                            </a>
-                                                        </li>
-                                                    ),
-                                                )}
-                                            </ul>
-                                        </div>
-                                    )}
-                                </div>
-                            </>
+                <div className={styles.column}>
+                  <div>
+                    {selectedProject.repository_url &&
+                      selectedProject.repository_url !== "Not applicable" &&
+                      selectedProject.repository_url !== "Not available" && (
+                        <div className={styles.modalLinks01}>
+                          <span
+                            style={{
+                              fontWeight: "bold",
+                            }}
+                          >
+                            Repository URL:{" "}
+                          </span>
+                          <a
+                            href={selectedProject.repository_url}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className={styles.modalLinkUrl}
+                          >
+                            {selectedProject.repository_url}
+                          </a>
                         </div>
-
-                        <div className={styles.modalFooter}>
-                            <button
-                                className={styles.closeButton}
-                                onClick={closeModal}
-                            >
-                                Close
-                            </button>
+                      )}
+                  </div>
+
+                  <div>
+                    {packageDownloadUrls.length > 0 && (
+                      <div className={styles.modalLinks01}>
+                        <span
+                          style={{
+                            fontWeight: "bold",
+                          }}
+                        >
+                          Package Download URL
+                          {packageDownloadUrls.length > 1 ? "s" : ""}:{" "}
+                        </span>
+                        <ul className={styles.packageDownloadUrlList}>
+                          {packageDownloadUrls.map((url, idx) => (
+                            <li key={idx}>
+                              <a
+                                href={url}
+                                target="_blank"
+                                rel="noopener noreferrer"
+                                className={styles.modalLinkUrl}
+                              >
+                                {url}
+                              </a>
+                            </li>
+                          ))}
+                        </ul>
+                      </div>
+                    )}
+                  </div>
+
+                  <div>
+                    {selectedProject.documentation_url &&
+                      selectedProject.documentation_url !== "Not applicable" &&
+                      selectedProject.documentation_url !== "Not available" && (
+                        <div className={styles.modalLinks01}>
+                          <span
+                            style={{
+                              fontWeight: "bold",
+                            }}
+                          >
+                            Documentation URL:{" "}
+                          </span>
+                          <a
+                            href={selectedProject.documentation_url}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className={styles.modalLinkUrl}
+                          >
+                            {selectedProject.documentation_url}
+                          </a>
                         </div>
-
-                        {modalMessage && (
-                            <div className={styles.modalAlertOverlay}>
-                                {modalMessage}
-                            </div>
-                        )}
+                      )}
+                  </div>
+
+                  <div>
+                    {selectedProject.service_url &&
+                      selectedProject.service_url !== "Not applicable" &&
+                      selectedProject.service_url !== "Not available" && (
+                        <div className={styles.modalLinks01}>
+                          <span
+                            style={{
+                              fontWeight: "bold",
+                            }}
+                          >
+                            Service URL:{" "}
+                          </span>
+                          <a
+                            href={selectedProject.service_url}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className={styles.modalLinkUrl}
+                          >
+                            {selectedProject.service_url}
+                          </a>
+                        </div>
+                      )}
+                  </div>
+
+                  <div>
+                    {selectedProject.languages &&
+                      selectedProject.languages !== "Not applicable" &&
+                      selectedProject.languages !== "Not available" && (
+                        <div className={styles.modalLinks01}>
+                          <span
+                            style={{
+                              fontWeight: "bold",
+                            }}
+                          >
+                            Language(s):{" "}
+                          </span>
+                          {selectedProject.languages}
+                        </div>
+                      )}
+                  </div>
+
+                  <div>
+                    {selectedProject.platform &&
+                      selectedProject.platform !== "Not applicable" &&
+                      selectedProject.platform !== "Not available" && (
+                        <div className={styles.modalLinks01}>
+                          <span
+                            style={{
+                              fontWeight: "bold",
+                            }}
+                          >
+                            Platform:{" "}
+                          </span>
+                          {selectedProject.platform}
+                        </div>
+                      )}
+                  </div>
+
+                  <div>
+                    {selectedProject.software_license &&
+                      selectedProject.software_license !== "Not applicable" &&
+                      selectedProject.software_license !== "Not available" && (
+                        <div className={styles.modalLinks01}>
+                          <span
+                            style={{
+                              fontWeight: "bold",
+                            }}
+                          >
+                            Software License:{" "}
+                          </span>
+                          {selectedProject.software_license}
+                        </div>
+                      )}
+                  </div>
+
+                  <div>
+                    {selectedProject.data_license &&
+                      selectedProject.data_license !== "Not applicable" &&
+                      selectedProject.data_license !== "Not available" && (
+                        <div className={styles.modalLinks01}>
+                          <span
+                            style={{
+                              fontWeight: "bold",
+                            }}
+                          >
+                            Data License:{" "}
+                          </span>
+                          {selectedProject.data_license}
+                        </div>
+                      )}
+                  </div>
+
+                  {leadMaintainers.length > 0 && (
+                    <div className={styles.modalLinks01}>
+                      <span style={{ fontWeight: "bold" }}>
+                        Lead Maintainer
+                        {leadMaintainers.length > 1 ? "s" : ""}:{" "}
+                      </span>
+                      <ul className={styles.maintainerList}>
+                        {leadMaintainers.map((url, idx) => (
+                          <li key={idx}>
+                            <a
+                              href={url}
+                              target="_blank"
+                              rel="noopener noreferrer"
+                              className={styles.modalLinkUrl}
+                            >
+                              {url}
+                            </a>
+                          </li>
+                        ))}
+                      </ul>
                     </div>
+                  )}
                 </div>
+              </>
+            </div>
+
+            <div className={styles.modalFooter}>
+              <button className={styles.closeButton} onClick={closeModal}>
+                Close
+              </button>
+            </div>
+
+            {modalMessage && (
+              <div className={styles.modalAlertOverlay}>{modalMessage}</div>
             )}
+          </div>
         </div>
-    );
+      )}
+    </div>
+  );
 }
diff --git a/website/src/components/archive/ProjectGrid/index-new.js b/website/src/components/archive/ProjectGrid/index-new.js
index 9edbd3d..844e6b6 100644
--- a/website/src/components/archive/ProjectGrid/index-new.js
+++ b/website/src/components/archive/ProjectGrid/index-new.js
@@ -1,313 +1,272 @@
 // 2025-11-22 Saturday 09:58:08.  From ToolGrid
-import React, { useState, useEffect } from 'react';
-import styles from './styles.module.css';
+import { useState, useEffect } from "react";
+import styles from "./styles.module.css";
 // import projects from '@site/src/data/projects-v02.json';
-import projects_library from '@site/src/data/projects-library.json';
-import projects_main from '@site/src/data/projects-main.json';
+import projects_library from "@site/src/data/projects-library.json";
+import projects_main from "@site/src/data/projects-main.json";
 
 export default function ProjectGrid() {
-    const [message, setMessage] = useState(null);
-    const [selectedProject, setSelectedProject] = useState(null);
-    const [activeTab, setActiveTab] = useState('overview');
-    // Monitor open modal -- state prevents display of main-page alert
-    const [isModalOpen, setIsModalOpen] = useState(false);
-    const openModal = (project) => {
-        setSelectedProject(project); // sets modal content
-    };
-    // Use a separate state for the modal alert
-    const [modalMessage, setModalMessage] = useState(null);
-
-    // Close modal on Escape key
-    useEffect(() => {
-        function handleKeyDown(event) {
-            if (event.key === 'Escape') {
-                setSelectedProject(null);
-                setActiveTab('overview');
-            }
-        }
-        if (selectedProject) {
-            window.addEventListener('keydown', handleKeyDown);
-        }
-        return () => {
-            window.removeEventListener('keydown', handleKeyDown);
-        };
-    }, [selectedProject]);
+  const [message, setMessage] = useState(null);
+  const [selectedProject, setSelectedProject] = useState(null);
+  const [activeTab, setActiveTab] = useState("overview");
+  // Monitor open modal -- state prevents display of main-page alert
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const openModal = (project) => {
+    setSelectedProject(project); // sets modal content
+  };
+  // Use a separate state for the modal alert
+  const [modalMessage, setModalMessage] = useState(null);
 
-    const closeModal = () => {
+  // Close modal on Escape key
+  useEffect(() => {
+    function handleKeyDown(event) {
+      if (event.key === "Escape") {
         setSelectedProject(null);
-        setActiveTab('overview');
+        setActiveTab("overview");
+      }
+    }
+    if (selectedProject) {
+      window.addEventListener("keydown", handleKeyDown);
+    }
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
     };
+  }, [selectedProject]);
 
-    return (
-        <div className={styles.projectGridWrapper}>
-            <div className={styles.projectGridContainer}>
-                <div className={styles.projectGrid}>
-                    {projects.map((project, idx) => (
-                        <div
-                            key={idx}
-                            className={styles.projectCard}
-                            onClick={() => openModal(project)}
-                        >
-                            <div>
-                                <div className={styles.topRow}>
-                                    <h4 className={styles.projectName}>
-                                        {project.repository_url ? (
-                                            <a
-                                                href={project.repository_url}
-                                                target={
-                                                    project.repository_url.startsWith(
-                                                        'http'
-                                                    )
-                                                        ? '_blank'
-                                                        : '_self'
-                                                }
-                                                rel='noopener noreferrer'
-                                                className={
-                                                    styles.modalLinkUrl_break_word
-                                                }
-                                                onClick={(e) =>
-                                                    e.stopPropagation()
-                                                }
-                                            >
-                                                {project.name}
-                                            </a>
-                                        ) : (
-                                            project.name
-                                        )}
-                                    </h4>
-                                </div>
-                            </div>
+  const closeModal = () => {
+    setSelectedProject(null);
+    setActiveTab("overview");
+  };
 
-                            <div>
-                                <div
-                                    className={styles.projectDescriptionWrapper}
-                                >
-                                    {project.description}
-                                </div>
-                            </div>
+  return (
+    <div className={styles.projectGridWrapper}>
+      <div className={styles.projectGridContainer}>
+        <div className={styles.projectGrid}>
+          {projects.map((project, idx) => (
+            <div
+              key={idx}
+              className={styles.projectCard}
+              onClick={() => openModal(project)}
+            >
+              <div>
+                <div className={styles.topRow}>
+                  <h4 className={styles.projectName}>
+                    {project.repository_url ? (
+                      <a
+                        href={project.repository_url}
+                        target={
+                          project.repository_url.startsWith("http")
+                            ? "_blank"
+                            : "_self"
+                        }
+                        rel="noopener noreferrer"
+                        className={styles.modalLinkUrl_break_word}
+                        onClick={(e) => e.stopPropagation()}
+                      >
+                        {project.name}
+                      </a>
+                    ) : (
+                      project.name
+                    )}
+                  </h4>
+                </div>
+              </div>
 
-                            <div>
-                                <div className={styles.packageDownloadWrapper}>
-                                    <strong>Package Download URL:</strong>
-                                    {project.package_download_url &&
-                                        project.package_download_url.length >
-                                            0 && (
-                                            <ul
-                                                style={{
-                                                    margin: 0,
-                                                    paddingLeft: '1.5rem',
-                                                    paddingTop: '0.2rem',
-                                                }}
-                                            >
-                                                {project.package_download_url.map(
-                                                    (url, idx) => (
-                                                        <li key={idx}>
-                                                            <a
-                                                                className='wordWrap'
-                                                                href={url}
-                                                                target='_blank'
-                                                                rel='noopener noreferrer'
-                                                            >
-                                                                {url}
-                                                            </a>
-                                                        </li>
-                                                    )
-                                                )}
-                                            </ul>
-                                        )}
-                                </div>
-                            </div>
-                        </div>
-                    ))}
+              <div>
+                <div className={styles.projectDescriptionWrapper}>
+                  {project.description}
                 </div>
-                {/* ^ end of projectGrid */}
+              </div>
+
+              <div>
+                <div className={styles.packageDownloadWrapper}>
+                  <strong>Package Download URL:</strong>
+                  {project.package_download_url &&
+                    project.package_download_url.length > 0 && (
+                      <ul
+                        style={{
+                          margin: 0,
+                          paddingLeft: "1.5rem",
+                          paddingTop: "0.2rem",
+                        }}
+                      >
+                        {project.package_download_url.map((url, idx) => (
+                          <li key={idx}>
+                            <a
+                              className="wordWrap"
+                              href={url}
+                              target="_blank"
+                              rel="noopener noreferrer"
+                            >
+                              {url}
+                            </a>
+                          </li>
+                        ))}
+                      </ul>
+                    )}
+                </div>
+              </div>
             </div>
-            {/* ^ end of projectGridContainer */}
+          ))}
+        </div>
+        {/* ^ end of projectGrid */}
+      </div>
+      {/* ^ end of projectGridContainer */}
 
-            {/* Popup message */}
-            {/* Don't display this message if the modal is open. */}
-            {!isModalOpen && message && (
-                <div className={styles.modalAlertOverlay_main}>{message}</div>
-            )}
+      {/* Popup message */}
+      {/* Don't display this message if the modal is open. */}
+      {!isModalOpen && message && (
+        <div className={styles.modalAlertOverlay_main}>{message}</div>
+      )}
 
-            {/* Modal */}
-            {selectedProject && (
-                <div className={styles.modalBackdrop} onClick={closeModal}>
-                    <div
-                        className={styles.modalContent}
-                        onClick={(e) => e.stopPropagation()}
-                    >
-                        <div className={styles.modalBody}>
-                            <>
-                                {/* Full width section */}
-                                <div className={styles.fullWidthSection}>
-                                    <h2>{selectedProject.name}</h2>
-                                    <p>{selectedProject.description}</p>
-                                </div>
-
-                                <div className={styles.column}>
-                                    <div className={styles.modalLinks01}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Repository URL:{' '}
-                                        </span>
+      {/* Modal */}
+      {selectedProject && (
+        <div className={styles.modalBackdrop} onClick={closeModal}>
+          <div
+            className={styles.modalContent}
+            onClick={(e) => e.stopPropagation()}
+          >
+            <div className={styles.modalBody}>
+              <>
+                {/* Full width section */}
+                <div className={styles.fullWidthSection}>
+                  <h2>{selectedProject.name}</h2>
+                  <p>{selectedProject.description}</p>
+                </div>
 
-                                        {selectedProject.repository_url &&
-                                        selectedProject.repository_url !==
-                                            'n/a' &&
-                                        selectedProject.repository_url !==
-                                            '#' ? (
-                                            <a
-                                                href={
-                                                    selectedProject.repository_url
-                                                }
-                                                target='_blank'
-                                                rel='noopener noreferrer'
-                                                className={styles.modalLinkUrl}
-                                            >
-                                                {selectedProject.repository_url}
-                                            </a>
-                                        ) : (
-                                            <span>n/a</span>
-                                        )}
-                                    </div>
-                                    <div className={styles.modalLinks01}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Documentation URL:{' '}
-                                        </span>
+                <div className={styles.column}>
+                  <div className={styles.modalLinks01}>
+                    <span style={{ fontWeight: "bold" }}>Repository URL: </span>
 
-                                        {selectedProject.documentation_url &&
-                                        selectedProject.documentation_url !==
-                                            'n/a' &&
-                                        selectedProject.documentation_url !==
-                                            '#' ? (
-                                            <a
-                                                href={
-                                                    selectedProject.documentation_url
-                                                }
-                                                target='_blank'
-                                                rel='noopener noreferrer'
-                                                className={styles.modalLinkUrl}
-                                            >
-                                                {
-                                                    selectedProject.documentation_url
-                                                }
-                                            </a>
-                                        ) : (
-                                            <span>n/a</span>
-                                        )}
-                                    </div>
+                    {selectedProject.repository_url &&
+                    selectedProject.repository_url !== "n/a" &&
+                    selectedProject.repository_url !== "#" ? (
+                      <a
+                        href={selectedProject.repository_url}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        className={styles.modalLinkUrl}
+                      >
+                        {selectedProject.repository_url}
+                      </a>
+                    ) : (
+                      <span>n/a</span>
+                    )}
+                  </div>
+                  <div className={styles.modalLinks01}>
+                    <span style={{ fontWeight: "bold" }}>
+                      Documentation URL:{" "}
+                    </span>
 
-                                    <div className={styles.modalLinks01}>
-                                        <strong>Package Download URL:</strong>
-                                        {selectedProject.package_download_url &&
-                                            selectedProject.package_download_url
-                                                .length > 0 && (
-                                                <ul
-                                                    style={{
-                                                        margin: 0,
-                                                        paddingLeft: '1.5rem',
-                                                        paddingTop: '0.2rem',
-                                                    }}
-                                                >
-                                                    {selectedProject.package_download_url.map(
-                                                        (url, idx) => (
-                                                            <li key={idx}>
-                                                                <a
-                                                                    className='wordWrap'
-                                                                    href={url}
-                                                                    target='_blank'
-                                                                    rel='noopener noreferrer'
-                                                                >
-                                                                    {url}
-                                                                </a>
-                                                            </li>
-                                                        )
-                                                    )}
-                                                </ul>
-                                            )}
-                                    </div>
+                    {selectedProject.documentation_url &&
+                    selectedProject.documentation_url !== "n/a" &&
+                    selectedProject.documentation_url !== "#" ? (
+                      <a
+                        href={selectedProject.documentation_url}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        className={styles.modalLinkUrl}
+                      >
+                        {selectedProject.documentation_url}
+                      </a>
+                    ) : (
+                      <span>n/a</span>
+                    )}
+                  </div>
 
-                                    <div className={styles.modalLinks01}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Service URL:{' '}
-                                        </span>
+                  <div className={styles.modalLinks01}>
+                    <strong>Package Download URL:</strong>
+                    {selectedProject.package_download_url &&
+                      selectedProject.package_download_url.length > 0 && (
+                        <ul
+                          style={{
+                            margin: 0,
+                            paddingLeft: "1.5rem",
+                            paddingTop: "0.2rem",
+                          }}
+                        >
+                          {selectedProject.package_download_url.map(
+                            (url, idx) => (
+                              <li key={idx}>
+                                <a
+                                  className="wordWrap"
+                                  href={url}
+                                  target="_blank"
+                                  rel="noopener noreferrer"
+                                >
+                                  {url}
+                                </a>
+                              </li>
+                            ),
+                          )}
+                        </ul>
+                      )}
+                  </div>
 
-                                        {selectedProject.service_url &&
-                                        selectedProject.service_url !== 'n/a' &&
-                                        selectedProject.service_url !== '#' ? (
-                                            <a
-                                                href={
-                                                    selectedProject.service_url
-                                                }
-                                                target='_blank'
-                                                rel='noopener noreferrer'
-                                                className={styles.modalLinkUrl}
-                                            >
-                                                {selectedProject.service_url}
-                                            </a>
-                                        ) : (
-                                            <span>n/a</span>
-                                        )}
-                                    </div>
+                  <div className={styles.modalLinks01}>
+                    <span style={{ fontWeight: "bold" }}>Service URL: </span>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Language:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.language}
-                                        </div>
-                                    </div>
+                    {selectedProject.service_url &&
+                    selectedProject.service_url !== "n/a" &&
+                    selectedProject.service_url !== "#" ? (
+                      <a
+                        href={selectedProject.service_url}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        className={styles.modalLinkUrl}
+                      >
+                        {selectedProject.service_url}
+                      </a>
+                    ) : (
+                      <span>n/a</span>
+                    )}
+                  </div>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            License:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.license}
-                                        </div>
-                                    </div>
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>Language: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.language}
+                    </div>
+                  </div>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Platform:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.platform}
-                                        </div>
-                                    </div>
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>License: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.license}
+                    </div>
+                  </div>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Comments:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.comments}
-                                        </div>
-                                    </div>
-                                </div>
-                            </>
-                        </div>
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>Platform: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.platform}
+                    </div>
+                  </div>
 
-                        {/* Close button */}
-                        <div className={styles.modalFooter}>
-                            <button
-                                className={styles.closeButton}
-                                onClick={closeModal}
-                            >
-                                Close
-                            </button>
-                        </div>
-                        {/* Display alert inside open modal. */}
-                        {modalMessage && (
-                            <div className={styles.modalAlertOverlay}>
-                                {modalMessage}
-                            </div>
-                        )}
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>Comments: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.comments}
                     </div>
+                  </div>
                 </div>
+              </>
+            </div>
+
+            {/* Close button */}
+            <div className={styles.modalFooter}>
+              <button className={styles.closeButton} onClick={closeModal}>
+                Close
+              </button>
+            </div>
+            {/* Display alert inside open modal. */}
+            {modalMessage && (
+              <div className={styles.modalAlertOverlay}>{modalMessage}</div>
             )}
-            {/* end of modal */}
+          </div>
         </div>
-    );
+      )}
+      {/* end of modal */}
+    </div>
+  );
 }
diff --git a/website/src/components/archive/ProjectGrid/index-saved.js b/website/src/components/archive/ProjectGrid/index-saved.js
index bef8bec..158ffba 100644
--- a/website/src/components/archive/ProjectGrid/index-saved.js
+++ b/website/src/components/archive/ProjectGrid/index-saved.js
@@ -1,123 +1,117 @@
 // 2025-12-11 Thursday 12:09:35.Saved.
 // 2025-11-22 Saturday 09:58:08.  From ToolGrid
-import React, { useState, useEffect } from 'react';
-import styles from './styles.module.css';
+import { useState, useEffect } from "react";
+import styles from "./styles.module.css";
 // import specs from '@site/src/data/specifications.json';
 // import projects from '@site/src/data/projects-v01.json';
-import projects from '@site/src/data/projects-v02.json';
+import projects from "@site/src/data/projects-v02.json";
 
 export default function ProjectGrid() {
-    const [message, setMessage] = useState(null);
-    const [selectedProject, setSelectedProject] = useState(null);
-    const [activeTab, setActiveTab] = useState('overview');
-    // Monitor open modal -- state prevents display of main-page alert
-    const [isModalOpen, setIsModalOpen] = useState(false);
-    const openModal = (project) => {
-        setSelectedProject(project); // sets modal content
-    };
-    // Use a separate state for the modal alert
-    const [modalMessage, setModalMessage] = useState(null);
-
-    // Close modal on Escape key
-    useEffect(() => {
-        function handleKeyDown(event) {
-            if (event.key === 'Escape') {
-                setSelectedProject(null);
-                setActiveTab('overview');
-            }
-        }
-        if (selectedProject) {
-            window.addEventListener('keydown', handleKeyDown);
-        }
-        return () => {
-            window.removeEventListener('keydown', handleKeyDown);
-        };
-    }, [selectedProject]);
-
-    // modal link events
-    // const handleLinkClick = (e, project, linkType) => {
-    //     e.preventDefault();
-    //     e.stopPropagation();
-
-    //     let message = null;
-
-    //     if (
-    //         linkType === 'homepage' &&
-    //         (!project.homepage || project.homepage === 'n/a')
-    //     ) {
-    //         message = `The homepage for "${project.name}" is not available.`;
-    //     } else if (
-    //         linkType === 'source_download' &&
-    //         (!project.source_download || project.source_download === 'n/a')
-    //     ) {
-    //         message = `The source download URL for "${project.name}" is not available.`;
-    //     } else if (
-    //         linkType === 'package_download' &&
-    //         (!project.package_download || project.package_download === 'n/a')
-    //     ) {
-    //         message = `The package download URL for "${project.name}" is not available.`;
-    //     }
-
-    //     if (message) {
-    //         setModalMessage(message);
-    //         setTimeout(() => setModalMessage(null), 3000);
-    //     } else {
-    //         // manually open the valid link if it passed checks
-    //         const url =
-    //             linkType === 'homepage'
-    //                 ? project.homepage
-    //                 : project.source_download;
-    //         window.open(url, '_blank', 'noopener noreferrer');
-    //     }
-    // };
-
-    const closeModal = () => {
+  const [message, setMessage] = useState(null);
+  const [selectedProject, setSelectedProject] = useState(null);
+  const [activeTab, setActiveTab] = useState("overview");
+  // Monitor open modal -- state prevents display of main-page alert
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const openModal = (project) => {
+    setSelectedProject(project); // sets modal content
+  };
+  // Use a separate state for the modal alert
+  const [modalMessage, setModalMessage] = useState(null);
+
+  // Close modal on Escape key
+  useEffect(() => {
+    function handleKeyDown(event) {
+      if (event.key === "Escape") {
         setSelectedProject(null);
-        setActiveTab('overview');
+        setActiveTab("overview");
+      }
+    }
+    if (selectedProject) {
+      window.addEventListener("keydown", handleKeyDown);
+    }
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
     };
+  }, [selectedProject]);
+
+  // modal link events
+  // const handleLinkClick = (e, project, linkType) => {
+  //     e.preventDefault();
+  //     e.stopPropagation();
+
+  //     let message = null;
+
+  //     if (
+  //         linkType === 'homepage' &&
+  //         (!project.homepage || project.homepage === 'n/a')
+  //     ) {
+  //         message = `The homepage for "${project.name}" is not available.`;
+  //     } else if (
+  //         linkType === 'source_download' &&
+  //         (!project.source_download || project.source_download === 'n/a')
+  //     ) {
+  //         message = `The source download URL for "${project.name}" is not available.`;
+  //     } else if (
+  //         linkType === 'package_download' &&
+  //         (!project.package_download || project.package_download === 'n/a')
+  //     ) {
+  //         message = `The package download URL for "${project.name}" is not available.`;
+  //     }
+
+  //     if (message) {
+  //         setModalMessage(message);
+  //         setTimeout(() => setModalMessage(null), 3000);
+  //     } else {
+  //         // manually open the valid link if it passed checks
+  //         const url =
+  //             linkType === 'homepage'
+  //                 ? project.homepage
+  //                 : project.source_download;
+  //         window.open(url, '_blank', 'noopener noreferrer');
+  //     }
+  // };
+
+  const closeModal = () => {
+    setSelectedProject(null);
+    setActiveTab("overview");
+  };
+
+  return (
+    <div className={styles.projectGridWrapper}>
+      <div className={styles.projectGridContainer}>
+        <div className={styles.projectGrid}>
+          {projects.map((project, idx) => (
+            <div
+              key={idx}
+              className={styles.projectCard}
+              onClick={() => openModal(project)}
+            >
+              {/* <div className={styles.projectCardTopBlock}> */}
+              <div>
+                <div className={styles.topRow}>
+                  <h4 className={styles.projectName}>
+                    {project.repository_url ? (
+                      <a
+                        href={project.repository_url}
+                        target={
+                          project.repository_url.startsWith("http")
+                            ? "_blank"
+                            : "_self"
+                        }
+                        rel="noopener noreferrer"
+                        // className={styles.modalLinkUrl}
+                        className={styles.modalLinkUrl_break_word}
+                        onClick={(e) => e.stopPropagation()}
+                      >
+                        {project.name}
+                      </a>
+                    ) : (
+                      project.name
+                    )}
+                  </h4>
 
-    return (
-        <div className={styles.projectGridWrapper}>
-            <div className={styles.projectGridContainer}>
-                <div className={styles.projectGrid}>
-                    {projects.map((project, idx) => (
-                        <div
-                            key={idx}
-                            className={styles.projectCard}
-                            onClick={() => openModal(project)}
-                        >
-                            {/* <div className={styles.projectCardTopBlock}> */}
-                            <div>
-                                <div className={styles.topRow}>
-                                    <h4 className={styles.projectName}>
-                                        {project.repository_url ? (
-                                            <a
-                                                href={project.repository_url}
-                                                target={
-                                                    project.repository_url.startsWith(
-                                                        'http'
-                                                    )
-                                                        ? '_blank'
-                                                        : '_self'
-                                                }
-                                                rel='noopener noreferrer'
-                                                // className={styles.modalLinkUrl}
-                                                className={
-                                                    styles.modalLinkUrl_break_word
-                                                }
-                                                onClick={(e) =>
-                                                    e.stopPropagation()
-                                                }
-                                            >
-                                                {project.name}
-                                            </a>
-                                        ) : (
-                                            project.name
-                                        )}
-                                    </h4>
-
-                                    {/* Optional logo (only if available) */}
-                                    {/* {project.logo && (
+                  {/* Optional logo (only if available) */}
+                  {/* {project.logo && (
                                         <div className={styles.logoWrapper}>
                                             <img
                                                 src={project.logo}
@@ -126,19 +120,17 @@ export default function ProjectGrid() {
                                             />
                                         </div>
                                     )} */}
-                                </div>
-                            </div>
+                </div>
+              </div>
 
-                            {/* <div className={styles.projectCardMidBlock}> */}
-                            <div>
-                                <div
-                                    className={styles.projectDescriptionWrapper}
-                                >
-                                    {project.description}
-                                </div>
-                            </div>
+              {/* <div className={styles.projectCardMidBlock}> */}
+              <div>
+                <div className={styles.projectDescriptionWrapper}>
+                  {project.description}
+                </div>
+              </div>
 
-                            {/* <div className={styles.projectCardMidBlock}>
+              {/* <div className={styles.projectCardMidBlock}>
                                 <ul className={styles.projectMeta}>
                                     <li>
                                         <strong>Base language:</strong>{' '}
@@ -155,98 +147,87 @@ export default function ProjectGrid() {
                                 </ul>
                             </div> */}
 
-{/* <div className={styles.projectCardMidBlock}> */}
-<div>
-    <div
-        // className={styles.projectDescriptionWrapper}
-        className={styles.packageDownloadWrapper}
-    >
-        <strong>Package Download URL:</strong>
-        {project.package_download_url &&
-            project.package_download_url.length >
-                0 && (
-                <ul
-                    style={{
-                        margin: 0,
-                        paddingLeft: '1.5rem',
-                        paddingTop: '0.2rem',
-                    }}
+              {/* <div className={styles.projectCardMidBlock}> */}
+              <div>
+                <div
+                  // className={styles.projectDescriptionWrapper}
+                  className={styles.packageDownloadWrapper}
                 >
-                    {project.package_download_url.map(
-                        (url, idx) => (
-                            <li key={idx}>
-                                <a
-                                    className='wordWrap'
-                                    href={url}
-                                    target='_blank'
-                                    rel='noopener noreferrer'
-                                >
-                                    {url}
-                                </a>
-                            </li>
-                        )
+                  <strong>Package Download URL:</strong>
+                  {project.package_download_url &&
+                    project.package_download_url.length > 0 && (
+                      <ul
+                        style={{
+                          margin: 0,
+                          paddingLeft: "1.5rem",
+                          paddingTop: "0.2rem",
+                        }}
+                      >
+                        {project.package_download_url.map((url, idx) => (
+                          <li key={idx}>
+                            <a
+                              className="wordWrap"
+                              href={url}
+                              target="_blank"
+                              rel="noopener noreferrer"
+                            >
+                              {url}
+                            </a>
+                          </li>
+                        ))}
+                      </ul>
                     )}
-                </ul>
-            )}
-    </div>
-</div>
-
-
-                        </div>
-                    ))}
                 </div>
-                {/* ^ end of projectGrid */}
+              </div>
             </div>
-            {/* ^ end of projectGridContainer */}
-
-            {/* Popup message */}
-            {/* Don't display this message if the modal is open. */}
-            {!isModalOpen && message && (
-                <div className={styles.modalAlertOverlay_main}>{message}</div>
-            )}
-
-            {/* Modal */}
-            {selectedProject && (
-                <div className={styles.modalBackdrop} onClick={closeModal}>
-                    <div
-                        className={styles.modalContent}
-                        onClick={(e) => e.stopPropagation()}
-                    >
-                        <div className={styles.modalBody}>
-                            <>
-                                {/* Full width section */}
-                                <div className={styles.fullWidthSection}>
-                                    <h2>{selectedProject.name}</h2>
-                                    <p>{selectedProject.description}</p>
-                                </div>
-
-                                {/* 2025-12-11 Thursday 09:06:10.  Copy one of the single-column sections from below. */}
-                                <div className={styles.column}>
-                                    <div className={styles.modalLinks01}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Repository URL:{' '}
-                                        </span>
+          ))}
+        </div>
+        {/* ^ end of projectGrid */}
+      </div>
+      {/* ^ end of projectGridContainer */}
+
+      {/* Popup message */}
+      {/* Don't display this message if the modal is open. */}
+      {!isModalOpen && message && (
+        <div className={styles.modalAlertOverlay_main}>{message}</div>
+      )}
+
+      {/* Modal */}
+      {selectedProject && (
+        <div className={styles.modalBackdrop} onClick={closeModal}>
+          <div
+            className={styles.modalContent}
+            onClick={(e) => e.stopPropagation()}
+          >
+            <div className={styles.modalBody}>
+              <>
+                {/* Full width section */}
+                <div className={styles.fullWidthSection}>
+                  <h2>{selectedProject.name}</h2>
+                  <p>{selectedProject.description}</p>
+                </div>
 
-                                        {selectedProject.repository_url &&
-                                        selectedProject.repository_url !==
-                                            'n/a' &&
-                                        selectedProject.repository_url !==
-                                            '#' ? (
-                                            <a
-                                                href={
-                                                    selectedProject.repository_url
-                                                }
-                                                target='_blank'
-                                                rel='noopener noreferrer'
-                                                className={styles.modalLinkUrl}
-                                            >
-                                                {selectedProject.repository_url}
-                                            </a>
-                                        ) : (
-                                            <span>n/a</span>
-                                        )}
+                {/* 2025-12-11 Thursday 09:06:10.  Copy one of the single-column sections from below. */}
+                <div className={styles.column}>
+                  <div className={styles.modalLinks01}>
+                    <span style={{ fontWeight: "bold" }}>Repository URL: </span>
+
+                    {selectedProject.repository_url &&
+                    selectedProject.repository_url !== "n/a" &&
+                    selectedProject.repository_url !== "#" ? (
+                      <a
+                        href={selectedProject.repository_url}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        className={styles.modalLinkUrl}
+                      >
+                        {selectedProject.repository_url}
+                      </a>
+                    ) : (
+                      <span>n/a</span>
+                    )}
 
-                                        {/* {selectedProject.homepage &&
+                    {/* {selectedProject.homepage &&
                                         selectedProject.homepage !== 'n/a' &&
                                         selectedProject.homepage !== '#' ? (
                                             <a
@@ -260,71 +241,63 @@ export default function ProjectGrid() {
                                         ) : (
                                             <span>n/a</span>
                                         )} */}
-                                    </div>
-                                    <div className={styles.modalLinks01}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Documentation URL:{' '}
-                                        </span>
-
-                                        {selectedProject.documentation_url &&
-                                        selectedProject.documentation_url !==
-                                            'n/a' &&
-                                        selectedProject.documentation_url !==
-                                            '#' ? (
-                                            <a
-                                                href={
-                                                    selectedProject.documentation_url
-                                                }
-                                                target='_blank'
-                                                rel='noopener noreferrer'
-                                                className={styles.modalLinkUrl}
-                                            >
-                                                {
-                                                    selectedProject.documentation_url
-                                                }
-                                            </a>
-                                        ) : (
-                                            <span>n/a</span>
-                                        )}
-                                    </div>
+                  </div>
+                  <div className={styles.modalLinks01}>
+                    <span style={{ fontWeight: "bold" }}>
+                      Documentation URL:{" "}
+                    </span>
+
+                    {selectedProject.documentation_url &&
+                    selectedProject.documentation_url !== "n/a" &&
+                    selectedProject.documentation_url !== "#" ? (
+                      <a
+                        href={selectedProject.documentation_url}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        className={styles.modalLinkUrl}
+                      >
+                        {selectedProject.documentation_url}
+                      </a>
+                    ) : (
+                      <span>n/a</span>
+                    )}
+                  </div>
 
-                                    <div className={styles.modalLinks01}>
-    {/* <div
+                  <div className={styles.modalLinks01}>
+                    {/* <div
         // className={styles.projectDescriptionWrapper}
         className={styles.packageDownloadWrapper}
     > */}
-        <strong>Package Download URL:</strong>
-        {selectedProject.package_download_url &&
-            selectedProject.package_download_url.length >
-                0 && (
-                <ul
-                    style={{
-                        margin: 0,
-                        paddingLeft: '1.5rem',
-                        paddingTop: '0.2rem',
-                    }}
-                >
-                    {selectedProject.package_download_url.map(
-                        (url, idx) => (
-                            <li key={idx}>
+                    <strong>Package Download URL:</strong>
+                    {selectedProject.package_download_url &&
+                      selectedProject.package_download_url.length > 0 && (
+                        <ul
+                          style={{
+                            margin: 0,
+                            paddingLeft: "1.5rem",
+                            paddingTop: "0.2rem",
+                          }}
+                        >
+                          {selectedProject.package_download_url.map(
+                            (url, idx) => (
+                              <li key={idx}>
                                 <a
-                                    className='wordWrap'
-                                    href={url}
-                                    target='_blank'
-                                    rel='noopener noreferrer'
+                                  className="wordWrap"
+                                  href={url}
+                                  target="_blank"
+                                  rel="noopener noreferrer"
                                 >
-                                    {url}
+                                  {url}
                                 </a>
-                            </li>
-                        )
-                    )}
-                </ul>
-            )}
-    {/* </div> */}
-
-                                    </div>
-
-                                    {/* <div className={styles.modalLinks01}>
+                              </li>
+                            ),
+                          )}
+                        </ul>
+                      )}
+                    {/* </div> */}
+                  </div>
+
+                  {/* <div className={styles.modalLinks01}>
                                         <span style={{ fontWeight: 'bold' }}>
                                             Package Download URL:{' '}
                                         </span>
@@ -351,72 +324,56 @@ export default function ProjectGrid() {
                                         )}
                                     </div> */}
 
-                                    <div className={styles.modalLinks01}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Service URL:{' '}
-                                        </span>
-
-                                        {selectedProject.service_url &&
-                                        selectedProject.service_url !==
-                                            'n/a' &&
-                                        selectedProject.service_url !==
-                                            '#' ? (
-                                            <a
-                                                href={
-                                                    selectedProject.service_url
-                                                }
-                                                target='_blank'
-                                                rel='noopener noreferrer'
-                                                className={styles.modalLinkUrl}
-                                            >
-                                                {
-                                                    selectedProject.service_url
-                                                }
-                                            </a>
-                                        ) : (
-                                            <span>n/a</span>
-                                        )}
-                                    </div>
+                  <div className={styles.modalLinks01}>
+                    <span style={{ fontWeight: "bold" }}>Service URL: </span>
+
+                    {selectedProject.service_url &&
+                    selectedProject.service_url !== "n/a" &&
+                    selectedProject.service_url !== "#" ? (
+                      <a
+                        href={selectedProject.service_url}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        className={styles.modalLinkUrl}
+                      >
+                        {selectedProject.service_url}
+                      </a>
+                    ) : (
+                      <span>n/a</span>
+                    )}
+                  </div>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Language:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.language}
-                                        </div>
-                                    </div>
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>Language: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.language}
+                    </div>
+                  </div>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            License:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.license}
-                                        </div>
-                                    </div>
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>License: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.license}
+                    </div>
+                  </div>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Platform:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.platform}
-                                        </div>
-                                    </div>
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>Platform: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.platform}
+                    </div>
+                  </div>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Comments:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.comments}
-                                        </div>
-                                    </div>
-                                </div>
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>Comments: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.comments}
+                    </div>
+                  </div>
+                </div>
 
-                                {/* Two column section */}
-                                {/* <div className={styles.twoColumnSection}>
+                {/* Two column section */}
+                {/* <div className={styles.twoColumnSection}>
                                     <div className={styles.column}>
                                         <ul className={styles.featureList}>
                                             <li>
@@ -548,28 +505,23 @@ export default function ProjectGrid() {
                                         </div>
                                     </div>
                                 </div> */}
-                            </>
-                        </div>
-
-                        {/* Close button */}
-                        <div className={styles.modalFooter}>
-                            <button
-                                className={styles.closeButton}
-                                onClick={closeModal}
-                            >
-                                Close
-                            </button>
-                        </div>
-                        {/* Display alert inside open modal. */}
-                        {modalMessage && (
-                            <div className={styles.modalAlertOverlay}>
-                                {modalMessage}
-                            </div>
-                        )}
-                    </div>
-                </div>
+              </>
+            </div>
+
+            {/* Close button */}
+            <div className={styles.modalFooter}>
+              <button className={styles.closeButton} onClick={closeModal}>
+                Close
+              </button>
+            </div>
+            {/* Display alert inside open modal. */}
+            {modalMessage && (
+              <div className={styles.modalAlertOverlay}>{modalMessage}</div>
             )}
-            {/* end of modal */}
+          </div>
         </div>
-    );
+      )}
+      {/* end of modal */}
+    </div>
+  );
 }
diff --git a/website/src/components/archive/ProjectGrid/index.js b/website/src/components/archive/ProjectGrid/index.js
index 2592e1a..c2fd136 100644
--- a/website/src/components/archive/ProjectGrid/index.js
+++ b/website/src/components/archive/ProjectGrid/index.js
@@ -1,318 +1,277 @@
 // 2025-11-22 Saturday 09:58:08.  From ToolGrid
-import React, { useState, useEffect } from 'react';
-import styles from './styles.module.css';
-import projects from '@site/src/data/projects-v02.json';
-import projects_library from '@site/src/data/projects-library.json';
-import projects_main from '@site/src/data/projects-main.json';
+import { useState, useEffect } from "react";
+import styles from "./styles.module.css";
+import projects from "@site/src/data/projects-v02.json";
+import projects_library from "@site/src/data/projects-library.json";
+import projects_main from "@site/src/data/projects-main.json";
 
 export default function ProjectGrid() {
-    const [message, setMessage] = useState(null);
-    const [selectedProject, setSelectedProject] = useState(null);
-    // 2025-12-11 Thursday 18:04:12.No longer used right?
-    // const [activeTab, setActiveTab] = useState('overview');
-    // Monitor open modal -- state prevents display of main-page alert
-    const [isModalOpen, setIsModalOpen] = useState(false);
-    const openModal = (project) => {
-        setSelectedProject(project); // sets modal content
-    };
-    // Use a separate state for the modal alert
-    const [modalMessage, setModalMessage] = useState(null);
+  const [message, setMessage] = useState(null);
+  const [selectedProject, setSelectedProject] = useState(null);
+  // 2025-12-11 Thursday 18:04:12.No longer used right?
+  // const [activeTab, setActiveTab] = useState('overview');
+  // Monitor open modal -- state prevents display of main-page alert
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const openModal = (project) => {
+    setSelectedProject(project); // sets modal content
+  };
+  // Use a separate state for the modal alert
+  const [modalMessage, setModalMessage] = useState(null);
 
-    // Close modal on Escape key
-    useEffect(() => {
-        function handleKeyDown(event) {
-            if (event.key === 'Escape') {
-                setSelectedProject(null);
-                // 2025-12-11 Thursday 18:04:12.No longer used right?
-                // setActiveTab('overview');
-            }
-        }
-        if (selectedProject) {
-            window.addEventListener('keydown', handleKeyDown);
-        }
-        return () => {
-            window.removeEventListener('keydown', handleKeyDown);
-        };
-    }, [selectedProject]);
-
-    const closeModal = () => {
+  // Close modal on Escape key
+  useEffect(() => {
+    function handleKeyDown(event) {
+      if (event.key === "Escape") {
         setSelectedProject(null);
         // 2025-12-11 Thursday 18:04:12.No longer used right?
         // setActiveTab('overview');
+      }
+    }
+    if (selectedProject) {
+      window.addEventListener("keydown", handleKeyDown);
+    }
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
     };
+  }, [selectedProject]);
 
-    return (
-        <div className={styles.projectGridWrapper}>
-            <div className={styles.projectGridContainer}>
-                <div className={styles.projectGrid}>
-                    {projects.map((project, idx) => (
-                        <div
-                            key={idx}
-                            className={styles.projectCard}
-                            onClick={() => openModal(project)}
-                        >
-                            <div>
-                                <div className={styles.topRow}>
-                                    <h4 className={styles.projectName}>
-                                        {project.repository_url ? (
-                                            <a
-                                                href={project.repository_url}
-                                                target={
-                                                    project.repository_url.startsWith(
-                                                        'http'
-                                                    )
-                                                        ? '_blank'
-                                                        : '_self'
-                                                }
-                                                rel='noopener noreferrer'
-                                                className={
-                                                    styles.modalLinkUrl_break_word
-                                                }
-                                                onClick={(e) =>
-                                                    e.stopPropagation()
-                                                }
-                                            >
-                                                {project.name}
-                                            </a>
-                                        ) : (
-                                            project.name
-                                        )}
-                                    </h4>
-                                </div>
-                            </div>
+  const closeModal = () => {
+    setSelectedProject(null);
+    // 2025-12-11 Thursday 18:04:12.No longer used right?
+    // setActiveTab('overview');
+  };
 
-                            <div>
-                                <div
-                                    className={styles.projectDescriptionWrapper}
-                                >
-                                    {project.description}
-                                </div>
-                            </div>
+  return (
+    <div className={styles.projectGridWrapper}>
+      <div className={styles.projectGridContainer}>
+        <div className={styles.projectGrid}>
+          {projects.map((project, idx) => (
+            <div
+              key={idx}
+              className={styles.projectCard}
+              onClick={() => openModal(project)}
+            >
+              <div>
+                <div className={styles.topRow}>
+                  <h4 className={styles.projectName}>
+                    {project.repository_url ? (
+                      <a
+                        href={project.repository_url}
+                        target={
+                          project.repository_url.startsWith("http")
+                            ? "_blank"
+                            : "_self"
+                        }
+                        rel="noopener noreferrer"
+                        className={styles.modalLinkUrl_break_word}
+                        onClick={(e) => e.stopPropagation()}
+                      >
+                        {project.name}
+                      </a>
+                    ) : (
+                      project.name
+                    )}
+                  </h4>
+                </div>
+              </div>
 
-                            <div>
-                                <div className={styles.packageDownloadWrapper}>
-                                    <strong>Package Download URL:</strong>
-                                    {project.package_download_url &&
-                                        project.package_download_url.length >
-                                            0 && (
-                                            <ul
-                                                style={{
-                                                    margin: 0,
-                                                    paddingLeft: '1.5rem',
-                                                    paddingTop: '0.2rem',
-                                                }}
-                                            >
-                                                {project.package_download_url.map(
-                                                    (url, idx) => (
-                                                        <li key={idx}>
-                                                            <a
-                                                                className='wordWrap'
-                                                                href={url}
-                                                                target='_blank'
-                                                                rel='noopener noreferrer'
-                                                            >
-                                                                {url}
-                                                            </a>
-                                                        </li>
-                                                    )
-                                                )}
-                                            </ul>
-                                        )}
-                                </div>
-                            </div>
-                        </div>
-                    ))}
+              <div>
+                <div className={styles.projectDescriptionWrapper}>
+                  {project.description}
                 </div>
-                {/* ^ end of projectGrid */}
-            </div>
-            {/* ^ end of projectGridContainer */}
-            {/* </div>? */}
-            {/* ))} */}
+              </div>
 
-            {/* Popup message */}
-            {/* Don't display this message if the modal is open. */}
-            {!isModalOpen && message && (
-                <div className={styles.modalAlertOverlay_main}>{message}</div>
-            )}
+              <div>
+                <div className={styles.packageDownloadWrapper}>
+                  <strong>Package Download URL:</strong>
+                  {project.package_download_url &&
+                    project.package_download_url.length > 0 && (
+                      <ul
+                        style={{
+                          margin: 0,
+                          paddingLeft: "1.5rem",
+                          paddingTop: "0.2rem",
+                        }}
+                      >
+                        {project.package_download_url.map((url, idx) => (
+                          <li key={idx}>
+                            <a
+                              className="wordWrap"
+                              href={url}
+                              target="_blank"
+                              rel="noopener noreferrer"
+                            >
+                              {url}
+                            </a>
+                          </li>
+                        ))}
+                      </ul>
+                    )}
+                </div>
+              </div>
+            </div>
+          ))}
+        </div>
+        {/* ^ end of projectGrid */}
+      </div>
+      {/* ^ end of projectGridContainer */}
+      {/* </div>? */}
+      {/* ))} */}
 
-            {/* Modal */}
-            {selectedProject && (
-                <div className={styles.modalBackdrop} onClick={closeModal}>
-                    <div
-                        className={styles.modalContent}
-                        onClick={(e) => e.stopPropagation()}
-                    >
-                        <div className={styles.modalBody}>
-                            <>
-                                {/* Full width section */}
-                                <div className={styles.fullWidthSection}>
-                                    <h2>{selectedProject.name}</h2>
-                                    <p>{selectedProject.description}</p>
-                                </div>
+      {/* Popup message */}
+      {/* Don't display this message if the modal is open. */}
+      {!isModalOpen && message && (
+        <div className={styles.modalAlertOverlay_main}>{message}</div>
+      )}
 
-                                <div className={styles.column}>
-                                    <div className={styles.modalLinks01}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Repository URL:{' '}
-                                        </span>
+      {/* Modal */}
+      {selectedProject && (
+        <div className={styles.modalBackdrop} onClick={closeModal}>
+          <div
+            className={styles.modalContent}
+            onClick={(e) => e.stopPropagation()}
+          >
+            <div className={styles.modalBody}>
+              <>
+                {/* Full width section */}
+                <div className={styles.fullWidthSection}>
+                  <h2>{selectedProject.name}</h2>
+                  <p>{selectedProject.description}</p>
+                </div>
 
-                                        {selectedProject.repository_url &&
-                                        selectedProject.repository_url !==
-                                            'n/a' &&
-                                        selectedProject.repository_url !==
-                                            '#' ? (
-                                            <a
-                                                href={
-                                                    selectedProject.repository_url
-                                                }
-                                                target='_blank'
-                                                rel='noopener noreferrer'
-                                                className={styles.modalLinkUrl}
-                                            >
-                                                {selectedProject.repository_url}
-                                            </a>
-                                        ) : (
-                                            <span>n/a</span>
-                                        )}
-                                    </div>
-                                    <div className={styles.modalLinks01}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Documentation URL:{' '}
-                                        </span>
+                <div className={styles.column}>
+                  <div className={styles.modalLinks01}>
+                    <span style={{ fontWeight: "bold" }}>Repository URL: </span>
 
-                                        {selectedProject.documentation_url &&
-                                        selectedProject.documentation_url !==
-                                            'n/a' &&
-                                        selectedProject.documentation_url !==
-                                            '#' ? (
-                                            <a
-                                                href={
-                                                    selectedProject.documentation_url
-                                                }
-                                                target='_blank'
-                                                rel='noopener noreferrer'
-                                                className={styles.modalLinkUrl}
-                                            >
-                                                {
-                                                    selectedProject.documentation_url
-                                                }
-                                            </a>
-                                        ) : (
-                                            <span>n/a</span>
-                                        )}
-                                    </div>
+                    {selectedProject.repository_url &&
+                    selectedProject.repository_url !== "n/a" &&
+                    selectedProject.repository_url !== "#" ? (
+                      <a
+                        href={selectedProject.repository_url}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        className={styles.modalLinkUrl}
+                      >
+                        {selectedProject.repository_url}
+                      </a>
+                    ) : (
+                      <span>n/a</span>
+                    )}
+                  </div>
+                  <div className={styles.modalLinks01}>
+                    <span style={{ fontWeight: "bold" }}>
+                      Documentation URL:{" "}
+                    </span>
 
-                                    <div className={styles.modalLinks01}>
-                                        <strong>Package Download URL:</strong>
-                                        {selectedProject.package_download_url &&
-                                            selectedProject.package_download_url
-                                                .length > 0 && (
-                                                <ul
-                                                    style={{
-                                                        margin: 0,
-                                                        paddingLeft: '1.5rem',
-                                                        paddingTop: '0.2rem',
-                                                    }}
-                                                >
-                                                    {selectedProject.package_download_url.map(
-                                                        (url, idx) => (
-                                                            <li key={idx}>
-                                                                <a
-                                                                    className='wordWrap'
-                                                                    href={url}
-                                                                    target='_blank'
-                                                                    rel='noopener noreferrer'
-                                                                >
-                                                                    {url}
-                                                                </a>
-                                                            </li>
-                                                        )
-                                                    )}
-                                                </ul>
-                                            )}
-                                    </div>
+                    {selectedProject.documentation_url &&
+                    selectedProject.documentation_url !== "n/a" &&
+                    selectedProject.documentation_url !== "#" ? (
+                      <a
+                        href={selectedProject.documentation_url}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        className={styles.modalLinkUrl}
+                      >
+                        {selectedProject.documentation_url}
+                      </a>
+                    ) : (
+                      <span>n/a</span>
+                    )}
+                  </div>
 
-                                    <div className={styles.modalLinks01}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Service URL:{' '}
-                                        </span>
+                  <div className={styles.modalLinks01}>
+                    <strong>Package Download URL:</strong>
+                    {selectedProject.package_download_url &&
+                      selectedProject.package_download_url.length > 0 && (
+                        <ul
+                          style={{
+                            margin: 0,
+                            paddingLeft: "1.5rem",
+                            paddingTop: "0.2rem",
+                          }}
+                        >
+                          {selectedProject.package_download_url.map(
+                            (url, idx) => (
+                              <li key={idx}>
+                                <a
+                                  className="wordWrap"
+                                  href={url}
+                                  target="_blank"
+                                  rel="noopener noreferrer"
+                                >
+                                  {url}
+                                </a>
+                              </li>
+                            ),
+                          )}
+                        </ul>
+                      )}
+                  </div>
 
-                                        {selectedProject.service_url &&
-                                        selectedProject.service_url !== 'n/a' &&
-                                        selectedProject.service_url !== '#' ? (
-                                            <a
-                                                href={
-                                                    selectedProject.service_url
-                                                }
-                                                target='_blank'
-                                                rel='noopener noreferrer'
-                                                className={styles.modalLinkUrl}
-                                            >
-                                                {selectedProject.service_url}
-                                            </a>
-                                        ) : (
-                                            <span>n/a</span>
-                                        )}
-                                    </div>
+                  <div className={styles.modalLinks01}>
+                    <span style={{ fontWeight: "bold" }}>Service URL: </span>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Language:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.language}
-                                        </div>
-                                    </div>
+                    {selectedProject.service_url &&
+                    selectedProject.service_url !== "n/a" &&
+                    selectedProject.service_url !== "#" ? (
+                      <a
+                        href={selectedProject.service_url}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        className={styles.modalLinkUrl}
+                      >
+                        {selectedProject.service_url}
+                      </a>
+                    ) : (
+                      <span>n/a</span>
+                    )}
+                  </div>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            License:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.license}
-                                        </div>
-                                    </div>
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>Language: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.language}
+                    </div>
+                  </div>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Platform:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.platform}
-                                        </div>
-                                    </div>
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>License: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.license}
+                    </div>
+                  </div>
 
-                                    <div className={styles.note_field}>
-                                        <span style={{ fontWeight: 'bold' }}>
-                                            Comments:{' '}
-                                        </span>
-                                        <div className={styles.modalText}>
-                                            {selectedProject.comments}
-                                        </div>
-                                    </div>
-                                </div>
-                            </>
-                        </div>
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>Platform: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.platform}
+                    </div>
+                  </div>
 
-                        {/* Close button */}
-                        <div className={styles.modalFooter}>
-                            <button
-                                className={styles.closeButton}
-                                onClick={closeModal}
-                            >
-                                Close
-                            </button>
-                        </div>
-                        {/* Display alert inside open modal. */}
-                        {modalMessage && (
-                            <div className={styles.modalAlertOverlay}>
-                                {modalMessage}
-                            </div>
-                        )}
+                  <div className={styles.note_field}>
+                    <span style={{ fontWeight: "bold" }}>Comments: </span>
+                    <div className={styles.modalText}>
+                      {selectedProject.comments}
                     </div>
+                  </div>
                 </div>
+              </>
+            </div>
+
+            {/* Close button */}
+            <div className={styles.modalFooter}>
+              <button className={styles.closeButton} onClick={closeModal}>
+                Close
+              </button>
+            </div>
+            {/* Display alert inside open modal. */}
+            {modalMessage && (
+              <div className={styles.modalAlertOverlay}>{modalMessage}</div>
             )}
-            {/* end of modal */}
+          </div>
         </div>
-    );
+      )}
+      {/* end of modal */}
+    </div>
+  );
 }
diff --git a/website/src/pages/index.js b/website/src/pages/index.js
index b877021..5936164 100644
--- a/website/src/pages/index.js
+++ b/website/src/pages/index.js
@@ -3,10 +3,10 @@ import HomepageHeader from "../components/HomepageHeader";
 import HomepageContent from "../components/HomepageContent";
 
 export default function Home() {
-    return (
-        <Layout title="Home" description="Landing page for www.aboutcode.org">
-            <HomepageHeader />
-            <HomepageContent />
-        </Layout>
-    );
+  return (
+    <Layout title="Home" description="Landing page for www.aboutcode.org">
+      <HomepageHeader />
+      <HomepageContent />
+    </Layout>
+  );
 }