From d1e127a9bb49b4d8859931a8dbf82b4c53ca49db Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Wed, 13 Sep 2023 21:12:55 -0600
Subject: [PATCH 01/15] ddev darkmode version version 1.

---
 src/components/Benefits.astro     | 12 ++++++------
 src/components/BlogFeatures.astro |  2 +-
 src/components/Contributors.astro |  2 +-
 src/components/Features.astro     |  8 ++++----
 src/components/Footer.astro       |  8 ++++----
 src/components/Header.astro       | 16 ++++++++--------
 src/components/Hero.astro         |  4 ++--
 src/components/Paging.astro       |  4 ++--
 src/layouts/Layout.astro          |  2 +-
 src/pages/support-ddev.astro      | 20 ++++++++++----------
 10 files changed, 39 insertions(+), 39 deletions(-)

diff --git a/src/components/Benefits.astro b/src/components/Benefits.astro
index 1af4a207..ab5c482a 100644
--- a/src/components/Benefits.astro
+++ b/src/components/Benefits.astro
@@ -39,14 +39,14 @@ const features = [
 ]
 ---
 
-<div class="bg-white">
+<div class="bg-white dark:bg-slate-600">
   <div class="max-w-6xl mx-auto py-16 px-4 sm:px-6 lg:py-24 lg:px-8">
     <div class="max-w-3xl mx-auto text-center">
-      <h2 class="text-base font-mono text-navy-300 mb-3">Benefits</h2>
-      <h3 class="text-3xl font-extrabold text-gray-900">
+      <h2 class="text-base font-mono text-navy-300 mb-3 dark:text-white">Benefits</h2>
+      <h3 class="text-3xl font-extrabold text-gray-900 dark:text-white">
         Made for people that make websites.
       </h3>
-      <p class="mt-4 text-lg text-gray-500">
+      <p class="mt-4 text-lg text-gray-500 dark:text-white">
         DDEV handles Docker so you and your team can focus on your work.
       </p>
     </div>
@@ -61,11 +61,11 @@ const features = [
                 className="absolute h-6 w-6 text-green-500"
                 aria-hidden="true"
               />
-              <p class="ml-9 text-lg leading-6 font-medium text-gray-900">
+              <p class="ml-9 text-lg leading-6 font-medium text-gray-900 dark:text-white">
                 {feature.name}
               </p>
             </dt>
-            <dd class="mt-2 ml-9 text-base text-gray-500">
+            <dd class="mt-2 ml-9 text-base text-gray-500 dark:text-white">
               {feature.description}
             </dd>
           </div>
diff --git a/src/components/BlogFeatures.astro b/src/components/BlogFeatures.astro
index 1d30b4c3..78d324d7 100644
--- a/src/components/BlogFeatures.astro
+++ b/src/components/BlogFeatures.astro
@@ -17,7 +17,7 @@ const recentPosts = posts
 <div class="relative my-24 px-8">
   <div class="relative max-w-5xl mx-auto">
     <div class="text-center">
-      <h2 class="text-3xl font-bold text-gray-900 sm:text-4xl">
+      <h2 class="text-3xl font-bold text-gray-900 sm:text-4xl dark:text-white">
         Latest Blog Posts
       </h2>
     </div>
diff --git a/src/components/Contributors.astro b/src/components/Contributors.astro
index 180ec2e2..3412d614 100644
--- a/src/components/Contributors.astro
+++ b/src/components/Contributors.astro
@@ -10,7 +10,7 @@ const contributors = await getContributors()
 <div class="relative mt-36 mb-24 px-8">
   <div class="relative max-w-5xl mx-auto">
     <div id="supporters" class="text-center mb-12">
-      <h2 class="text-3xl font-bold text-gray-900 sm:text-4xl">
+      <h2 class="text-3xl font-bold text-gray-900 sm:text-4xl dark:text-white">
         Our Wonderful Supporters
       </h2>
     </div>
diff --git a/src/components/Features.astro b/src/components/Features.astro
index 765b4279..d3bd12c6 100644
--- a/src/components/Features.astro
+++ b/src/components/Features.astro
@@ -76,11 +76,11 @@ const features = [
   <div
     class="mx-auto max-w-md px-4 text-center sm:max-w-3xl sm:px-6 lg:max-w-7xl lg:px-8"
   >
-    <h2 class="text-base font-mono text-navy-300">Features</h2>
-    <p class="mt-2 text-3xl font-bold text-gray-900 sm:text-4xl">
+    <h2 class="text-base font-mono text-navy-300 ">Features</h2>
+    <p class="mt-2 text-3xl font-bold text-gray-900 sm:text-4xl dark:text-white">
       Running in minutes, ready for the long haul.
     </p>
-    <p class="mx-auto mt-5 max-w-prose text-xl text-gray-500">
+    <p class="mx-auto mt-5 max-w-prose text-xl text-gray-500 dark:text-white">
       Start new DDEV projects in seconds. Customize, share, and extend with
       ease.
     </p>
@@ -100,7 +100,7 @@ const features = [
                       }}
                     </span>
                   </div>
-                  <h3 class="text-lg font-medium tracking-tight text-gray-900">
+                  <h3 class="text-lg font-medium tracking-tight text-gray-900 dark:text-white">
                     {feature.name}
                   </h3>
                   <p class="mt-5 text-base text-gray-500">
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index 2fe3ce7a..dedea283 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -67,7 +67,7 @@ const navigation = {
                   <li>
                     <a
                       href={item.href}
-                      class="text-base external-link"
+                      class="text-base external-link dark:text-white"
                       target="_blank"
                     >
                       {item.name}
@@ -81,7 +81,7 @@ const navigation = {
             <h2 class="text-sm font-mono text-navy-300 tracking-wider">
               Product
             </h2>
-            <ul class="mt-4 space-y-4">
+            <ul class="mt-4 space-y-4 dark:text-white">
               {
                 navigation.product.map((item) => (
                   <li>
@@ -97,7 +97,7 @@ const navigation = {
             <h2 class="text-sm font-mono text-navy-300 tracking-wider">
               Social
             </h2>
-            <ul class="mt-4 space-y-4">
+            <ul class="mt-4 space-y-4 dark:text-white">
               {
                 navigation.social.map((item) => (
                     <li>
@@ -135,7 +135,7 @@ const navigation = {
         }
       </div>
       <p
-        class="mt-8 text-sm text-gray-600 font-mono text-center md:text-left md:mt-0 md:order-1"
+        class="mt-8 text-sm text-gray-600 font-mono text-center md:text-left md:mt-0 md:order-1 dark:text-white"
       >
         &copy; {new Date().getFullYear()}
         {COPYRIGHT_HOLDER}
diff --git a/src/components/Header.astro b/src/components/Header.astro
index ffbeb654..7443ea9f 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -67,7 +67,7 @@ import {
     class="flex justify-between items-center content-center max-w-4xl mx-auto"
     aria-label="Main"
   >
-    <a href="/" class="relative block cursor-pointer -ml-2">
+    <a href="/" class="relative block cursor-pointer -ml-2 ">
       <span class="sr-only">DDEV logo</span>
       <img
         class="h-8 w-auto sm:h-10"
@@ -80,45 +80,45 @@ import {
       <ul class="hidden lg:flex">
         <li class="mx-4">
           <a
-            class="font-bold whitespace-nowrap"
+            class="font-bold whitespace-nowrap dark:text-white"
             href="/get-started"
             rel="prefetch">Get Started</a
           >
         </li>
         <li class="mx-4">
           <a
-            class="font-bold whitespace-nowrap"
+            class="font-bold whitespace-nowrap dark:text-white"
             href={DOCUMENTATION_URL}
             target="_blank">Docs</a
           >
         </li>
         <li class="mx-4">
-          <a class="font-bold whitespace-nowrap" href="/blog" rel="prefetch"
+          <a class="font-bold whitespace-nowrap dark:text-white" href="/blog" rel="prefetch"
             >Blog</a
           >
         </li>
         <li class="mx-4">
           <a
-            class="font-bold whitespace-nowrap"
+            class="font-bold whitespace-nowrap dark:text-white"
             href={GITHUB_URL}
             target="_blank">GitHub</a
           >
         </li>
         <li class="mx-4">
           <a
-            class="font-bold whitespace-nowrap"
+            class="font-bold whitespace-nowrap dark:text-white"
             href="/support-ddev"
             rel="prefetch">❤️ Support DDEV</a
           >
         </li>
       </ul>
-      <a href="/search" class="ml-4 p-1">
+      <a href="/search" class="ml-4 p-1 dark:text-white">
         <span class="sr-only">Search</span>
         <MagnifyingGlassIcon className="w-6 h-6 " aria-hidden={true} />
       </a>
       <button id="mobile-trigger" class="flex lg:hidden ml-6 p-1">
         <span class="sr-only">Menu</span>
-        <Bars2Icon className="w-6 h-6 " />
+        <Bars2Icon className="w-6 h-6 dark:text-white" />
       </button>
     </div>
     <div id="mobile-menu" class="menu">
diff --git a/src/components/Hero.astro b/src/components/Hero.astro
index c705d245..b4a80758 100644
--- a/src/components/Hero.astro
+++ b/src/components/Hero.astro
@@ -12,10 +12,10 @@ import { CloudIcon } from "@heroicons/react/24/solid/index.js"
 <div class="mt-12 pt-24 pb-32 relative overflow-x-hidden">
   <div class="z-10 max-w-4xl mx-auto relative">
     <div class="max-w-2xl px-6 lg:px-0">
-      <h1 class="text-5xl font-bold">
+      <h1 class="text-5xl font-bold dark:text-white">
         Docker-based PHP development environments.
       </h1>
-      <h2 class="text-2xl my-6">
+      <h2 class="text-2xl my-6 dark:text-white">
         Container superpowers with zero required Docker skills: environments in
         minutes, multiple concurrent projects, and less time to deployment.
       </h2>
diff --git a/src/components/Paging.astro b/src/components/Paging.astro
index 63f2323f..470afd15 100644
--- a/src/components/Paging.astro
+++ b/src/components/Paging.astro
@@ -29,7 +29,7 @@ const {
 >
   {
     prevURL && (
-      <a href={prevURL} class="font-bold">
+      <a href={prevURL} class="font-bold dark:text-white">
         <ArrowLeftIcon
           className="w-5 h-5 inline-block relative"
           style={{ top: "-1px" }}
@@ -40,7 +40,7 @@ const {
   }
   {
     nextURL && (
-      <a href={nextURL} class="font-bold">
+      <a href={nextURL} class="font-bold dark:text-white">
         {nextLabel}{" "}
         <ArrowRightIcon
           className="w-5 h-5 inline-block relative"
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 00d931bf..31a3d211 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -144,7 +144,7 @@ import "../styles/global.css"
     }
     <StructuredData data={jsonLd} />
   </head>
-  <body>
+  <body class="dark:bg-slate-800">
     <Header />
     <div class="mx-auto">
       <slot />
diff --git a/src/pages/support-ddev.astro b/src/pages/support-ddev.astro
index 23a5b1a9..898bc4e4 100644
--- a/src/pages/support-ddev.astro
+++ b/src/pages/support-ddev.astro
@@ -64,8 +64,8 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12">
-        <h2>Sponsor Development</h2>
+      <div class="prose mt-12 dark:text-white">
+        <h2 class="dark:text-white">Sponsor Development</h2>
         <p>
           We’re grateful for our sponsors, and all contributions to the DDEV
           Foundation go entirely toward development. We can always use resources
@@ -87,8 +87,8 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12">
-        <h2>Help Others</h2>
+      <div class="prose mt-12 dark:text-white">
+        <h2 class="dark:text-white">Help Others</h2>
         <p>
           There’s no shortage of questions on Discord, GitHub, and Stack
           Overflow. If you can help someone out, it helps us focus more on
@@ -116,8 +116,8 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12">
-        <h2>Improve the Docs</h2>
+      <div class="prose mt-12 dark:text-white">
+        <h2 class="dark:text-white">Improve the Docs</h2>
         <p>
           It doesn’t matter whether you’ve found a typo, can wordsmith something
           to better explain or fit <a
@@ -155,8 +155,8 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12">
-        <h2>Spread the Word</h2>
+      <div class="prose mt-12 dark:text-white">
+        <h2 class="dark:text-white">Spread the Word</h2>
         <p>
           If you like using DDEV, don’t keep it to yourself! Star the project <a
             href={GITHUB_URL}
@@ -197,8 +197,8 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12">
-        <h2>Join the Advisory Group</h2>
+      <div class="prose mt-12 dark:text-white">
+        <h2 class="dark:text-white">Join the Advisory Group</h2>
         <p>
           We meet regularly to discuss DDEV’s present and future. You’re welcome
           to join us!

From e2b2550823b709a9612e18851836eb073b41e55a Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Mon, 18 Sep 2023 19:28:32 +0300
Subject: [PATCH 02/15] ddev darkmode version version 2.0.

---
 src/components/AppLogos.astro         |  4 ++--
 src/components/Benefits.astro         |  6 +++---
 src/components/FeaturedSponsors.astro |  2 +-
 src/components/Features.astro         |  4 ++--
 src/components/Footer.astro           |  2 +-
 src/components/Header.astro           |  2 +-
 src/components/Hero.astro             |  4 ++--
 src/components/SoftwareLogos.astro    |  2 +-
 src/pages/index.astro                 |  2 +-
 src/styles/global.css                 | 31 +++++++++++++++++++++++++++
 10 files changed, 45 insertions(+), 14 deletions(-)

diff --git a/src/components/AppLogos.astro b/src/components/AppLogos.astro
index ea37f848..23bd3967 100644
--- a/src/components/AppLogos.astro
+++ b/src/components/AppLogos.astro
@@ -15,12 +15,12 @@ const logos = [
 
 <div class="opacity-60">
   <div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
-    <div class="flex justify-center content-center flex-wrap">
+    <div class="flex justify-center content-center flex-wrap ">
       {
         logos.map((logo) => (
           <div class="px-12 py-6">
             <img
-              class={["h-12", ...logo.extraClasses].join(" ")}
+              class={["h-12 dark:invert", ...logo.extraClasses].join(" ")}
               src={logo.src}
               alt={`${logo.name} logo`}
             />
diff --git a/src/components/Benefits.astro b/src/components/Benefits.astro
index ab5c482a..6b598915 100644
--- a/src/components/Benefits.astro
+++ b/src/components/Benefits.astro
@@ -39,14 +39,14 @@ const features = [
 ]
 ---
 
-<div class="bg-white dark:bg-slate-600">
+<div class="bg-white dark:bg-slate-900">
   <div class="max-w-6xl mx-auto py-16 px-4 sm:px-6 lg:py-24 lg:px-8">
     <div class="max-w-3xl mx-auto text-center">
       <h2 class="text-base font-mono text-navy-300 mb-3 dark:text-white">Benefits</h2>
       <h3 class="text-3xl font-extrabold text-gray-900 dark:text-white">
         Made for people that make websites.
       </h3>
-      <p class="mt-4 text-lg text-gray-500 dark:text-white">
+      <p class="mt-4 text-lg text-gray-500 dark:text-slate-400">
         DDEV handles Docker so you and your team can focus on your work.
       </p>
     </div>
@@ -65,7 +65,7 @@ const features = [
                 {feature.name}
               </p>
             </dt>
-            <dd class="mt-2 ml-9 text-base text-gray-500 dark:text-white">
+            <dd class="mt-2 ml-9 text-base text-gray-500 dark:text-slate-400">
               {feature.description}
             </dd>
           </div>
diff --git a/src/components/FeaturedSponsors.astro b/src/components/FeaturedSponsors.astro
index 3a5591a0..92c40829 100644
--- a/src/components/FeaturedSponsors.astro
+++ b/src/components/FeaturedSponsors.astro
@@ -44,7 +44,7 @@ featuredSponsors.map((sponsor) => {
         >
           <img
             src={sponsor.logo}
-            class="block w-auto h-full"
+            class="block w-auto h-full dark:invert"
             alt={`${sponsor.name} logo`}
           />
         </a>
diff --git a/src/components/Features.astro b/src/components/Features.astro
index d3bd12c6..51e527b8 100644
--- a/src/components/Features.astro
+++ b/src/components/Features.astro
@@ -80,7 +80,7 @@ const features = [
     <p class="mt-2 text-3xl font-bold text-gray-900 sm:text-4xl dark:text-white">
       Running in minutes, ready for the long haul.
     </p>
-    <p class="mx-auto mt-5 max-w-prose text-xl text-gray-500 dark:text-white">
+    <p class="mx-auto mt-5 max-w-prose text-xl text-gray-500 dark:text-slate-400">
       Start new DDEV projects in seconds. Customize, share, and extend with
       ease.
     </p>
@@ -103,7 +103,7 @@ const features = [
                   <h3 class="text-lg font-medium tracking-tight text-gray-900 dark:text-white">
                     {feature.name}
                   </h3>
-                  <p class="mt-5 text-base text-gray-500">
+                  <p class="mt-5 text-base text-gray-500 dark:text-slate-400">
                     {feature.description}
                   </p>
                 </div>
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index dedea283..a1e4decd 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -52,7 +52,7 @@ const navigation = {
 }
 ---
 
-<footer>
+<footer class="dark:bg-slate-900">
   <div class="max-w-4xl mx-auto py-12 px-6 lg:px-0 lg:py-16">
     <div class="pb-8 xl:grid xl:grid-cols-3 xl:gap-8">
       <div class="grid grid-cols-auto gap-8 xl:col-span-4">
diff --git a/src/components/Header.astro b/src/components/Header.astro
index 7443ea9f..1d79da37 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -70,7 +70,7 @@ import {
     <a href="/" class="relative block cursor-pointer -ml-2 ">
       <span class="sr-only">DDEV logo</span>
       <img
-        class="h-8 w-auto sm:h-10"
+        class="h-8 w-auto sm:h-10 dark:invert" 
         src="/logos/ddev.svg"
         alt="DDEV logo"
         aria-hidden="true"
diff --git a/src/components/Hero.astro b/src/components/Hero.astro
index b4a80758..862b8eb2 100644
--- a/src/components/Hero.astro
+++ b/src/components/Hero.astro
@@ -15,7 +15,7 @@ import { CloudIcon } from "@heroicons/react/24/solid/index.js"
       <h1 class="text-5xl font-bold dark:text-white">
         Docker-based PHP development environments.
       </h1>
-      <h2 class="text-2xl my-6 dark:text-white">
+      <h2 class="text-2xl my-6 dark:text-slate-400">
         Container superpowers with zero required Docker skills: environments in
         minutes, multiple concurrent projects, and less time to deployment.
       </h2>
@@ -34,7 +34,7 @@ import { CloudIcon } from "@heroicons/react/24/solid/index.js"
     </div>
 
     <div class="mt-4 text-slate-500 max-w-2xl px-6 lg:px-0">
-      <ul class="flex flex-wrap space-x-7 justify-center md:justify-start">
+      <ul class="flex flex-wrap space-x-7 justify-center md:justify-start dark:text-slate-400">
         <li class="whitespace-nowrap my-1">
           <span class="w-4 h-4 inline-block mr-1 relative top-[2px]"
             ><Icon name="Apple" />
diff --git a/src/components/SoftwareLogos.astro b/src/components/SoftwareLogos.astro
index b3618890..f8b178b8 100644
--- a/src/components/SoftwareLogos.astro
+++ b/src/components/SoftwareLogos.astro
@@ -3,7 +3,7 @@
 
 <div class="opacity-60">
   <div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
-    <div class="flex justify-center content-center flex-wrap">
+    <div class="flex justify-center content-center flex-wrap dark:invert">
       <div class="p-10">
         <img class="h-12" src="/logos/php.svg" alt="PHP logo" />
       </div>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index acb641dd..adda6db4 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -37,7 +37,7 @@ const jsonUrl = new URL(`/blog/feed.json`, Astro.site).toString()
     <div>
       <div class="max-w-4xl mx-auto py-24 px-6 lg:px-0">
         <div
-          class="grid gap-x-6 gap-y-8 md:gap-y-12 grid-cols-1 md:grid-cols-3"
+          class="grid gap-x-6 gap-y-8 md:gap-y-12 grid-cols-1 md:grid-cols-3 dark:text-white"
         >
           <RepoCard
             name={GITHUB_REPO}
diff --git a/src/styles/global.css b/src/styles/global.css
index b416c3e4..a68f0a22 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -20,6 +20,37 @@ footer {
   }
 }
 
+@media (prefers-color-scheme: dark){
+  
+  header {
+    a[target="_blank"] {
+      &::after {
+        @apply inline-block w-3 h-3 ml-1 relative;
+        content: "";
+        top: 1px;
+        filter: invert(42%) sepia(93%) saturate(1352%) hue-rotate(87deg) brightness(119%) contrast(119%);
+        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='currentColor' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M13.5 6H5.25A2.25 2.25 0 003 8.25v10.5A2.25 2.25 0 005.25 21h10.5A2.25 2.25 0 0018 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25' /%3E%3C/svg%3E");
+      }
+    }
+  }
+
+  footer {
+    ul a[target="_blank"] {
+      &::after {
+        content: "";
+        @apply inline-block w-3 h-3 ml-0 relative opacity-25;
+        top: 1px;
+        filter: invert(42%) sepia(93%) saturate(1352%) hue-rotate(87deg) brightness(119%) contrast(119%);
+        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='currentColor' class='w-6 h-6'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M13.5 6H5.25A2.25 2.25 0 003 8.25v10.5A2.25 2.25 0 005.25 21h10.5A2.25 2.25 0 0018 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25' /%3E%3C/svg%3E");
+      }
+    }
+  }
+
+}
+
+
+
+
 /* Alt text styling for a not-yet-loaded image */
 img {
   @apply font-mono text-sm text-gray-500;

From 8adb98a2625af1c683749538281bcccae7da1f9e Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Wed, 20 Sep 2023 15:45:32 +0300
Subject: [PATCH 03/15] ddev darkmode version version 3.0 fixed bugs with get
 started pages and the blogs.

---
 src/components/BlogPostFooter.astro     | 10 ++++----
 src/components/FeatureImage.astro       |  4 ++--
 src/components/Heading.astro            |  8 +++----
 src/components/PlatformPicker.astro     |  4 ++--
 src/components/PostBody.astro           |  2 +-
 src/components/Tabs.astro               |  4 +++-
 src/components/quickstart/Cloud.astro   |  8 +++----
 src/components/quickstart/Linux.astro   | 28 +++++++++++-----------
 src/components/quickstart/Mac.astro     | 32 ++++++++++++-------------
 src/components/quickstart/Windows.astro | 12 +++++-----
 src/pages/about.astro                   |  3 ++-
 src/pages/blog/author/[slug].astro      |  2 +-
 src/pages/blog/category/[slug].astro    |  2 +-
 src/pages/get-started.astro             |  2 +-
 src/pages/support-ddev.astro            | 28 +++++++++++-----------
 15 files changed, 76 insertions(+), 73 deletions(-)

diff --git a/src/components/BlogPostFooter.astro b/src/components/BlogPostFooter.astro
index 7416d114..cbc12cd9 100644
--- a/src/components/BlogPostFooter.astro
+++ b/src/components/BlogPostFooter.astro
@@ -38,10 +38,10 @@ orderedPosts.forEach((post, index) => {
         title={`Previous: ${prev.data.title}`}
       >
         <div>
-          <span class="font-mono text-sm block text-navy-300 tracking-wider">
+          <span class="font-mono text-sm block text-navy-300 tracking-wider dark:text-slate-500">
             Previous Post
           </span>
-          <span class="py-3 md:w-full font-bold">{prev.data.title}</span>
+          <span class="py-3 md:w-full font-bold dark:text-slate-400">{prev.data.title}</span>
         </div>
       </a>
     )
@@ -51,14 +51,14 @@ orderedPosts.forEach((post, index) => {
       <a
         href={`/blog/${next.slug}`}
         rel="prefetch"
-        class="flex border items-center rounded-md w-full my-1 md:my-0 content-center justify-start md:justify-end md:text-right p-4 hover:border-blue-300 hover:shadow-sm"
+        class="flex border items-center rounded-md w-full my-1 md:my-0 content-center justify-start md:justify-end md:text-right p-4 hover:border-blue-300 hover:shadow-sm dark:text-slate-400"
         title={`Next: ${next.data.title}`}
       >
         <div>
-          <span class="font-mono text-sm block text-navy-300 tracking-wider">
+          <span class="font-mono text-sm block text-navy-300 tracking-wider dark:text-slate-500">
             Next Post
           </span>
-          <span class="py-3 md:w-full font-bold">{next.data.title}</span>
+          <span class="py-3 md:w-full font-bold dark:text-slate-400">{next.data.title}</span>
         </div>
       </a>
     )
diff --git a/src/components/FeatureImage.astro b/src/components/FeatureImage.astro
index 23fdddfe..674bd7e8 100644
--- a/src/components/FeatureImage.astro
+++ b/src/components/FeatureImage.astro
@@ -40,10 +40,10 @@ const { src, alt, caption = "", credit, shadow = false } = Astro.props
   }
   {
     (caption || credit) && (
-      <figcaption class="text-sm font-mono mt-4">
+      <figcaption class="text-sm font-mono mt-4 dark:text-slate-400">
         {caption && <span set:html={marked.parseInline(caption)} />}
         {credit && (
-          <span class="text-gray-500">
+          <span class="text-gray-500 dark:text-slate-400">
             {caption && <span aria-hidden="true"> </span>}
             <span set:html={`${marked.parseInline(credit)}`} />
           </span>
diff --git a/src/components/Heading.astro b/src/components/Heading.astro
index 64444578..b3ad02ba 100644
--- a/src/components/Heading.astro
+++ b/src/components/Heading.astro
@@ -24,8 +24,8 @@ const { title, subtitle, date, author, authorUrl, authorAvatar, readTime } =
 ---
 
 <div class="my-24 px-6 lg:px-0">
-  <h1 class="font-bold text-4xl">{title}</h1>
-  {subtitle && <p class="text-2xl text-gray-600 my-4">{subtitle}</p>}
+  <h1 class="font-bold text-4xl dark:text-white">{title}</h1>
+  {subtitle && <p class="text-2xl text-gray-600 my-4 dark:text-slate-400">{subtitle}</p>}
 
   <div class="md:flex md:items-center md:content-center my-6 font-mono">
     {
@@ -41,14 +41,14 @@ const { title, subtitle, date, author, authorUrl, authorAvatar, readTime } =
             </div>
           )}
           {author && (
-            <div class={authorAvatar ? `ml-1` : ``}>
+            <div class={authorAvatar ? `ml-1 dark:text-white` : ``}>
               <a href={authorUrl}>{author}</a>
             </div>
           )}
         </div>
       )
     }
-    <p class="mt-4 md:mt-0">
+    <p class="mt-4 md:mt-0 dark:text-white">
       {
         date && (
           <span>
diff --git a/src/components/PlatformPicker.astro b/src/components/PlatformPicker.astro
index 420e5b70..74bbbe83 100644
--- a/src/components/PlatformPicker.astro
+++ b/src/components/PlatformPicker.astro
@@ -113,8 +113,8 @@ const { heading, inputName = "platform" } = Astro.props
   }
 </script>
 
-<div class="choose px-6 lg:px-0">
-  {heading && <h2>{heading}</h2>}
+<div class="choose px-6 lg:px-0 dark:text-slate-400">
+  {heading && <h2 class="dark:text-white">{heading}</h2>}
   <div class="choose-platform flex">
     <div class="w-full">
       <input
diff --git a/src/components/PostBody.astro b/src/components/PostBody.astro
index 261f9215..8bcde6a3 100644
--- a/src/components/PostBody.astro
+++ b/src/components/PostBody.astro
@@ -4,6 +4,6 @@
  */
 ---
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <slot />
 </div>
diff --git a/src/components/Tabs.astro b/src/components/Tabs.astro
index 955a6c6f..7339075b 100644
--- a/src/components/Tabs.astro
+++ b/src/components/Tabs.astro
@@ -118,7 +118,9 @@ order.map((label) => {
             id={`tab-${tab.uid}`}
             class={`tab` + (index === 0 ? ` active` : ``)}
           >
-            <span>{tab.label}</span>
+            <span
+            class={"dark:text-slate-200"}
+            >{tab.label}</span>
           </button>
         ))
       }
diff --git a/src/components/quickstart/Cloud.astro b/src/components/quickstart/Cloud.astro
index 416b05cf..ef246d70 100644
--- a/src/components/quickstart/Cloud.astro
+++ b/src/components/quickstart/Cloud.astro
@@ -12,7 +12,7 @@ const { latestVersion } = Astro.props
 ---
 
 <div class="prose">
-  <h2 class="text-3xl mt-24">
+  <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">1/2</small>Launch a
     Provider &amp; Install DDEV
   </h2>
@@ -39,7 +39,7 @@ const { latestVersion } = Astro.props
       </a>
     </Fragment>
     <Fragment slot="GitHub Codespaces">
-      <div class="prose py-5">
+      <div class="prose py-5 dark:text-slate-400">
         <ol>
           <li>
             <a href="https://github.com/codespaces/new"
@@ -81,7 +81,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose">
-  <h2 class="text-3xl mt-24">
+  <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">2/2</small>Create a
     Project
   </h2>
@@ -119,7 +119,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose">
-  <h2 class="text-3xl mt-24">Explore & Enjoy!</h2>
+  <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
     Take a peek at your project’s new <code>.ddev/</code> directory. You can add
diff --git a/src/components/quickstart/Linux.astro b/src/components/quickstart/Linux.astro
index 1a752b95..a09bbb1e 100644
--- a/src/components/quickstart/Linux.astro
+++ b/src/components/quickstart/Linux.astro
@@ -10,22 +10,22 @@ export interface Props {
 const { latestVersion } = Astro.props
 ---
 
-<div class="prose">
-  <p class="text-gray-600 mb-16">
+<div class="prose dark:text-slate-400">
+  <p class="text-gray-600 mb-16 dark:text-slate-400">
     We’ll install Docker and DDEV with your package manager, as detailed in the <a
       href="https://ddev.readthedocs.io/en/latest/users/install/ddev-installation/"
       >Linux installation docs</a
     >.
   </p>
 
-  <h2 class="text-3xl mt-24">
+  <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">1/3</small>Install
     Docker
   </h2>
 
   <Tabs order={["Ubuntu", "CentOS", "Debian", "Fedora"]}>
     <Fragment slot="Ubuntu">
-      <div class="prose py-5">
+      <div class="prose py-5 dark:text-slate-400">
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/ubuntu/"
@@ -39,7 +39,7 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="CentOS">
-      <div class="prose py-5">
+      <div class="prose py-5 dark:text-slate-400">
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/centos/"
@@ -54,7 +54,7 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="Debian">
-      <div class="prose py-5">
+      <div class="prose py-5 dark:text-slate-400">
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/debian/"
@@ -69,7 +69,7 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="Fedora">
-      <div class="prose py-5">
+      <div class="prose py-5 dark:text-slate-400">
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/fedora/"
@@ -87,13 +87,13 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose">
-  <h2 class="text-3xl mt-24">
+  <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">2/3</small>Install DDEV
   </h2>
 
   <Tabs order={["Ubuntu", "CentOS", "Debian", "Fedora"]}>
     <Fragment slot="Ubuntu">
-      <div class="prose py-5">
+      <div class="prose py-5 dark:text-slate-400">
         <Terminal
           type="ubuntu"
           code={`$ curl -fsSL https://pkg.ddev.com/apt/gpg.key | gpg --dearmor | sudo tee /etc/apt/trusted.gpg.d/ddev.gpg > /dev/null\n$ echo "deb [signed-by=/etc/apt/trusted.gpg.d/ddev.gpg] https://pkg.ddev.com/apt/ * *" | sudo tee /etc/apt/sources.list.d/ddev.list\n$ sudo apt update && sudo apt install -y ddev
@@ -102,7 +102,7 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="CentOS">
-      <div class="prose py-5">
+      <div class="prose py-5 dark:text-slate-400">
         <Terminal
           type="ubuntu"
           code={`$ echo '[ddev]\nname=DDEV Repo\nbaseurl=https://pkg.ddev.com/yum/\nenabled=1\ngpgcheck=0' | sudo tee -a /etc/yum.repos.d/ddev.repo\n$ sudo dnf install --refresh ddev`}
@@ -110,7 +110,7 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="Debian">
-      <div class="prose py-5">
+      <div class="prose py-5 dark:text-slate-400">
         <Terminal
           type="ubuntu"
           code={`$ curl -fsSL https://pkg.ddev.com/apt/gpg.key | gpg --dearmor | sudo tee /etc/apt/trusted.gpg.d/ddev.gpg > /dev/null\n$ echo "deb [signed-by=/etc/apt/trusted.gpg.d/ddev.gpg] https://pkg.ddev.com/apt/ * *" | sudo tee /etc/apt/sources.list.d/ddev.list\n$ sudo apt update && sudo apt install -y ddev
@@ -119,7 +119,7 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="Fedora">
-      <div class="prose py-5">
+      <div class="prose py-5 dark:text-slate-400">
         <Terminal
           type="ubuntu"
           code={`$ echo '[ddev]\nname=DDEV Repo\nbaseurl=https://pkg.ddev.com/yum/\nenabled=1\ngpgcheck=0' | sudo tee -a /etc/yum.repos.d/ddev.repo\n$ sudo dnf install --refresh ddev`}
@@ -133,7 +133,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose">
-  <h2 class="text-3xl mt-24">
+  <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">3/3</small>Create a
     Project
   </h2>
@@ -174,7 +174,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose">
-  <h2 class="text-3xl mt-24">Explore & Enjoy!</h2>
+  <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
     Take a peek at your project’s new <code>.ddev/</code> directory. You can add
diff --git a/src/components/quickstart/Mac.astro b/src/components/quickstart/Mac.astro
index 293261b3..8a2fd1af 100644
--- a/src/components/quickstart/Mac.astro
+++ b/src/components/quickstart/Mac.astro
@@ -10,15 +10,15 @@ export interface Props {
 const { latestVersion } = Astro.props
 ---
 
-<div class="prose">
-  <p class="text-gray-600 mb-16">
-    We’ll use Docker Desktop since it’s the most straightforward of <a
+<div class="prose dark:text-slate-400">
+  <p class="text-gray-600 mb-16 dark:text-slate-400">
+    We’ll use Docker Desktop since it’s the most straightforward of <a class="dark:text-slate-200"
       href="https://ddev.readthedocs.io/en/latest/users/install/docker-installation/#macos"
       >several options</a
     >.
   </p>
 
-  <h2 class="text-3xl mt-24">
+  <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">1/3</small>Install
     Docker
   </h2>
@@ -26,7 +26,7 @@ const { latestVersion } = Astro.props
 
 <Tabs order={["Homebrew", "Download"]}>
   <Fragment slot="Homebrew">
-    <div class="prose py-5">
+    <div class="prose py-5 dark:text-slate-400">
       <p>
         With <a href="https://brew.sh" target="_blank">Homebrew</a> installed, you
         can install Docker Desktop with one command:
@@ -35,7 +35,7 @@ const { latestVersion } = Astro.props
     </div>
   </Fragment>
   <Fragment slot="Download">
-    <div class="prose py-5">
+    <div class="prose py-5 dark:text-slate-400">
       <p>
         Download and run the <a
           href="https://www.docker.com/products/docker-desktop"
@@ -46,7 +46,7 @@ const { latestVersion } = Astro.props
   </Fragment>
 </Tabs>
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <p>
     Launch Docker Desktop, accept the license agreement, and make sure Docker is
     started and running.
@@ -55,19 +55,19 @@ const { latestVersion } = Astro.props
   <p>Confirm that you’ve now got a Docker provider:</p>
   <Terminal code={`→ docker -v\nDocker version 24.0.5, build ced0996`} />
 
-  <h2 class="text-3xl mt-24">
+  <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">2/3</small>Install DDEV
   </h2>
 </div>
 
 <Tabs order={["Homebrew", "Install Script"]}>
   <Fragment slot="Homebrew">
-    <div class="prose py-5">
+    <div class="prose py-5 dark:text-slate-400">
       <Terminal code={`→ brew install ddev/ddev/ddev`} />
     </div>
   </Fragment>
   <Fragment slot="Install Script">
-    <div class="prose py-5">
+    <div class="prose py-5 dark:text-slate-400">
       <Terminal
         code={`→ curl -fsSL https://ddev.com/install.sh | bash`}
       />
@@ -75,11 +75,11 @@ const { latestVersion } = Astro.props
   </Fragment>
 </Tabs>
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <p>Confirm that you’ve now got DDEV installed: 🎉</p>
   <Terminal code={`→ ddev -v\nddev version ${latestVersion}`} />
 
-  <h2 class="text-3xl mt-24">
+  <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">3/3</small>Create a
     Project
   </h2>
@@ -119,8 +119,8 @@ const { latestVersion } = Astro.props
   <Terminal code={`→ ddev launch`} />
 </div>
 
-<div class="prose">
-  <h2 class="text-3xl mt-24">Explore & Enjoy!</h2>
+<div class="prose dark:text-slate-400">
+  <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
     Take a peek at your project’s new <code>.ddev/</code> directory. You can add
@@ -195,12 +195,12 @@ const { latestVersion } = Astro.props
 
   <Tabs order={["Homebrew", "Install Script"]}>
     <Fragment slot="Homebrew">
-      <div class="prose py-5">
+      <div class="prose py-5 dark:text-slate-400">
         <Terminal code={`→ brew uninstall ddev`} />
       </div>
     </Fragment>
     <Fragment slot="Install Script">
-      <div class="prose py-5">
+      <div class="prose py-5 dark:text-slate-400">
         <Terminal code={`→ rm /usr/local/bin/ddev`} />
       </div>
     </Fragment>
diff --git a/src/components/quickstart/Windows.astro b/src/components/quickstart/Windows.astro
index 32435def..14e6e7ed 100644
--- a/src/components/quickstart/Windows.astro
+++ b/src/components/quickstart/Windows.astro
@@ -9,8 +9,8 @@ export interface Props {
 const { latestVersion } = Astro.props
 ---
 
-<div class="prose">
-  <p class="text-gray-600 mb-16">
+<div class="prose dark:text-slate-400">
+  <p class="text-gray-600 mb-16 dark:text-slate-400">
     We’ll use WSL2 with Docker inside since it’s the fastest and most
     straightforward of <a
       href="https://ddev.readthedocs.io/en/latest/users/install/docker-installation/#windows"
@@ -18,7 +18,7 @@ const { latestVersion } = Astro.props
     >.
   </p>
 
-  <h2 class="text-3xl mt-24">
+  <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">1/3</small>Install WSL2
     with Ubuntu
   </h2>
@@ -44,7 +44,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose">
-  <h2 class="text-3xl mt-24">
+  <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">2/3</small>Run the
     Install Script
   </h2>
@@ -67,7 +67,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose">
-  <h2 class="text-3xl mt-24">
+  <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">3/3</small>Create a
     Project
   </h2>
@@ -108,7 +108,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose">
-  <h2 class="text-3xl mt-24">Explore & Enjoy!</h2>
+  <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
     Take a peek at your project’s new <code>.ddev/</code> directory. You can add
diff --git a/src/pages/about.astro b/src/pages/about.astro
index 06b5aa1b..0617d60d 100644
--- a/src/pages/about.astro
+++ b/src/pages/about.astro
@@ -106,8 +106,9 @@ const releaseData = await getReleases()
                   src="https://stars.medv.io/ddev/ddev.svg"
                   alt="Sparkline chart of DDEV’s GitHub stars over time"
                 />
-                <figcaption>
+                <figcaption class="dark:text-slate-400">
                   Project GitHub stars over time, courtesy of <a
+                    class="dark:text-slate-200"
                     href="https://stars.medv.io/"
                     target="_blank">stars.medv.io</a
                   >.
diff --git a/src/pages/blog/author/[slug].astro b/src/pages/blog/author/[slug].astro
index d03da036..ff8e94de 100644
--- a/src/pages/blog/author/[slug].astro
+++ b/src/pages/blog/author/[slug].astro
@@ -40,7 +40,7 @@ const { Content } = await author.render()
 >
   <main class="max-w-4xl mx-auto mb-24">
     <div class="lg:flex lg:space-x-12 py-24 px-6 lg:px-0">
-      <h1 class="font-bold text-4xl">{author.data.name}</h1>
+      <h1 class="font-bold text-4xl dark:text-white">{author.data.name}</h1>
       <div class="prose mt-6 lg:mt-0">
         <Content />
       </div>
diff --git a/src/pages/blog/category/[slug].astro b/src/pages/blog/category/[slug].astro
index 7f5580ef..c9b5359f 100644
--- a/src/pages/blog/category/[slug].astro
+++ b/src/pages/blog/category/[slug].astro
@@ -42,7 +42,7 @@ const title = `Posts in “${name}”`
 >
   <main class="max-w-4xl mx-auto mb-24">
     <div class="py-24 px-6 lg:px-0">
-      <h1 class="font-bold text-4xl">Posts in “{name}”</h1>
+      <h1 class="font-bold text-4xl dark:text-white">Posts in “{name}”</h1>
     </div>
 
     <div
diff --git a/src/pages/get-started.astro b/src/pages/get-started.astro
index 4dfa3a45..134a0cd2 100644
--- a/src/pages/get-started.astro
+++ b/src/pages/get-started.astro
@@ -27,7 +27,7 @@ const latestRelease = await getLatestReleaseVersion()
   title={title}
   description={`Start here if you want to give DDEV a try!`}
 >
-  <main class="max-w-4xl mx-auto mb-24">
+  <main class="max-w-4xl mx-auto mb-24 dark:text-white">
     <Heading title={title} subtitle={`Install and start using DDEV.`} />
     <div class="prose mb-16">
       <PlatformPicker heading={`Choose your platform:`} />
diff --git a/src/pages/support-ddev.astro b/src/pages/support-ddev.astro
index 898bc4e4..d315ca71 100644
--- a/src/pages/support-ddev.astro
+++ b/src/pages/support-ddev.astro
@@ -24,7 +24,7 @@ const title = `Support DDEV`
     <Heading title={title} subtitle={`We’d love your help!`} />
 
     <div class="px-6 lg:px-0">
-      <div class="prose text-lg mt-0 mb-24">
+      <div class="prose text-lg mt-0 mb-24 dark:text-slate-400">
         <p>
           DDEV exists because of the generosity of community members and
           sponsors.<br />
@@ -32,12 +32,12 @@ const title = `Support DDEV`
         </p>
       </div>
 
-      <div class="prose mt-12">
-        <h2>File an Issue or PR</h2>
+      <div class="prose mt-12 dark:text-slate-400">
+        <h2 class="dark:text-white">File an Issue or PR</h2>
 
         <p>
           If you have an idea, a bug report, or code to contribute, please take
-          the time to <a
+          the time to <a class="dark:text-slate-400"
             href="https://github.com/ddev/ddev/blob/master/CONTRIBUTING.md"
             target="_blank">contribute</a
           > a GitHub Issue or Pull Request.
@@ -64,7 +64,7 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12 dark:text-white">
+      <div class="prose mt-12 dark:text-slate-400">
         <h2 class="dark:text-white">Sponsor Development</h2>
         <p>
           We’re grateful for our sponsors, and all contributions to the DDEV
@@ -87,7 +87,7 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12 dark:text-white">
+      <div class="prose mt-12 dark:text-slate-400">
         <h2 class="dark:text-white">Help Others</h2>
         <p>
           There’s no shortage of questions on Discord, GitHub, and Stack
@@ -116,11 +116,11 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12 dark:text-white">
+      <div class="prose mt-12 dark:text-slate-400">
         <h2 class="dark:text-white">Improve the Docs</h2>
         <p>
           It doesn’t matter whether you’ve found a typo, can wordsmith something
-          to better explain or fit <a
+          to better explain or fit <a class="dark:text-slate-200"
             href="https://ddev.readthedocs.io/en/latest/developers/writing-style-guide/"
             target="_blank">our style guide</a
           >, or you’d like to suggest an entirely new section or use case. We’d
@@ -139,7 +139,7 @@ const title = `Support DDEV`
             }}
           />
 
-          <figcaption>
+          <figcaption class="dark:text-slate-400">
             The edit icon in the published docs links to the relevant GitHub
             source for suggestions.
           </figcaption>
@@ -165,18 +165,18 @@ const title = `Support DDEV`
           video.
         </p>
 
-        <blockquote class="twitter-tweet">
+        <blockquote class="twitter-tweet dark:text-slate-400">
           <p lang="en" dir="ltr">
-            <a
+            <a class="dark:text-slate-200"
               href="https://twitter.com/hashtag/fedora?src=hash&ref_src=twsrc%5Etfw"
               >#fedora</a
-            > 36 (just upgraded from 35) still happily runs <a
+            > 36 (just upgraded from 35) still happily runs <a class="dark:text-slate-200"
               href="https://twitter.com/hashtag/ddev?src=hash&ref_src=twsrc%5Etfw"
               >#ddev</a
-            > , one of my most used tools. <a href="https://t.co/9dPAs8BTqg"
+            > , one of my most used tools. <a  class="dark:text-slate-200" href="https://t.co/9dPAs8BTqg"
               >pic.twitter.com/9dPAs8BTqg</a
             >
-          </p>&mdash; Novák Áron (@NovakAron) <a
+          </p>&mdash; Novák Áron (@NovakAron) <a class="dark:text-slate-200"
             href="https://twitter.com/NovakAron/status/1541396362885054465?ref_src=twsrc%5Etfw"
             >June 27, 2022</a
           >

From e0adafa8fa217917236722df5570b5da21707ffa Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sat, 23 Sep 2023 11:14:22 -0600
Subject: [PATCH 04/15] ddev darkmode 3.1 fixes.

---
 src/components/quickstart/Mac.astro | 23 +++++++++++++++--------
 src/styles/global.css               |  4 +++-
 2 files changed, 18 insertions(+), 9 deletions(-)

diff --git a/src/components/quickstart/Mac.astro b/src/components/quickstart/Mac.astro
index 8a2fd1af..2f8f865e 100644
--- a/src/components/quickstart/Mac.astro
+++ b/src/components/quickstart/Mac.astro
@@ -28,7 +28,7 @@ const { latestVersion } = Astro.props
   <Fragment slot="Homebrew">
     <div class="prose py-5 dark:text-slate-400">
       <p>
-        With <a href="https://brew.sh" target="_blank">Homebrew</a> installed, you
+        With <a href="https://brew.sh" class="dark:text-white" target="_blank">Homebrew</a> installed, you
         can install Docker Desktop with one command:
       </p>
       <Terminal code={`→ brew install --cask docker`} />
@@ -39,6 +39,7 @@ const { latestVersion } = Astro.props
       <p>
         Download and run the <a
           href="https://www.docker.com/products/docker-desktop"
+          class="dark:text-white"
           target="_blank">Docker Desktop installer</a
         >.
       </p>
@@ -91,7 +92,7 @@ const { latestVersion } = Astro.props
     Initialize the project by running the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#config"
       target="_blank"
-      ><code>ddev config</code>
+      ><code class="dark:text-white">ddev config</code>
     </a> command:
   </p>
   <Terminal code={`→ ddev config`} />
@@ -106,13 +107,14 @@ const { latestVersion } = Astro.props
     If it’s a Composer project, you may also need to run <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#composer"
       target="_blank"
-      ><code>ddev composer install</code>
+      ><code class="dark:text-white">ddev composer install</code>
     </a>.
   </p>
 
   <p>
     Now run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#launch"
+      class="dark:text-white"
       target="_blank">launch command</a
     > to open your project in a browser:
   </p>
@@ -123,12 +125,13 @@ const { latestVersion } = Astro.props
   <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
-    Take a peek at your project’s new <code>.ddev/</code> directory. You can add
-    this to your repo to share your DDEV config, edit <code
+    Take a peek at your project’s new <code class="dark:text-white">.ddev/</code> directory. You can add
+    this to your repo to share your DDEV config, edit <code class="dark:text-white"
       >.ddev/ddev.yaml</code
     > to change <a
       href="https://ddev.readthedocs.io/en/latest/users/configuration/config/"
-      target="_blank">project options</a
+      target="_blank"
+      class="dark:text-white">project options</a
     >, or even go about your business and pretend this folder doesn’t exist.
   </p>
 
@@ -136,8 +139,9 @@ const { latestVersion } = Astro.props
     Run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#help"
       target="_blank"
+      class="dark:text-white"
       >help command
-    </a> (or plain <code>ddev</code>) to see the actions you can take with the
+    </a> (or plain <code class="dark:text-white">ddev</code>) to see the actions you can take with the
     CLI:
   </p>
 
@@ -147,6 +151,7 @@ const { latestVersion } = Astro.props
     Use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#describe"
       target="_blank"
+      class="dark:text-white"
       >describe command
     </a> to see a project’s parts and database connection details:
   </p>
@@ -158,6 +163,7 @@ const { latestVersion } = Astro.props
     removing anything, use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#stop"
       target="_blank"
+      class="dark:text-white"
       >stop command
     </a>:
   </p>
@@ -169,6 +175,7 @@ const { latestVersion } = Astro.props
     project and its resources without touching your code, run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#delete"
       target="_blank"
+      class="dark:text-white"
       >delete command
     </a>:
   </p>
@@ -190,7 +197,7 @@ const { latestVersion } = Astro.props
   />
 
   <p>
-    Then remove the <code>ddev</code> binary however you installed it:
+    Then remove the <code class="dark:text-white">ddev</code> binary however you installed it:
   </p>
 
   <Tabs order={["Homebrew", "Install Script"]}>
diff --git a/src/styles/global.css b/src/styles/global.css
index a68f0a22..700b7ac7 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -45,7 +45,9 @@ footer {
       }
     }
   }
-
+  h2{
+    color:white;
+  }
 }
 
 

From f6749ea208df3880dad5641b3f9e30c65724e626 Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sat, 23 Sep 2023 11:27:24 -0600
Subject: [PATCH 05/15] ddev darkmode 3.2 fixes.

---
 src/components/AppLogos.astro | 2 +-
 src/components/Features.astro | 2 +-
 src/components/Header.astro   | 2 +-
 src/styles/global.css         | 3 ---
 4 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/src/components/AppLogos.astro b/src/components/AppLogos.astro
index 23bd3967..37764946 100644
--- a/src/components/AppLogos.astro
+++ b/src/components/AppLogos.astro
@@ -15,7 +15,7 @@ const logos = [
 
 <div class="opacity-60">
   <div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
-    <div class="flex justify-center content-center flex-wrap ">
+    <div class="flex justify-center content-center flex-wrap">
       {
         logos.map((logo) => (
           <div class="px-12 py-6">
diff --git a/src/components/Features.astro b/src/components/Features.astro
index 51e527b8..417c4c1b 100644
--- a/src/components/Features.astro
+++ b/src/components/Features.astro
@@ -76,7 +76,7 @@ const features = [
   <div
     class="mx-auto max-w-md px-4 text-center sm:max-w-3xl sm:px-6 lg:max-w-7xl lg:px-8"
   >
-    <h2 class="text-base font-mono text-navy-300 ">Features</h2>
+    <h2 class="text-base font-mono text-navy-300">Features</h2>
     <p class="mt-2 text-3xl font-bold text-gray-900 sm:text-4xl dark:text-white">
       Running in minutes, ready for the long haul.
     </p>
diff --git a/src/components/Header.astro b/src/components/Header.astro
index 1d79da37..1b0c5af4 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -67,7 +67,7 @@ import {
     class="flex justify-between items-center content-center max-w-4xl mx-auto"
     aria-label="Main"
   >
-    <a href="/" class="relative block cursor-pointer -ml-2 ">
+    <a href="/" class="relative block cursor-pointer -ml-2">
       <span class="sr-only">DDEV logo</span>
       <img
         class="h-8 w-auto sm:h-10 dark:invert" 
diff --git a/src/styles/global.css b/src/styles/global.css
index 700b7ac7..d2f89483 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -45,9 +45,6 @@ footer {
       }
     }
   }
-  h2{
-    color:white;
-  }
 }
 
 

From 5cdae3940ed3616f0efa73ccdb97c16268264770 Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sat, 23 Sep 2023 15:37:56 -0600
Subject: [PATCH 06/15] Added dark:prose-invert and clean up the code.

---
 src/components/BlogPostCard.astro            |  8 ++--
 src/components/PostBody.astro                |  2 +-
 src/components/PostUpdate.astro              |  4 +-
 src/components/quickstart/Cloud.astro        | 39 ++++++++++------
 src/components/quickstart/CommunityCTA.astro |  8 ++--
 src/components/quickstart/Linux.astro        | 49 ++++++++++++++------
 src/components/quickstart/Windows.astro      | 29 ++++++++----
 src/pages/about.astro                        |  2 +-
 src/pages/blog/[slug].astro                  |  4 +-
 src/pages/get-started.astro                  |  2 +-
 src/styles/global.css                        |  7 +++
 11 files changed, 102 insertions(+), 52 deletions(-)

diff --git a/src/components/BlogPostCard.astro b/src/components/BlogPostCard.astro
index 825ef43b..62a51559 100644
--- a/src/components/BlogPostCard.astro
+++ b/src/components/BlogPostCard.astro
@@ -60,15 +60,15 @@ const firstCategory = post.data.categories.length
       )
     }
   </div>
-  <div class="flex-1 bg-gray-100 p-6 flex flex-col justify-between">
+  <div class="flex-1 bg-gray-100 p-6 flex flex-col justify-between dark:bg-slate-600">
     <div class="flex-1">
-      <p class="text-sm font-mono text-indigo-600">
+      <p class="text-sm font-mono text-indigo-600 dark:text-cyan-300">
         <a href={getCategoryUrl(firstCategory)} class="hover:underline">
           {firstCategory}
         </a>
       </p>
       <a href={`/blog/${post.slug}`} class="block mt-2">
-        <p class="text-xl font-semibold text-gray-900">
+        <p class="text-xl font-semibold text-gray-900 dark:text-white">
           {post.data.title}
         </p>
       </a>
@@ -89,7 +89,7 @@ const firstCategory = post.data.categories.length
         )
       }
       <div class={authorImage ? `ml-3` : ``}>
-        <p class="text-sm font-medium text-gray-900">
+        <p class="text-sm font-medium text-gray-900 dark:text-white">
           <a href={`/blog/author/${author.slug}`} class="hover:underline">
             {post.data.author}
           </a>
diff --git a/src/components/PostBody.astro b/src/components/PostBody.astro
index 8bcde6a3..887ebc9d 100644
--- a/src/components/PostBody.astro
+++ b/src/components/PostBody.astro
@@ -4,6 +4,6 @@
  */
 ---
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <slot />
 </div>
diff --git a/src/components/PostUpdate.astro b/src/components/PostUpdate.astro
index 9174329c..71b78455 100644
--- a/src/components/PostUpdate.astro
+++ b/src/components/PostUpdate.astro
@@ -17,9 +17,9 @@ const { date, comment } = Astro.props
 </style>
 
 <aside
-  class="updated-comment w-full rounded-lg text-sm p-6 -mt-8 mb-12 shadow-xl"
+  class="updated-comment w-full rounded-lg text-sm p-6 -mt-8 mb-12 shadow-xl dark:bg-slate-600"
 >
-  <p class="text-navy-500 font-mono uppercase text-xs tracking-wide">
+  <p class="text-navy-500 font-mono uppercase text-xs tracking-wide dark:text-slate-400">
     <b>Updated {formatDate(date, { month: "long" })}</b>
   </p>
   {comment && <div class="mt-2" set:html={marked.parse(comment)} />}
diff --git a/src/components/quickstart/Cloud.astro b/src/components/quickstart/Cloud.astro
index ef246d70..336a1443 100644
--- a/src/components/quickstart/Cloud.astro
+++ b/src/components/quickstart/Cloud.astro
@@ -11,7 +11,7 @@ export interface Props {
 const { latestVersion } = Astro.props
 ---
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">1/2</small>Launch a
     Provider &amp; Install DDEV
@@ -19,10 +19,11 @@ const { latestVersion } = Astro.props
 
   <Tabs order={["Gitpod", "GitHub Codespaces"]}>
     <Fragment slot="Gitpod">
-      <div class="prose pt-5">
+      <div class="prose pt-5 dark:text-slate-400">
         <p>
           <a href="https://www.gitpod.io/docs/getting-started" target="_blank"
-            >Open any repository</a
+          class="dark:text-white"  
+          >Open any repository</a
           > using Gitpod and install DDEV:
         </p>
         <Terminal
@@ -43,11 +44,12 @@ const { latestVersion } = Astro.props
         <ol>
           <li>
             <a href="https://github.com/codespaces/new"
+              class="dark:text-white"
               >Create a new codespace</a
             > for your project or open an existing one.
           </li>
           <li>
-            Edit the project’s <code>.devcontainer/devcontainer.json</code> file
+            Edit the project’s <code class="dark:text-white">.devcontainer/devcontainer.json</code> file
             to include these two lines in the “features” section:
             <Code
               code={`"features": {\n    "ghcr.io/devcontainers/features/docker-in-docker:2": {},\n    "ghcr.io/ddev/ddev/install-ddev:latest": {}\n},`}
@@ -67,6 +69,7 @@ const { latestVersion } = Astro.props
       </div>
       <a
         href="https://github.com/codespaces/new?hide_repo_select=true&ref=20221220_codespaces&repo=80927419&machine=basicLinux32gb&location=WestUs2"
+        class="dark:text-white"
         ><img
           src="https://github.com/codespaces/badge.svg"
           alt="Open in GitHub Codespaces"
@@ -80,7 +83,7 @@ const { latestVersion } = Astro.props
   <Terminal code={`→ ddev -v\nddev version ${latestVersion}`} />
 </div>
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">2/2</small>Create a
     Project
@@ -90,7 +93,8 @@ const { latestVersion } = Astro.props
     Initialize the DDEV project by running the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#config"
       target="_blank"
-      ><code>ddev config</code>
+      class="dark:text-white"
+      ><code class="dark:text-white">ddev config</code>
     </a> command:
   </p>
   <Terminal code={`→ ddev config`} />
@@ -105,29 +109,34 @@ const { latestVersion } = Astro.props
     If it’s a Composer project, you may also need to run <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#composer"
       target="_blank"
-      ><code>ddev composer install</code>
+      class="dark:text-white"
+      ><code class="dark:text-white">ddev composer install</code>
     </a>.
   </p>
 
   <p>
     Now run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#launch"
-      target="_blank">launch command</a
+      target="_blank"
+      class="dark:text-white"
+      >launch command</a
     > to open your project in a browser:
   </p>
   <Terminal code={`→ ddev launch`} />
 </div>
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
-    Take a peek at your project’s new <code>.ddev/</code> directory. You can add
-    this to your repo to share your DDEV config, edit <code
+    Take a peek at your project’s new <code class="dark:text-white">.ddev/</code> directory. You can add
+    this to your repo to share your DDEV config, edit <code class="dark:text-white"
       >.ddev/ddev.yaml</code
     > to change <a
       href="https://ddev.readthedocs.io/en/latest/users/configuration/config/"
-      target="_blank">project options</a
+      target="_blank"
+      class="dark:text-white"
+      >project options</a
     >, or even go about your business and pretend this folder doesn’t exist.
   </p>
 
@@ -135,8 +144,9 @@ const { latestVersion } = Astro.props
     Run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#help"
       target="_blank"
+      class="dark:text-white"
       >help command
-    </a> (or plain <code>ddev</code>) to see the actions you can take with the
+    </a> (or plain <code class="dark:text-white">ddev</code>) to see the actions you can take with the
     CLI:
   </p>
 
@@ -146,6 +156,7 @@ const { latestVersion } = Astro.props
     Use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#describe"
       target="_blank"
+      class="dark:text-white"
       >describe command
     </a> to see a project’s parts and database connection details:
   </p>
@@ -157,6 +168,7 @@ const { latestVersion } = Astro.props
     removing anything, use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#stop"
       target="_blank"
+      class="dark:text-white"
       >stop command
     </a>:
   </p>
@@ -168,6 +180,7 @@ const { latestVersion } = Astro.props
     project and its resources without touching your code, run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#delete"
       target="_blank"
+      class="dark:text-white"
       >delete command
     </a>:
   </p>
diff --git a/src/components/quickstart/CommunityCTA.astro b/src/components/quickstart/CommunityCTA.astro
index 290dab1d..4df644ee 100644
--- a/src/components/quickstart/CommunityCTA.astro
+++ b/src/components/quickstart/CommunityCTA.astro
@@ -1,7 +1,7 @@
-<div class="bg-gray-200 p-8 rounded-lg mt-36">
-  <h2 class="mt-0">Join the DDEV Community</h2>
-  <p class="mb-0">
+<div class="bg-gray-200 p-8 rounded-lg mt-36 dark:bg-slate-600">
+  <h2 class="mt-0 dark:text-white">Join the DDEV Community</h2>
+  <p class="mb-0 dark:text-slate-400">
     DDEV is an open source project with a growing community, and there are lots
-    of ways to <a href="/support-ddev">get involved</a>!
+    of ways to <a href="/support-ddev" class="dark:text-white">get involved</a>!
   </p>
 </div>
diff --git a/src/components/quickstart/Linux.astro b/src/components/quickstart/Linux.astro
index a09bbb1e..5ed5aaee 100644
--- a/src/components/quickstart/Linux.astro
+++ b/src/components/quickstart/Linux.astro
@@ -14,6 +14,7 @@ const { latestVersion } = Astro.props
   <p class="text-gray-600 mb-16 dark:text-slate-400">
     We’ll install Docker and DDEV with your package manager, as detailed in the <a
       href="https://ddev.readthedocs.io/en/latest/users/install/ddev-installation/"
+      class="dark:text-white" 
       >Linux installation docs</a
     >.
   </p>
@@ -29,7 +30,9 @@ const { latestVersion } = Astro.props
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/ubuntu/"
-            target="_blank">instructions on docs.docker.com</a
+            target="_blank"
+            class="dark:text-white"
+            >instructions on docs.docker.com</a
           >:
         </p>
         <Terminal
@@ -43,7 +46,9 @@ const { latestVersion } = Astro.props
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/centos/"
-            target="_blank">instructions on docs.docker.com</a
+            target="_blank"
+            class="dark:text-white"
+            >instructions on docs.docker.com</a
           >:
         </p>
 
@@ -58,7 +63,9 @@ const { latestVersion } = Astro.props
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/debian/"
-            target="_blank">instructions on docs.docker.com</a
+            target="_blank"
+            class="dark:text-white" 
+            >instructions on docs.docker.com</a
           >:
         </p>
 
@@ -73,7 +80,9 @@ const { latestVersion } = Astro.props
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/fedora/"
-            target="_blank">instructions on docs.docker.com</a
+            target="_blank"
+            class="dark:text-white"
+            >instructions on docs.docker.com</a
           >:
         </p>
 
@@ -86,7 +95,7 @@ const { latestVersion } = Astro.props
   </Tabs>
 </div>
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">2/3</small>Install DDEV
   </h2>
@@ -132,7 +141,7 @@ const { latestVersion } = Astro.props
   <Terminal type="ubuntu" code={`$ ddev -v\nddev version ${latestVersion}`} />
 </div>
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">3/3</small>Create a
     Project
@@ -145,7 +154,8 @@ const { latestVersion } = Astro.props
     Initialize the project by running the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#config"
       target="_blank"
-      ><code>ddev config</code>
+      class="dark:text-white" 
+      ><code class="dark:text-white">ddev config</code>
     </a> command:
   </p>
   <Terminal type="ubuntu" code={`$ ddev config`} />
@@ -160,29 +170,34 @@ const { latestVersion } = Astro.props
     If it’s a Composer project, you may also need to run <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#composer"
       target="_blank"
-      ><code>ddev composer install</code>
+      class="dark:text-white" 
+      ><code class="dark:text-white">ddev composer install</code>
     </a>.
   </p>
 
   <p>
     Now run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#launch"
-      target="_blank">launch command</a
+      target="_blank"
+      class="dark:text-white" 
+      >launch command</a
     > to open your project in a browser:
   </p>
   <Terminal type="ubuntu" code={`$ ddev launch`} />
 </div>
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
-    Take a peek at your project’s new <code>.ddev/</code> directory. You can add
-    this to your repo to share your DDEV config, edit <code
+    Take a peek at your project’s new <code class="dark:text-white">.ddev/</code> directory. You can add
+    this to your repo to share your DDEV config, edit <code class="dark:text-white"
       >.ddev/ddev.yaml</code
     > to change <a
       href="https://ddev.readthedocs.io/en/latest/users/configuration/config/"
-      target="_blank">project options</a
+      target="_blank"
+      class="dark:text-white"
+      >project options</a
     >, or even go about your business and pretend this folder doesn’t exist.
   </p>
 
@@ -190,8 +205,9 @@ const { latestVersion } = Astro.props
     Run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#help"
       target="_blank"
+      class="dark:text-white"
       >help command
-    </a> (or plain <code>ddev</code>) to see the actions you can take with the
+    </a> (or plain <code class="dark:text-white">ddev</code>) to see the actions you can take with the
     CLI:
   </p>
 
@@ -201,6 +217,7 @@ const { latestVersion } = Astro.props
     Use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#describe"
       target="_blank"
+      class="dark:text-white"
       >describe command
     </a> to see a project’s parts and database connection details:
   </p>
@@ -212,6 +229,7 @@ const { latestVersion } = Astro.props
     removing anything, use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#stop"
       target="_blank"
+      class="dark:text-white"
       >stop command
     </a>:
   </p>
@@ -223,6 +241,7 @@ const { latestVersion } = Astro.props
     project and its resources without touching your code, run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#delete"
       target="_blank"
+      class="dark:text-white"
       >delete command
     </a>:
   </p>
@@ -245,7 +264,7 @@ const { latestVersion } = Astro.props
   />
 
   <p>
-    Remove the <code>ddev</code> binary:
+    Remove the <code class="dark:text-white">ddev</code> binary:
   </p>
 
   <Terminal type="ubuntu" code={`$ sudo rm /usr/local/bin/ddev`} />
diff --git a/src/components/quickstart/Windows.astro b/src/components/quickstart/Windows.astro
index 14e6e7ed..e3522e0b 100644
--- a/src/components/quickstart/Windows.astro
+++ b/src/components/quickstart/Windows.astro
@@ -14,6 +14,7 @@ const { latestVersion } = Astro.props
     We’ll use WSL2 with Docker inside since it’s the fastest and most
     straightforward of <a
       href="https://ddev.readthedocs.io/en/latest/users/install/docker-installation/#windows"
+      class="dark:text-white"
       >several options</a
     >.
   </p>
@@ -43,7 +44,7 @@ const { latestVersion } = Astro.props
   />
 </div>
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">2/3</small>Run the
     Install Script
@@ -66,7 +67,7 @@ const { latestVersion } = Astro.props
   />
 </div>
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">3/3</small>Create a
     Project
@@ -79,6 +80,7 @@ const { latestVersion } = Astro.props
     Initialize the project by running the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#config"
       target="_blank"
+      class="dark:text-white"
       ><code>ddev config</code>
     </a> command:
   </p>
@@ -94,6 +96,7 @@ const { latestVersion } = Astro.props
     If it’s a Composer project, you may also need to run <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#composer"
       target="_blank"
+      class="dark:text-white"
       ><code>ddev composer install</code>
     </a>.
   </p>
@@ -101,22 +104,26 @@ const { latestVersion } = Astro.props
   <p>
     Now run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#launch"
-      target="_blank">launch command</a
+      target="_blank"
+      class="dark:text-white"
+      >launch command</a
     > to open your project in a browser:
   </p>
   <Terminal type="powershell-ubuntu" code={`$ ddev launch`} />
 </div>
 
-<div class="prose">
+<div class="prose dark:text-slate-400">
   <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
-    Take a peek at your project’s new <code>.ddev/</code> directory. You can add
-    this to your repo to share your DDEV config, edit <code
+    Take a peek at your project’s new <code class="dark:text-white">.ddev/</code> directory. You can add
+    this to your repo to share your DDEV config, edit <code class="dark:text-white"
       >.ddev/ddev.yaml</code
     > to change <a
       href="https://ddev.readthedocs.io/en/latest/users/configuration/config/"
-      target="_blank">project options</a
+      target="_blank"
+      class="dark:text-white"
+      >project options</a
     >, or even go about your business and pretend this folder doesn’t exist.
   </p>
 
@@ -124,8 +131,9 @@ const { latestVersion } = Astro.props
     Run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#help"
       target="_blank"
+      class="dark:text-white"
       >help command
-    </a> (or plain <code>ddev</code>) to see the actions you can take with the
+    </a> (or plain <code class="dark:text-white">ddev</code>) to see the actions you can take with the
     CLI:
   </p>
 
@@ -135,6 +143,7 @@ const { latestVersion } = Astro.props
     Use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#describe"
       target="_blank"
+      class="dark:text-white"
       >describe command
     </a> to see a project’s parts and database connection details:
   </p>
@@ -146,6 +155,7 @@ const { latestVersion } = Astro.props
     removing anything, use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#stop"
       target="_blank"
+      class="dark:text-white"
       >stop command
     </a>:
   </p>
@@ -157,6 +167,7 @@ const { latestVersion } = Astro.props
     project and its resources without touching your code, run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#delete"
       target="_blank"
+      class="dark:text-white"
       >delete command
     </a>:
   </p>
@@ -179,7 +190,7 @@ const { latestVersion } = Astro.props
   />
 
   <p>
-    Remove the <code>ddev</code> binary from the WSL2 distro:
+    Remove the <code class="dark:text-white">ddev</code> binary from the WSL2 distro:
   </p>
 
   <Terminal type="powershell-ubuntu" code={`$ sudo rm /usr/bin/ddev`} />
diff --git a/src/pages/about.astro b/src/pages/about.astro
index 0617d60d..9dfcd128 100644
--- a/src/pages/about.astro
+++ b/src/pages/about.astro
@@ -100,7 +100,7 @@ const releaseData = await getReleases()
               }</span
             >
             <span class="block font-mono text-sm">GitHub stars</span>
-            <div class="mt-2 prose">
+            <div class="mt-2  dark:text-slate-400">
               <figure>
                 <img
                   src="https://stars.medv.io/ddev/ddev.svg"
diff --git a/src/pages/blog/[slug].astro b/src/pages/blog/[slug].astro
index 9569e66c..8b8c0393 100644
--- a/src/pages/blog/[slug].astro
+++ b/src/pages/blog/[slug].astro
@@ -116,10 +116,10 @@ const blogPostSchema = [
         {
           entry.data.categories.length && (
             <>
-              <span class="font-mono text-sm block text-navy-300 tracking-wider">
+              <span class="font-mono text-sm block text-navy-300 tracking-wider dark:text-slate-500">
                 Posted In
               </span>
-              <ul class="mt-1">
+              <ul class="mt-1 dark:text-slate-400">
                 {entry.data.categories.map((category) => (
                   <li class="my-1">
                     <a href={getCategoryUrl(category)} class="font-bold">
diff --git a/src/pages/get-started.astro b/src/pages/get-started.astro
index 134a0cd2..99f3332e 100644
--- a/src/pages/get-started.astro
+++ b/src/pages/get-started.astro
@@ -29,7 +29,7 @@ const latestRelease = await getLatestReleaseVersion()
 >
   <main class="max-w-4xl mx-auto mb-24 dark:text-white">
     <Heading title={title} subtitle={`Install and start using DDEV.`} />
-    <div class="prose mb-16">
+    <div class="prose mb-16 dark:text-slate-400">
       <PlatformPicker heading={`Choose your platform:`} />
     </div>
 
diff --git a/src/styles/global.css b/src/styles/global.css
index d2f89483..8803e474 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -45,6 +45,13 @@ footer {
       }
     }
   }
+  .menu:where(.astro-3EF6KSR2){
+    @apply dark:bg-slate-800 dark:text-white;
+  }
+  .panel.active{
+    @apply dark:bg-slate-600;
+    box-shadow: none;
+  }
 }
 
 

From 9378bd2e87d423b96c207848a87443c1ac59e791 Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sun, 24 Sep 2023 09:21:42 -0600
Subject: [PATCH 07/15] Updated darkmode settings part1.

---
 src/components/quickstart/Cloud.astro | 16 +++++++--------
 src/pages/blog/author/[slug].astro    |  2 +-
 src/pages/support-ddev.astro          | 28 +++++++++++++--------------
 3 files changed, 22 insertions(+), 24 deletions(-)

diff --git a/src/components/quickstart/Cloud.astro b/src/components/quickstart/Cloud.astro
index 336a1443..85ef5ba8 100644
--- a/src/components/quickstart/Cloud.astro
+++ b/src/components/quickstart/Cloud.astro
@@ -11,7 +11,7 @@ export interface Props {
 const { latestVersion } = Astro.props
 ---
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">1/2</small>Launch a
     Provider &amp; Install DDEV
@@ -19,10 +19,9 @@ const { latestVersion } = Astro.props
 
   <Tabs order={["Gitpod", "GitHub Codespaces"]}>
     <Fragment slot="Gitpod">
-      <div class="prose pt-5 dark:text-slate-400">
+      <div class="prose pt-5 dark:prose-invert">
         <p>
-          <a href="https://www.gitpod.io/docs/getting-started" target="_blank"
-          class="dark:text-white"  
+          <a href="https://www.gitpod.io/docs/getting-started" target="_blank" 
           >Open any repository</a
           > using Gitpod and install DDEV:
         </p>
@@ -40,16 +39,15 @@ const { latestVersion } = Astro.props
       </a>
     </Fragment>
     <Fragment slot="GitHub Codespaces">
-      <div class="prose py-5 dark:text-slate-400">
+      <div class="prose py-5 dark:prose-invert">
         <ol>
           <li>
             <a href="https://github.com/codespaces/new"
-              class="dark:text-white"
               >Create a new codespace</a
             > for your project or open an existing one.
           </li>
           <li>
-            Edit the project’s <code class="dark:text-white">.devcontainer/devcontainer.json</code> file
+            Edit the project’s <code>.devcontainer/devcontainer.json</code> file
             to include these two lines in the “features” section:
             <Code
               code={`"features": {\n    "ghcr.io/devcontainers/features/docker-in-docker:2": {},\n    "ghcr.io/ddev/ddev/install-ddev:latest": {}\n},`}
@@ -83,7 +81,7 @@ const { latestVersion } = Astro.props
   <Terminal code={`→ ddev -v\nddev version ${latestVersion}`} />
 </div>
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">2/2</small>Create a
     Project
@@ -125,7 +123,7 @@ const { latestVersion } = Astro.props
   <Terminal code={`→ ddev launch`} />
 </div>
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
diff --git a/src/pages/blog/author/[slug].astro b/src/pages/blog/author/[slug].astro
index ff8e94de..2845f5d8 100644
--- a/src/pages/blog/author/[slug].astro
+++ b/src/pages/blog/author/[slug].astro
@@ -41,7 +41,7 @@ const { Content } = await author.render()
   <main class="max-w-4xl mx-auto mb-24">
     <div class="lg:flex lg:space-x-12 py-24 px-6 lg:px-0">
       <h1 class="font-bold text-4xl dark:text-white">{author.data.name}</h1>
-      <div class="prose mt-6 lg:mt-0">
+      <div class="prose mt-6 lg:mt-0 dark:prose-invert">
         <Content />
       </div>
     </div>
diff --git a/src/pages/support-ddev.astro b/src/pages/support-ddev.astro
index d315ca71..aea5899f 100644
--- a/src/pages/support-ddev.astro
+++ b/src/pages/support-ddev.astro
@@ -24,7 +24,7 @@ const title = `Support DDEV`
     <Heading title={title} subtitle={`We’d love your help!`} />
 
     <div class="px-6 lg:px-0">
-      <div class="prose text-lg mt-0 mb-24 dark:text-slate-400">
+      <div class="prose text-lg mt-0 mb-24 dark:prose-invert">
         <p>
           DDEV exists because of the generosity of community members and
           sponsors.<br />
@@ -32,12 +32,12 @@ const title = `Support DDEV`
         </p>
       </div>
 
-      <div class="prose mt-12 dark:text-slate-400">
-        <h2 class="dark:text-white">File an Issue or PR</h2>
+      <div class="prose mt-12 dark:prose-invert">
+        <h2>File an Issue or PR</h2>
 
         <p>
           If you have an idea, a bug report, or code to contribute, please take
-          the time to <a class="dark:text-slate-400"
+          the time to <a
             href="https://github.com/ddev/ddev/blob/master/CONTRIBUTING.md"
             target="_blank">contribute</a
           > a GitHub Issue or Pull Request.
@@ -64,8 +64,8 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12 dark:text-slate-400">
-        <h2 class="dark:text-white">Sponsor Development</h2>
+      <div class="prose mt-12 dark:prose-invert">
+        <h2>Sponsor Development</h2>
         <p>
           We’re grateful for our sponsors, and all contributions to the DDEV
           Foundation go entirely toward development. We can always use resources
@@ -87,8 +87,8 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12 dark:text-slate-400">
-        <h2 class="dark:text-white">Help Others</h2>
+      <div class="prose mt-12 dark:prose-invert">
+        <h2>Help Others</h2>
         <p>
           There’s no shortage of questions on Discord, GitHub, and Stack
           Overflow. If you can help someone out, it helps us focus more on
@@ -116,8 +116,8 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12 dark:text-slate-400">
-        <h2 class="dark:text-white">Improve the Docs</h2>
+      <div class="prose mt-12 dark:prose-invert">
+        <h2>Improve the Docs</h2>
         <p>
           It doesn’t matter whether you’ve found a typo, can wordsmith something
           to better explain or fit <a class="dark:text-slate-200"
@@ -139,7 +139,7 @@ const title = `Support DDEV`
             }}
           />
 
-          <figcaption class="dark:text-slate-400">
+          <figcaption>
             The edit icon in the published docs links to the relevant GitHub
             source for suggestions.
           </figcaption>
@@ -155,7 +155,7 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12 dark:text-white">
+      <div class="prose mt-12 dark:prose-invert">
         <h2 class="dark:text-white">Spread the Word</h2>
         <p>
           If you like using DDEV, don’t keep it to yourself! Star the project <a
@@ -165,7 +165,7 @@ const title = `Support DDEV`
           video.
         </p>
 
-        <blockquote class="twitter-tweet dark:text-slate-400">
+        <blockquote class="twitter-tweet dark:prose-invert">
           <p lang="en" dir="ltr">
             <a class="dark:text-slate-200"
               href="https://twitter.com/hashtag/fedora?src=hash&ref_src=twsrc%5Etfw"
@@ -197,7 +197,7 @@ const title = `Support DDEV`
         />
       </div>
 
-      <div class="prose mt-12 dark:text-white">
+      <div class="prose mt-12 dark:prose-invert">
         <h2 class="dark:text-white">Join the Advisory Group</h2>
         <p>
           We meet regularly to discuss DDEV’s present and future. You’re welcome

From 65ef5a7b4a857e710fc6ae792c8b2c1e472a75b3 Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sun, 24 Sep 2023 09:40:30 -0600
Subject: [PATCH 08/15] Updated darkmode settings part1.1.

---
 src/components/quickstart/Cloud.astro   | 24 ++++-------
 src/components/quickstart/Linux.astro   | 55 ++++++++++---------------
 src/components/quickstart/Mac.astro     | 44 +++++++++-----------
 src/components/quickstart/Windows.astro | 25 ++++-------
 src/pages/support-ddev.astro            |  4 +-
 5 files changed, 57 insertions(+), 95 deletions(-)

diff --git a/src/components/quickstart/Cloud.astro b/src/components/quickstart/Cloud.astro
index 85ef5ba8..35c78981 100644
--- a/src/components/quickstart/Cloud.astro
+++ b/src/components/quickstart/Cloud.astro
@@ -12,7 +12,7 @@ const { latestVersion } = Astro.props
 ---
 
 <div class="prose dark:prose-invert">
-  <h2 class="text-3xl mt-24 dark:text-white">
+  <h2 class="text-3xl mt-24">
     <small class="block font-mono text-xs text-gray-500">1/2</small>Launch a
     Provider &amp; Install DDEV
   </h2>
@@ -67,7 +67,6 @@ const { latestVersion } = Astro.props
       </div>
       <a
         href="https://github.com/codespaces/new?hide_repo_select=true&ref=20221220_codespaces&repo=80927419&machine=basicLinux32gb&location=WestUs2"
-        class="dark:text-white"
         ><img
           src="https://github.com/codespaces/badge.svg"
           alt="Open in GitHub Codespaces"
@@ -91,8 +90,7 @@ const { latestVersion } = Astro.props
     Initialize the DDEV project by running the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#config"
       target="_blank"
-      class="dark:text-white"
-      ><code class="dark:text-white">ddev config</code>
+      ><code>ddev config</code>
     </a> command:
   </p>
   <Terminal code={`→ ddev config`} />
@@ -107,8 +105,7 @@ const { latestVersion } = Astro.props
     If it’s a Composer project, you may also need to run <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#composer"
       target="_blank"
-      class="dark:text-white"
-      ><code class="dark:text-white">ddev composer install</code>
+      ><code>ddev composer install</code>
     </a>.
   </p>
 
@@ -116,7 +113,6 @@ const { latestVersion } = Astro.props
     Now run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#launch"
       target="_blank"
-      class="dark:text-white"
       >launch command</a
     > to open your project in a browser:
   </p>
@@ -127,13 +123,11 @@ const { latestVersion } = Astro.props
   <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
-    Take a peek at your project’s new <code class="dark:text-white">.ddev/</code> directory. You can add
-    this to your repo to share your DDEV config, edit <code class="dark:text-white"
-      >.ddev/ddev.yaml</code
-    > to change <a
+    Take a peek at your project’s new <code>.ddev/</code> directory. You can add
+    this to your repo to share your DDEV config, edit <code>.ddev/ddev.yaml</code> to change <a
       href="https://ddev.readthedocs.io/en/latest/users/configuration/config/"
       target="_blank"
-      class="dark:text-white"
+      
       >project options</a
     >, or even go about your business and pretend this folder doesn’t exist.
   </p>
@@ -142,9 +136,8 @@ const { latestVersion } = Astro.props
     Run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#help"
       target="_blank"
-      class="dark:text-white"
       >help command
-    </a> (or plain <code class="dark:text-white">ddev</code>) to see the actions you can take with the
+    </a> (or plain <code>ddev</code>) to see the actions you can take with the
     CLI:
   </p>
 
@@ -154,7 +147,6 @@ const { latestVersion } = Astro.props
     Use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#describe"
       target="_blank"
-      class="dark:text-white"
       >describe command
     </a> to see a project’s parts and database connection details:
   </p>
@@ -166,7 +158,6 @@ const { latestVersion } = Astro.props
     removing anything, use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#stop"
       target="_blank"
-      class="dark:text-white"
       >stop command
     </a>:
   </p>
@@ -178,7 +169,6 @@ const { latestVersion } = Astro.props
     project and its resources without touching your code, run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#delete"
       target="_blank"
-      class="dark:text-white"
       >delete command
     </a>:
   </p>
diff --git a/src/components/quickstart/Linux.astro b/src/components/quickstart/Linux.astro
index 5ed5aaee..47fac5ae 100644
--- a/src/components/quickstart/Linux.astro
+++ b/src/components/quickstart/Linux.astro
@@ -10,11 +10,10 @@ export interface Props {
 const { latestVersion } = Astro.props
 ---
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <p class="text-gray-600 mb-16 dark:text-slate-400">
     We’ll install Docker and DDEV with your package manager, as detailed in the <a
       href="https://ddev.readthedocs.io/en/latest/users/install/ddev-installation/"
-      class="dark:text-white" 
       >Linux installation docs</a
     >.
   </p>
@@ -26,12 +25,11 @@ const { latestVersion } = Astro.props
 
   <Tabs order={["Ubuntu", "CentOS", "Debian", "Fedora"]}>
     <Fragment slot="Ubuntu">
-      <div class="prose py-5 dark:text-slate-400">
+      <div class="prose py-5 dark:prose-invert">
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/ubuntu/"
             target="_blank"
-            class="dark:text-white"
             >instructions on docs.docker.com</a
           >:
         </p>
@@ -42,12 +40,11 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="CentOS">
-      <div class="prose py-5 dark:text-slate-400">
+      <div class="prose py-5 dark:prose-invert">
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/centos/"
             target="_blank"
-            class="dark:text-white"
             >instructions on docs.docker.com</a
           >:
         </p>
@@ -59,12 +56,11 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="Debian">
-      <div class="prose py-5 dark:text-slate-400">
+      <div class="prose py-5 dark:prose-invert">
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/debian/"
-            target="_blank"
-            class="dark:text-white" 
+            target="_blank" 
             >instructions on docs.docker.com</a
           >:
         </p>
@@ -76,12 +72,11 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="Fedora">
-      <div class="prose py-5 dark:text-slate-400">
+      <div class="prose py-5 dark:prose-invert">
         <p>
           Follow the <a
             href="https://docs.docker.com/engine/install/fedora/"
             target="_blank"
-            class="dark:text-white"
             >instructions on docs.docker.com</a
           >:
         </p>
@@ -95,14 +90,14 @@ const { latestVersion } = Astro.props
   </Tabs>
 </div>
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">2/3</small>Install DDEV
   </h2>
 
   <Tabs order={["Ubuntu", "CentOS", "Debian", "Fedora"]}>
     <Fragment slot="Ubuntu">
-      <div class="prose py-5 dark:text-slate-400">
+      <div class="prose py-5 dark:prose-invert">
         <Terminal
           type="ubuntu"
           code={`$ curl -fsSL https://pkg.ddev.com/apt/gpg.key | gpg --dearmor | sudo tee /etc/apt/trusted.gpg.d/ddev.gpg > /dev/null\n$ echo "deb [signed-by=/etc/apt/trusted.gpg.d/ddev.gpg] https://pkg.ddev.com/apt/ * *" | sudo tee /etc/apt/sources.list.d/ddev.list\n$ sudo apt update && sudo apt install -y ddev
@@ -111,7 +106,7 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="CentOS">
-      <div class="prose py-5 dark:text-slate-400">
+      <div class="prose py-5 dark:prose-invert">
         <Terminal
           type="ubuntu"
           code={`$ echo '[ddev]\nname=DDEV Repo\nbaseurl=https://pkg.ddev.com/yum/\nenabled=1\ngpgcheck=0' | sudo tee -a /etc/yum.repos.d/ddev.repo\n$ sudo dnf install --refresh ddev`}
@@ -119,7 +114,7 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="Debian">
-      <div class="prose py-5 dark:text-slate-400">
+      <div class="prose py-5 dark:prose-invert">
         <Terminal
           type="ubuntu"
           code={`$ curl -fsSL https://pkg.ddev.com/apt/gpg.key | gpg --dearmor | sudo tee /etc/apt/trusted.gpg.d/ddev.gpg > /dev/null\n$ echo "deb [signed-by=/etc/apt/trusted.gpg.d/ddev.gpg] https://pkg.ddev.com/apt/ * *" | sudo tee /etc/apt/sources.list.d/ddev.list\n$ sudo apt update && sudo apt install -y ddev
@@ -128,7 +123,7 @@ const { latestVersion } = Astro.props
       </div>
     </Fragment>
     <Fragment slot="Fedora">
-      <div class="prose py-5 dark:text-slate-400">
+      <div class="prose py-5 dark:prose-invert">
         <Terminal
           type="ubuntu"
           code={`$ echo '[ddev]\nname=DDEV Repo\nbaseurl=https://pkg.ddev.com/yum/\nenabled=1\ngpgcheck=0' | sudo tee -a /etc/yum.repos.d/ddev.repo\n$ sudo dnf install --refresh ddev`}
@@ -141,7 +136,7 @@ const { latestVersion } = Astro.props
   <Terminal type="ubuntu" code={`$ ddev -v\nddev version ${latestVersion}`} />
 </div>
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">3/3</small>Create a
     Project
@@ -154,8 +149,7 @@ const { latestVersion } = Astro.props
     Initialize the project by running the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#config"
       target="_blank"
-      class="dark:text-white" 
-      ><code class="dark:text-white">ddev config</code>
+      ><code>ddev config</code>
     </a> command:
   </p>
   <Terminal type="ubuntu" code={`$ ddev config`} />
@@ -169,34 +163,31 @@ const { latestVersion } = Astro.props
   <p>
     If it’s a Composer project, you may also need to run <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#composer"
-      target="_blank"
-      class="dark:text-white" 
-      ><code class="dark:text-white">ddev composer install</code>
+      target="_blank" 
+      ><code>ddev composer install</code>
     </a>.
   </p>
 
   <p>
     Now run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#launch"
-      target="_blank"
-      class="dark:text-white" 
+      target="_blank" 
       >launch command</a
     > to open your project in a browser:
   </p>
   <Terminal type="ubuntu" code={`$ ddev launch`} />
 </div>
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
-    Take a peek at your project’s new <code class="dark:text-white">.ddev/</code> directory. You can add
-    this to your repo to share your DDEV config, edit <code class="dark:text-white"
+    Take a peek at your project’s new <code>.ddev/</code> directory. You can add
+    this to your repo to share your DDEV config, edit <code
       >.ddev/ddev.yaml</code
     > to change <a
       href="https://ddev.readthedocs.io/en/latest/users/configuration/config/"
       target="_blank"
-      class="dark:text-white"
       >project options</a
     >, or even go about your business and pretend this folder doesn’t exist.
   </p>
@@ -205,9 +196,8 @@ const { latestVersion } = Astro.props
     Run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#help"
       target="_blank"
-      class="dark:text-white"
       >help command
-    </a> (or plain <code class="dark:text-white">ddev</code>) to see the actions you can take with the
+    </a> (or plain <code>ddev</code>) to see the actions you can take with the
     CLI:
   </p>
 
@@ -217,7 +207,6 @@ const { latestVersion } = Astro.props
     Use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#describe"
       target="_blank"
-      class="dark:text-white"
       >describe command
     </a> to see a project’s parts and database connection details:
   </p>
@@ -229,7 +218,6 @@ const { latestVersion } = Astro.props
     removing anything, use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#stop"
       target="_blank"
-      class="dark:text-white"
       >stop command
     </a>:
   </p>
@@ -241,7 +229,6 @@ const { latestVersion } = Astro.props
     project and its resources without touching your code, run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#delete"
       target="_blank"
-      class="dark:text-white"
       >delete command
     </a>:
   </p>
@@ -264,7 +251,7 @@ const { latestVersion } = Astro.props
   />
 
   <p>
-    Remove the <code class="dark:text-white">ddev</code> binary:
+    Remove the <code>ddev</code> binary:
   </p>
 
   <Terminal type="ubuntu" code={`$ sudo rm /usr/local/bin/ddev`} />
diff --git a/src/components/quickstart/Mac.astro b/src/components/quickstart/Mac.astro
index 2f8f865e..84b63af2 100644
--- a/src/components/quickstart/Mac.astro
+++ b/src/components/quickstart/Mac.astro
@@ -10,9 +10,9 @@ export interface Props {
 const { latestVersion } = Astro.props
 ---
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <p class="text-gray-600 mb-16 dark:text-slate-400">
-    We’ll use Docker Desktop since it’s the most straightforward of <a class="dark:text-slate-200"
+    We’ll use Docker Desktop since it’s the most straightforward of <a
       href="https://ddev.readthedocs.io/en/latest/users/install/docker-installation/#macos"
       >several options</a
     >.
@@ -26,20 +26,19 @@ const { latestVersion } = Astro.props
 
 <Tabs order={["Homebrew", "Download"]}>
   <Fragment slot="Homebrew">
-    <div class="prose py-5 dark:text-slate-400">
+    <div class="prose py-5 dark:prose-invert">
       <p>
-        With <a href="https://brew.sh" class="dark:text-white" target="_blank">Homebrew</a> installed, you
+        With <a href="https://brew.sh" target="_blank">Homebrew</a> installed, you
         can install Docker Desktop with one command:
       </p>
       <Terminal code={`→ brew install --cask docker`} />
     </div>
   </Fragment>
   <Fragment slot="Download">
-    <div class="prose py-5 dark:text-slate-400">
+    <div class="prose py-5 dark:prose-invert">
       <p>
         Download and run the <a
           href="https://www.docker.com/products/docker-desktop"
-          class="dark:text-white"
           target="_blank">Docker Desktop installer</a
         >.
       </p>
@@ -47,7 +46,7 @@ const { latestVersion } = Astro.props
   </Fragment>
 </Tabs>
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <p>
     Launch Docker Desktop, accept the license agreement, and make sure Docker is
     started and running.
@@ -63,12 +62,12 @@ const { latestVersion } = Astro.props
 
 <Tabs order={["Homebrew", "Install Script"]}>
   <Fragment slot="Homebrew">
-    <div class="prose py-5 dark:text-slate-400">
+    <div class="prose py-5 dark:prose-invert">
       <Terminal code={`→ brew install ddev/ddev/ddev`} />
     </div>
   </Fragment>
   <Fragment slot="Install Script">
-    <div class="prose py-5 dark:text-slate-400">
+    <div class="prose py-5 dark:prose-invert">
       <Terminal
         code={`→ curl -fsSL https://ddev.com/install.sh | bash`}
       />
@@ -76,7 +75,7 @@ const { latestVersion } = Astro.props
   </Fragment>
 </Tabs>
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <p>Confirm that you’ve now got DDEV installed: 🎉</p>
   <Terminal code={`→ ddev -v\nddev version ${latestVersion}`} />
 
@@ -92,7 +91,7 @@ const { latestVersion } = Astro.props
     Initialize the project by running the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#config"
       target="_blank"
-      ><code class="dark:text-white">ddev config</code>
+      ><code>ddev config</code>
     </a> command:
   </p>
   <Terminal code={`→ ddev config`} />
@@ -107,31 +106,30 @@ const { latestVersion } = Astro.props
     If it’s a Composer project, you may also need to run <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#composer"
       target="_blank"
-      ><code class="dark:text-white">ddev composer install</code>
+      ><code>ddev composer install</code>
     </a>.
   </p>
 
   <p>
     Now run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#launch"
-      class="dark:text-white"
       target="_blank">launch command</a
     > to open your project in a browser:
   </p>
   <Terminal code={`→ ddev launch`} />
 </div>
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
-    Take a peek at your project’s new <code class="dark:text-white">.ddev/</code> directory. You can add
-    this to your repo to share your DDEV config, edit <code class="dark:text-white"
+    Take a peek at your project’s new <code>.ddev/</code> directory. You can add
+    this to your repo to share your DDEV config, edit <code
       >.ddev/ddev.yaml</code
     > to change <a
       href="https://ddev.readthedocs.io/en/latest/users/configuration/config/"
       target="_blank"
-      class="dark:text-white">project options</a
+      >project options</a
     >, or even go about your business and pretend this folder doesn’t exist.
   </p>
 
@@ -139,9 +137,8 @@ const { latestVersion } = Astro.props
     Run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#help"
       target="_blank"
-      class="dark:text-white"
       >help command
-    </a> (or plain <code class="dark:text-white">ddev</code>) to see the actions you can take with the
+    </a> (or plain <code>ddev</code>) to see the actions you can take with the
     CLI:
   </p>
 
@@ -151,7 +148,6 @@ const { latestVersion } = Astro.props
     Use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#describe"
       target="_blank"
-      class="dark:text-white"
       >describe command
     </a> to see a project’s parts and database connection details:
   </p>
@@ -163,7 +159,6 @@ const { latestVersion } = Astro.props
     removing anything, use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#stop"
       target="_blank"
-      class="dark:text-white"
       >stop command
     </a>:
   </p>
@@ -175,7 +170,6 @@ const { latestVersion } = Astro.props
     project and its resources without touching your code, run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#delete"
       target="_blank"
-      class="dark:text-white"
       >delete command
     </a>:
   </p>
@@ -197,17 +191,17 @@ const { latestVersion } = Astro.props
   />
 
   <p>
-    Then remove the <code class="dark:text-white">ddev</code> binary however you installed it:
+    Then remove the <codes>ddev</code> binary however you installed it:
   </p>
 
   <Tabs order={["Homebrew", "Install Script"]}>
     <Fragment slot="Homebrew">
-      <div class="prose py-5 dark:text-slate-400">
+      <div class="prose py-5 dark:prose-invert">
         <Terminal code={`→ brew uninstall ddev`} />
       </div>
     </Fragment>
     <Fragment slot="Install Script">
-      <div class="prose py-5 dark:text-slate-400">
+      <div class="prose py-5 dark:prose-invert">
         <Terminal code={`→ rm /usr/local/bin/ddev`} />
       </div>
     </Fragment>
diff --git a/src/components/quickstart/Windows.astro b/src/components/quickstart/Windows.astro
index e3522e0b..3a6030e5 100644
--- a/src/components/quickstart/Windows.astro
+++ b/src/components/quickstart/Windows.astro
@@ -9,12 +9,11 @@ export interface Props {
 const { latestVersion } = Astro.props
 ---
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <p class="text-gray-600 mb-16 dark:text-slate-400">
     We’ll use WSL2 with Docker inside since it’s the fastest and most
     straightforward of <a
       href="https://ddev.readthedocs.io/en/latest/users/install/docker-installation/#windows"
-      class="dark:text-white"
       >several options</a
     >.
   </p>
@@ -44,7 +43,7 @@ const { latestVersion } = Astro.props
   />
 </div>
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">2/3</small>Run the
     Install Script
@@ -67,7 +66,7 @@ const { latestVersion } = Astro.props
   />
 </div>
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <h2 class="text-3xl mt-24 dark:text-white">
     <small class="block font-mono text-xs text-gray-500">3/3</small>Create a
     Project
@@ -80,7 +79,6 @@ const { latestVersion } = Astro.props
     Initialize the project by running the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#config"
       target="_blank"
-      class="dark:text-white"
       ><code>ddev config</code>
     </a> command:
   </p>
@@ -96,7 +94,6 @@ const { latestVersion } = Astro.props
     If it’s a Composer project, you may also need to run <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#composer"
       target="_blank"
-      class="dark:text-white"
       ><code>ddev composer install</code>
     </a>.
   </p>
@@ -105,24 +102,22 @@ const { latestVersion } = Astro.props
     Now run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#launch"
       target="_blank"
-      class="dark:text-white"
       >launch command</a
     > to open your project in a browser:
   </p>
   <Terminal type="powershell-ubuntu" code={`$ ddev launch`} />
 </div>
 
-<div class="prose dark:text-slate-400">
+<div class="prose dark:prose-invert">
   <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
 
   <p>
-    Take a peek at your project’s new <code class="dark:text-white">.ddev/</code> directory. You can add
-    this to your repo to share your DDEV config, edit <code class="dark:text-white"
+    Take a peek at your project’s new <code>.ddev/</code> directory. You can add
+    this to your repo to share your DDEV config, edit <code
       >.ddev/ddev.yaml</code
     > to change <a
       href="https://ddev.readthedocs.io/en/latest/users/configuration/config/"
       target="_blank"
-      class="dark:text-white"
       >project options</a
     >, or even go about your business and pretend this folder doesn’t exist.
   </p>
@@ -131,9 +126,8 @@ const { latestVersion } = Astro.props
     Run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#help"
       target="_blank"
-      class="dark:text-white"
       >help command
-    </a> (or plain <code class="dark:text-white">ddev</code>) to see the actions you can take with the
+    </a> (or plain <code>ddev</code>) to see the actions you can take with the
     CLI:
   </p>
 
@@ -143,7 +137,6 @@ const { latestVersion } = Astro.props
     Use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#describe"
       target="_blank"
-      class="dark:text-white"
       >describe command
     </a> to see a project’s parts and database connection details:
   </p>
@@ -155,7 +148,6 @@ const { latestVersion } = Astro.props
     removing anything, use the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#stop"
       target="_blank"
-      class="dark:text-white"
       >stop command
     </a>:
   </p>
@@ -167,7 +159,6 @@ const { latestVersion } = Astro.props
     project and its resources without touching your code, run the <a
       href="https://ddev.readthedocs.io/en/latest/users/usage/commands/#delete"
       target="_blank"
-      class="dark:text-white"
       >delete command
     </a>:
   </p>
@@ -190,7 +181,7 @@ const { latestVersion } = Astro.props
   />
 
   <p>
-    Remove the <code class="dark:text-white">ddev</code> binary from the WSL2 distro:
+    Remove the <code>ddev</code> binary from the WSL2 distro:
   </p>
 
   <Terminal type="powershell-ubuntu" code={`$ sudo rm /usr/bin/ddev`} />
diff --git a/src/pages/support-ddev.astro b/src/pages/support-ddev.astro
index aea5899f..f35c1978 100644
--- a/src/pages/support-ddev.astro
+++ b/src/pages/support-ddev.astro
@@ -156,7 +156,7 @@ const title = `Support DDEV`
       </div>
 
       <div class="prose mt-12 dark:prose-invert">
-        <h2 class="dark:text-white">Spread the Word</h2>
+        <h2>Spread the Word</h2>
         <p>
           If you like using DDEV, don’t keep it to yourself! Star the project <a
             href={GITHUB_URL}
@@ -198,7 +198,7 @@ const title = `Support DDEV`
       </div>
 
       <div class="prose mt-12 dark:prose-invert">
-        <h2 class="dark:text-white">Join the Advisory Group</h2>
+        <h2>Join the Advisory Group</h2>
         <p>
           We meet regularly to discuss DDEV’s present and future. You’re welcome
           to join us!

From c00f2bb31a000909f2698a4e4672491c6e5b9024 Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sun, 24 Sep 2023 09:57:28 -0600
Subject: [PATCH 09/15] Updated darkmode settings 1.3

---
 src/components/Badge.astro                   | 2 +-
 src/components/Benefits.astro                | 2 +-
 src/components/BlogPostFooter.astro          | 2 +-
 src/components/CtaButton.astro               | 2 +-
 src/components/Footer.astro                  | 4 ++--
 src/components/PlatformPicker.astro          | 8 ++++----
 src/components/RepoCard.astro                | 4 ++--
 src/components/quickstart/CommunityCTA.astro | 2 +-
 src/pages/newsletter.astro                   | 3 ++-
 src/pages/search.astro                       | 8 ++++----
 10 files changed, 19 insertions(+), 18 deletions(-)

diff --git a/src/components/Badge.astro b/src/components/Badge.astro
index 391dbefa..e720fd2e 100644
--- a/src/components/Badge.astro
+++ b/src/components/Badge.astro
@@ -1,3 +1,3 @@
-<div class="inline-block border rounded text-xs mx-[2px] px-1 py-0 relative bottom-px">
+<div class="inline-block border rounded text-xs mx-[2px] px-1 py-0 relative bottom-px dark:border-slate-700">
   <slot />
 </div>
\ No newline at end of file
diff --git a/src/components/Benefits.astro b/src/components/Benefits.astro
index 6b598915..4afa1ed8 100644
--- a/src/components/Benefits.astro
+++ b/src/components/Benefits.astro
@@ -39,7 +39,7 @@ const features = [
 ]
 ---
 
-<div class="bg-white dark:bg-slate-900">
+<div class="bg-white dark:bg-transparent">
   <div class="max-w-6xl mx-auto py-16 px-4 sm:px-6 lg:py-24 lg:px-8">
     <div class="max-w-3xl mx-auto text-center">
       <h2 class="text-base font-mono text-navy-300 mb-3 dark:text-white">Benefits</h2>
diff --git a/src/components/BlogPostFooter.astro b/src/components/BlogPostFooter.astro
index cbc12cd9..9e716ec7 100644
--- a/src/components/BlogPostFooter.astro
+++ b/src/components/BlogPostFooter.astro
@@ -51,7 +51,7 @@ orderedPosts.forEach((post, index) => {
       <a
         href={`/blog/${next.slug}`}
         rel="prefetch"
-        class="flex border items-center rounded-md w-full my-1 md:my-0 content-center justify-start md:justify-end md:text-right p-4 hover:border-blue-300 hover:shadow-sm dark:text-slate-400"
+        class="flex border items-center rounded-md w-full my-1 md:my-0 content-center justify-start md:justify-end md:text-right p-4 hover:border-blue-300 hover:shadow-sm dark:border-slate-700"
         title={`Next: ${next.data.title}`}
       >
         <div>
diff --git a/src/components/CtaButton.astro b/src/components/CtaButton.astro
index 151107ac..d30e2119 100644
--- a/src/components/CtaButton.astro
+++ b/src/components/CtaButton.astro
@@ -8,7 +8,7 @@ export interface Props {
 
 const typeClasses = {
   default: `border border-transparent text-white bg-blue-650 hover:bg-blue-800`,
-  hollow: `border border-blue-650 text-blue-650 hover:border-blue-800 hover:text-blue-800`,
+  hollow: `border border-blue-650 text-blue-650 hover:border-blue-800 hover:text-blue-800 dark:hover:text-blue-500 hover:border-blue-500`,
 }
 
 const { text, href, type = "default", target } = Astro.props
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index a1e4decd..4526915a 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -52,7 +52,7 @@ const navigation = {
 }
 ---
 
-<footer class="dark:bg-slate-900">
+<footer class="dark:bg-transparent">
   <div class="max-w-4xl mx-auto py-12 px-6 lg:px-0 lg:py-16">
     <div class="pb-8 xl:grid xl:grid-cols-3 xl:gap-8">
       <div class="grid grid-cols-auto gap-8 xl:col-span-4">
@@ -113,7 +113,7 @@ const navigation = {
       </div>
     </div>
     <div
-      class="mt-8 border-t border-gray-300 pt-8 md:flex md:items-center md:justify-between"
+      class="mt-8 border-t border-gray-300 pt-8 md:flex md:items-center md:justify-between dark:border-slate-700"
     >
       <div
         class="flex space-x-6 md:order-2 items-center justify-center content-center"
diff --git a/src/components/PlatformPicker.astro b/src/components/PlatformPicker.astro
index 74bbbe83..23d93150 100644
--- a/src/components/PlatformPicker.astro
+++ b/src/components/PlatformPicker.astro
@@ -125,7 +125,7 @@ const { heading, inputName = "platform" } = Astro.props
         class="hidden"
       />
       <label
-        class="block w-full text-center border-y border-l rounded-l py-4 select-none cursor-pointer"
+        class="block w-full text-center border-y border-l rounded-l py-4 select-none cursor-pointer dark:border-slate-700"
         for="platform-mac"
       >
         <span class="hidden md:inline-block w-4 h-4 relative" style="top: 2px"
@@ -143,7 +143,7 @@ const { heading, inputName = "platform" } = Astro.props
         class="hidden"
       />
       <label
-        class="block w-full text-center border-y border-l py-4 select-none cursor-pointer"
+        class="block w-full text-center border-y border-l py-4 select-none cursor-pointer dark:border-slate-700"
         for="platform-windows"
       >
         <span class="hidden md:inline-block w-4 h-4 relative" style="top: 2px"
@@ -161,7 +161,7 @@ const { heading, inputName = "platform" } = Astro.props
         class="hidden"
       />
       <label
-        class="block w-full text-center border-y border-l py-4 select-none cursor-pointer"
+        class="block w-full text-center border-y border-l py-4 select-none cursor-pointer dark:border-slate-700"
         for="platform-linux"
       >
         <span class="hidden md:inline-block w-4 h-4 relative" style="top: 2px"
@@ -180,7 +180,7 @@ const { heading, inputName = "platform" } = Astro.props
         class="hidden"
       />
       <label
-        class="block w-full text-center border-y border-x rounded-r py-4 select-none cursor-pointer"
+        class="block w-full text-center border-y border-x rounded-r py-4 select-none cursor-pointer dark:border-slate-700"
         for="platform-cloud"
       >
         <span class="hidden md:inline-block w-4 h-4 relative" style="top: 2px"
diff --git a/src/components/RepoCard.astro b/src/components/RepoCard.astro
index 66d6cfa8..dc92670f 100644
--- a/src/components/RepoCard.astro
+++ b/src/components/RepoCard.astro
@@ -18,10 +18,10 @@ const repoData = await getRepoDetails(name)
 
 <a
   href={`https://github.com/${name}`}
-  class="border hover:border-blue-300 rounded-md shadow-sm hover:shadow-lg"
+  class="border hover:border-blue-300 rounded-md shadow-sm hover:shadow-lg dark:border-slate-700"
 >
   <div class="">
-    <div class="flex justify-between border-b px-3 py-3">
+    <div class="flex justify-between border-b px-3 py-3 dark:border-slate-700">
       <h3 class="text-base font-bold">{name}</h3>
       <div class="font-mono text-sm" style="margin-top: 2px">
         <StarIcon
diff --git a/src/components/quickstart/CommunityCTA.astro b/src/components/quickstart/CommunityCTA.astro
index 4df644ee..82fe5b93 100644
--- a/src/components/quickstart/CommunityCTA.astro
+++ b/src/components/quickstart/CommunityCTA.astro
@@ -1,4 +1,4 @@
-<div class="bg-gray-200 p-8 rounded-lg mt-36 dark:bg-slate-600">
+<div class="bg-gray-200 p-8 rounded-lg mt-36 dark:bg-slate-700">
   <h2 class="mt-0 dark:text-white">Join the DDEV Community</h2>
   <p class="mb-0 dark:text-slate-400">
     DDEV is an open source project with a growing community, and there are lots
diff --git a/src/pages/newsletter.astro b/src/pages/newsletter.astro
index 90adf40e..7db626d5 100644
--- a/src/pages/newsletter.astro
+++ b/src/pages/newsletter.astro
@@ -20,8 +20,9 @@ const title = `Newsletter`
   <main class="max-w-4xl mx-auto mb-24">
     <Heading title={`Sign up for our newsletter`} />
 
+    <div class="prose dark:prose-invert my-8">
     This is a low-volume newsletter, usually just once a month. We'd love to be able to keep in touch with you.
-
+    </div>
     <!-- NEW FORM GOES BELOW HERE -->
 
     <script id='formScript5879720000000512037' src='https://crm.zoho.com/crm/WebFormServeServlet?rid=d761f49b3421baca337046aa6e88b357c00ca36d6d951c2b6cd512fb5452c9edgide888d842d2182432c1bf117aecd6280f1bf0b73e665551779217573985104582&script=$sYG'></script>
diff --git a/src/pages/search.astro b/src/pages/search.astro
index f59f928a..5af38c6d 100644
--- a/src/pages/search.astro
+++ b/src/pages/search.astro
@@ -46,10 +46,10 @@ const title = `Search`
         return `
         <a href="${
           result.id
-        }" class="border rounded w-full flex items-center content-center my-2 p-4 hover:shadow-sm hover:border-blue-300">
-          <h2 class="font-bold block w-3/4">${result.title}</h2>
+        }" class="border rounded w-full flex items-center content-center my-2 p-4 hover:shadow-sm hover:border-blue-300 dark:border-slate-700">
+          <h2 class="font-bold block w-3/4 dark:text-white">${result.title}</h2>
           <div class="block w-1/4 text-right">
-            <div class="inline-block text-sm font-mono">${getResultLabelFromPath(
+            <div class="inline-block text-sm font-mono dark:text-slate-500">${getResultLabelFromPath(
               result.id
             )}</div>
           </div>
@@ -130,7 +130,7 @@ const title = `Search`
       <input
         id="search-keywords"
         type="search"
-        class="border rounded px-4 py-2 text-lg w-full"
+        class="border rounded px-4 py-2 text-lg w-full dark:bg-transparent dark:border-slate-700 dark:text-white"
         autofocus
       />
       <div id="results"></div>

From 46c6a6da7cdceb5a2e2f57dd05b04905a2090b76 Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sun, 24 Sep 2023 10:48:35 -0600
Subject: [PATCH 10/15] Updated darkmode settings, tweaked logos individually.

---
 src/components/FeaturedSponsors.astro | 16 +++++++++-------
 src/components/Header.astro           |  2 +-
 src/components/SoftwareLogos.astro    | 10 +++++-----
 src/components/Sponsors.astro         |  4 ++--
 src/components/Tabs.astro             | 18 ++++++++++++------
 src/pages/get-started.astro           |  2 +-
 src/styles/global.css                 |  7 -------
 7 files changed, 30 insertions(+), 29 deletions(-)

diff --git a/src/components/FeaturedSponsors.astro b/src/components/FeaturedSponsors.astro
index 92c40829..1ee9ccd1 100644
--- a/src/components/FeaturedSponsors.astro
+++ b/src/components/FeaturedSponsors.astro
@@ -7,15 +7,17 @@ import featuredSponsors from "../featured-sponsors.json"
  * you need to add one.
  */
 const nudges = {
-  "Platform.sh": "mt-12 h-11",
-  Tag1: "h-9",
+  "Platform.sh": "mt-12 h-11 dark:invert",
+  Tag1: "h-9 dark:bg-white",
   "Oliver Wand": "h-12 w-12",
-  DrupalEasy: "h-10",
+  DrupalEasy: "h-10 dark:invert",
+  b13: "dark:invert",
+  "i-gelb": "dark:bg-white",
   "Redfin Solutions": "h-16 w-16",
-  MacStadium: "h-15",
-  Lullabot: "h-9",
+  MacStadium: "h-15 dark:bg-white",
+  Lullabot: "h-9 dark:bg-white",
   "Craft CMS": "h-11",
-  undpaul: "h-9",
+  undpaul: "h-9 dark:invert",
   "1xINTERNET": "h-11",
 }
 
@@ -44,7 +46,7 @@ featuredSponsors.map((sponsor) => {
         >
           <img
             src={sponsor.logo}
-            class="block w-auto h-full dark:invert"
+            class="block w-auto h-full"
             alt={`${sponsor.name} logo`}
           />
         </a>
diff --git a/src/components/Header.astro b/src/components/Header.astro
index 1b0c5af4..952dd871 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -54,7 +54,7 @@ import {
 
 <style type="postcss">
   .menu {
-    @apply hidden absolute top-0 right-0 max-w-full bg-white px-8 py-4 z-30 text-center shadow-2xl rounded-lg m-3;
+    @apply hidden absolute top-0 right-0 max-w-full bg-white px-8 py-4 z-30 text-center shadow-2xl rounded-lg m-3 dark:bg-slate-800 dark:text-white;
 
     &.open {
       @apply block;
diff --git a/src/components/SoftwareLogos.astro b/src/components/SoftwareLogos.astro
index f8b178b8..81b5d6b9 100644
--- a/src/components/SoftwareLogos.astro
+++ b/src/components/SoftwareLogos.astro
@@ -3,11 +3,11 @@
 
 <div class="opacity-60">
   <div class="max-w-7xl mx-auto py-12 px-4 sm:px-6 lg:px-8">
-    <div class="flex justify-center content-center flex-wrap dark:invert">
+    <div class="flex justify-center content-center flex-wrap">
       <div class="p-10">
-        <img class="h-12" src="/logos/php.svg" alt="PHP logo" />
+        <img class="h-12 dark:invert" src="/logos/php.svg" alt="PHP logo" />
       </div>
-      <div class="p-10 mt-2">
+      <div class="p-10 mt-2 dark:invert">
         <img class="h-6" src="/logos/node.svg" alt="Node.js logo" />
       </div>
       <div class="p-10">
@@ -15,13 +15,13 @@
       </div>
       <div class="p-10">
         <img
-          class="h-8 mt-1"
+          class="h-8 mt-1 dark:invert"
           src="/logos/postgresql.png"
           alt="PostgreSQL logo"
         />
       </div>
       <div class="p-10">
-        <img class="h-4 mt-3" src="/logos/nginx.svg" alt="nginx logo" />
+        <img class="h-4 mt-3 dark:invert" src="/logos/nginx.svg" alt="nginx logo" />
       </div>
       <div class="p-10">
         <img class="h-4 mt-3" src="/logos/apache.svg" alt="Apache logo" />
diff --git a/src/components/Sponsors.astro b/src/components/Sponsors.astro
index aaa262db..a1327f31 100644
--- a/src/components/Sponsors.astro
+++ b/src/components/Sponsors.astro
@@ -86,7 +86,7 @@ gitHubSponsors.forEach((gitHubSponsor) => {
               alt={sponsor.imageAlt}
               width={100}
               height={100}
-              class={`block w-full h-full`}
+              class={`block w-full h-full  dark:bg-white`}
             />
           )}
           {!sponsor.imageUrl.includes(".svg") && (
@@ -98,7 +98,7 @@ gitHubSponsors.forEach((gitHubSponsor) => {
               breakpoints={{ count: 1, maxWidth: 100 }}
               attributes={{
                 img: {
-                  class: `block w-full h-full`,
+                  class: `block w-full h-full dark:bg-white`,
                 },
               }}
             />
diff --git a/src/components/Tabs.astro b/src/components/Tabs.astro
index 7339075b..127015a3 100644
--- a/src/components/Tabs.astro
+++ b/src/components/Tabs.astro
@@ -46,21 +46,29 @@ order.map((label) => {
     }
 
     &.active {
-      @apply text-black;
+      @apply text-black dark:text-gray-300;
 
       span {
-        @apply border-solid border-black;
+        @apply border-solid border-black dark:text-gray-300;
       }
     }
   }
 
   .panel {
-    @apply hidden px-4 rounded-lg shadow-xl;
+    @apply hidden px-4 rounded-lg shadow-xl dark:bg-transparent dark:shadow-slate-900/50;
 
     &.active {
       @apply block;
     }
   }
+  @media (prefers-color-scheme: dark) {
+    .panel.active {
+      @apply dark:bg-slate-600;
+      box-shadow: none;
+    }
+
+  }
+
 </style>
 
 <script>
@@ -118,9 +126,7 @@ order.map((label) => {
             id={`tab-${tab.uid}`}
             class={`tab` + (index === 0 ? ` active` : ``)}
           >
-            <span
-            class={"dark:text-slate-200"}
-            >{tab.label}</span>
+            <span>{tab.label}</span>
           </button>
         ))
       }
diff --git a/src/pages/get-started.astro b/src/pages/get-started.astro
index 99f3332e..dc6c4354 100644
--- a/src/pages/get-started.astro
+++ b/src/pages/get-started.astro
@@ -29,7 +29,7 @@ const latestRelease = await getLatestReleaseVersion()
 >
   <main class="max-w-4xl mx-auto mb-24 dark:text-white">
     <Heading title={title} subtitle={`Install and start using DDEV.`} />
-    <div class="prose mb-16 dark:text-slate-400">
+    <div class="prose mb-16 dark:prose-invert">
       <PlatformPicker heading={`Choose your platform:`} />
     </div>
 
diff --git a/src/styles/global.css b/src/styles/global.css
index 8803e474..d2f89483 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -45,13 +45,6 @@ footer {
       }
     }
   }
-  .menu:where(.astro-3EF6KSR2){
-    @apply dark:bg-slate-800 dark:text-white;
-  }
-  .panel.active{
-    @apply dark:bg-slate-600;
-    box-shadow: none;
-  }
 }
 
 

From 71c5202284d8a7f7377532cb261db118258fe02c Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sun, 24 Sep 2023 10:57:29 -0600
Subject: [PATCH 11/15] Updated darkmode settings, removed extra
 dark:text-white that are not needed.

---
 src/components/quickstart/Cloud.astro   | 4 ++--
 src/components/quickstart/Linux.astro   | 8 ++++----
 src/components/quickstart/Mac.astro     | 8 ++++----
 src/components/quickstart/Windows.astro | 8 ++++----
 src/pages/get-started.astro             | 2 +-
 5 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/components/quickstart/Cloud.astro b/src/components/quickstart/Cloud.astro
index 35c78981..ae28860a 100644
--- a/src/components/quickstart/Cloud.astro
+++ b/src/components/quickstart/Cloud.astro
@@ -81,7 +81,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose dark:prose-invert">
-  <h2 class="text-3xl mt-24 dark:text-white">
+  <h2 class="text-3xl mt-24">
     <small class="block font-mono text-xs text-gray-500">2/2</small>Create a
     Project
   </h2>
@@ -120,7 +120,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose dark:prose-invert">
-  <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
+  <h2 class="text-3xl mt-24">Explore & Enjoy!</h2>
 
   <p>
     Take a peek at your project’s new <code>.ddev/</code> directory. You can add
diff --git a/src/components/quickstart/Linux.astro b/src/components/quickstart/Linux.astro
index 47fac5ae..f4e8e68c 100644
--- a/src/components/quickstart/Linux.astro
+++ b/src/components/quickstart/Linux.astro
@@ -18,7 +18,7 @@ const { latestVersion } = Astro.props
     >.
   </p>
 
-  <h2 class="text-3xl mt-24 dark:text-white">
+  <h2 class="text-3xl mt-24">
     <small class="block font-mono text-xs text-gray-500">1/3</small>Install
     Docker
   </h2>
@@ -91,7 +91,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose dark:prose-invert">
-  <h2 class="text-3xl mt-24 dark:text-white">
+  <h2 class="text-3xl mt-24">
     <small class="block font-mono text-xs text-gray-500">2/3</small>Install DDEV
   </h2>
 
@@ -137,7 +137,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose dark:prose-invert">
-  <h2 class="text-3xl mt-24 dark:text-white">
+  <h2 class="text-3xl mt-24">
     <small class="block font-mono text-xs text-gray-500">3/3</small>Create a
     Project
   </h2>
@@ -179,7 +179,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose dark:prose-invert">
-  <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
+  <h2 class="text-3xl mt-24">Explore & Enjoy!</h2>
 
   <p>
     Take a peek at your project’s new <code>.ddev/</code> directory. You can add
diff --git a/src/components/quickstart/Mac.astro b/src/components/quickstart/Mac.astro
index 84b63af2..fc1ae3a4 100644
--- a/src/components/quickstart/Mac.astro
+++ b/src/components/quickstart/Mac.astro
@@ -18,7 +18,7 @@ const { latestVersion } = Astro.props
     >.
   </p>
 
-  <h2 class="text-3xl mt-24 dark:text-white">
+  <h2 class="text-3xl mt-24">
     <small class="block font-mono text-xs text-gray-500">1/3</small>Install
     Docker
   </h2>
@@ -55,7 +55,7 @@ const { latestVersion } = Astro.props
   <p>Confirm that you’ve now got a Docker provider:</p>
   <Terminal code={`→ docker -v\nDocker version 24.0.5, build ced0996`} />
 
-  <h2 class="text-3xl mt-24 dark:text-white">
+  <h2 class="text-3xl mt-24">
     <small class="block font-mono text-xs text-gray-500">2/3</small>Install DDEV
   </h2>
 </div>
@@ -79,7 +79,7 @@ const { latestVersion } = Astro.props
   <p>Confirm that you’ve now got DDEV installed: 🎉</p>
   <Terminal code={`→ ddev -v\nddev version ${latestVersion}`} />
 
-  <h2 class="text-3xl mt-24 dark:text-white">
+  <h2 class="text-3xl mt-24">
     <small class="block font-mono text-xs text-gray-500">3/3</small>Create a
     Project
   </h2>
@@ -120,7 +120,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose dark:prose-invert">
-  <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
+  <h2 class="text-3xl mt-24">Explore & Enjoy!</h2>
 
   <p>
     Take a peek at your project’s new <code>.ddev/</code> directory. You can add
diff --git a/src/components/quickstart/Windows.astro b/src/components/quickstart/Windows.astro
index 3a6030e5..e6068b6a 100644
--- a/src/components/quickstart/Windows.astro
+++ b/src/components/quickstart/Windows.astro
@@ -18,7 +18,7 @@ const { latestVersion } = Astro.props
     >.
   </p>
 
-  <h2 class="text-3xl mt-24 dark:text-white">
+  <h2 class="text-3xl mt-24">
     <small class="block font-mono text-xs text-gray-500">1/3</small>Install WSL2
     with Ubuntu
   </h2>
@@ -44,7 +44,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose dark:prose-invert">
-  <h2 class="text-3xl mt-24 dark:text-white">
+  <h2 class="text-3xl mt-24">
     <small class="block font-mono text-xs text-gray-500">2/3</small>Run the
     Install Script
   </h2>
@@ -67,7 +67,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose dark:prose-invert">
-  <h2 class="text-3xl mt-24 dark:text-white">
+  <h2 class="text-3xl mt-24">
     <small class="block font-mono text-xs text-gray-500">3/3</small>Create a
     Project
   </h2>
@@ -109,7 +109,7 @@ const { latestVersion } = Astro.props
 </div>
 
 <div class="prose dark:prose-invert">
-  <h2 class="text-3xl mt-24 dark:text-white">Explore & Enjoy!</h2>
+  <h2 class="text-3xl mt-24">Explore & Enjoy!</h2>
 
   <p>
     Take a peek at your project’s new <code>.ddev/</code> directory. You can add
diff --git a/src/pages/get-started.astro b/src/pages/get-started.astro
index dc6c4354..ba5ebb7f 100644
--- a/src/pages/get-started.astro
+++ b/src/pages/get-started.astro
@@ -27,7 +27,7 @@ const latestRelease = await getLatestReleaseVersion()
   title={title}
   description={`Start here if you want to give DDEV a try!`}
 >
-  <main class="max-w-4xl mx-auto mb-24 dark:text-white">
+  <main class="max-w-4xl mx-auto mb-24">
     <Heading title={title} subtitle={`Install and start using DDEV.`} />
     <div class="prose mb-16 dark:prose-invert">
       <PlatformPicker heading={`Choose your platform:`} />

From 4e52e8960f071669c01ee9cf123e75a037f2d218 Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sun, 24 Sep 2023 12:18:31 -0600
Subject: [PATCH 12/15] Added dark ddev logo.

---
 public/logos/dark-ddev.svg  |  1 +
 src/components/Header.astro | 17 +++++++++++------
 2 files changed, 12 insertions(+), 6 deletions(-)
 create mode 100644 public/logos/dark-ddev.svg

diff --git a/public/logos/dark-ddev.svg b/public/logos/dark-ddev.svg
new file mode 100644
index 00000000..717cb7f6
--- /dev/null
+++ b/public/logos/dark-ddev.svg
@@ -0,0 +1 @@
+<svg fill="none" height="69" viewBox="0 0 293 69" width="293" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><clipPath id="a"><path d="m0 0h293v69h-293z"/></clipPath><g clip-path="url(#a)" clip-rule="evenodd" fill-rule="evenodd"><g fill="#02a8e2"><path d="m41.1 6.4h29.1l15.6 15.6v24.6l-15.6 15.6h-26.2c-.7-.8-1.8-1.4-3-1.4-2.1 0-3.9 1.7-3.9 3.9 0 2.1 1.7 3.9 3.9 3.9 1.2 0 2.2-.5 3-1.4h28.3l18.5-18.5v-28.8l-18.5-18.5h-31.2c-.7-.8-1.8-1.4-3-1.4-2.1 0-3.9 1.7-3.9 3.9 0 2.1 1.7 3.9 3.9 3.9 1.2 0 2.3-.6 3-1.4zm-3-4.2c.9 0 1.6.7 1.6 1.6s-.7 1.6-1.6 1.6-1.6-.7-1.6-1.6c0-.8.7-1.6 1.6-1.6zm3 60.9c.9 0 1.6.7 1.6 1.6s-.7 1.6-1.6 1.6-1.6-.7-1.6-1.6.7-1.6 1.6-1.6z"/><path d="m68.2 11.4h-37.2v.1c-.7-.8-1.7-1.2-2.8-1.2-2.1 0-3.9 1.7-3.9 3.9 0 2.1 1.7 3.9 3.9 3.9 1.3 0 2.5-.6 3.2-1.6h34.7l9.7 9.7v16.3l-9.7 9.7h-35.3c-.7-.8-1.8-1.4-3-1.4-2.1 0-3.9 1.7-3.9 3.9 0 2.1 1.7 3.9 3.9 3.9 1.2 0 2.2-.5 3-1.4h37.3l12.6-12.6v-20.6zm-40 1.2c.9 0 1.6.7 1.6 1.6s-.7 1.6-1.6 1.6-1.6-.7-1.6-1.6c-.1-.9.7-1.6 1.6-1.6zm-.3 40.4c.9 0 1.6.7 1.6 1.6s-.7 1.6-1.6 1.6-1.6-.7-1.6-1.6c-.1-.9.7-1.6 1.6-1.6z"/><path d="m62.4 47h-45.2c-.7.7-1.6 1.1-2.7 1.1-2.1 0-3.9-1.7-3.9-3.9 0-2.1 1.7-3.9 3.9-3.9 1.3 0 2.5.7 3.2 1.7h12.4l-5.2-5.2h-17.09998c-.7.8-1.8 1.4-3 1.4-2.1 0-3.899996-1.7-3.899996-3.9 0-2.1 1.699996-3.9 3.899996-3.9 1.2 0 2.2.5 3 1.4h19.19998l10.3 10.2h24.6l3.7-3.7v-7.9l-3.7-3.7h-22.9l5.2 5.2h10.1c.7-.8 1.8-1.4 3-1.4 2.1 0 3.9 1.7 3.9 3.9 0 2.1-1.7 3.9-3.9 3.9-1.2 0-2.2-.5-3-1.4h-12.2l-10.2-10.3h-13.5c-.7.8-1.8 1.4-3 1.4-2.1 0-3.9-1.7-3.9-3.9 0-2.1 1.7-3.9 3.9-3.9 1.2 0 2.2.5 3 1.4h45.6l6.7 6.7v12.1l-6.7 6.6zm-5.1-14.4c-.9 0-1.6.7-1.6 1.6s.7 1.6 1.6 1.6 1.6-.7 1.6-1.6c.1-.8-.7-1.6-1.6-1.6zm-41.8-10.2c-.9 0-1.6.7-1.6 1.6s.7 1.6 1.6 1.6 1.6-.7 1.6-1.6c0-.8-.7-1.6-1.6-1.6zm-1 20.2c-.9 0-1.6.7-1.6 1.6s.7 1.6 1.6 1.6 1.6-.7 1.6-1.6c.1-.9-.7-1.6-1.6-1.6zm-9.59998-10c-.9 0-1.6.7-1.6 1.6s.7 1.6 1.6 1.6 1.6-.7 1.6-1.6c0-.8-.7-1.6-1.6-1.6z"/></g><path d="m112.2 23h22.8c3.9 0 7.1 3.2 7.1 7.1v8.4c0 3.9-3.2 7.1-7.1 7.1h-22.8zm22.9-6.1h-29v34.9h29c7.3 0 13.3-6 13.3-13.3v-8.4c-.1-7.3-6-13.2-13.3-13.2zm69.9 14.3v20.5h36.1v-6.2h-29.9v-8.1h24.9v-6.2h-24.9zm-43.1-8.2h22.8c3.9 0 7.1 3.2 7.1 7.1v8.4c0 3.9-3.2 7.1-7.1 7.1h-22.8zm22.8-6.1h-29v34.9h29c7.3 0 13.3-6 13.3-13.3v-8.4c0-7.3-6-13.2-13.3-13.2zm63 0 19.1 33 1 1.8h5l1.1-1.8 19.1-33h-7.2l-15.5 26.8-15.5-26.8z" fill="#fff"/><path d="m211.2 23h29.9v-6.1h-36.1v6.1z" fill="#02a8e2"/></g></svg>
\ No newline at end of file
diff --git a/src/components/Header.astro b/src/components/Header.astro
index 952dd871..667a24fc 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -69,12 +69,17 @@ import {
   >
     <a href="/" class="relative block cursor-pointer -ml-2">
       <span class="sr-only">DDEV logo</span>
-      <img
-        class="h-8 w-auto sm:h-10 dark:invert" 
-        src="/logos/ddev.svg"
-        alt="DDEV logo"
-        aria-hidden="true"
-      />
+      <picture>
+        <source
+          srcset="/logos/dark-ddev.svg" 
+           media="(prefers-color-scheme: dark)">
+        <img
+          class="h-8 w-auto sm:h-10" 
+          src="/logos/ddev.svg"
+          alt="DDEV logo"
+          aria-hidden="true"
+        />
+      </picture>
     </a>
     <div class="w-2/3 flex justify-end items-center">
       <ul class="hidden lg:flex">

From 75dc52f86e64afee04a3f68cd29ab8ff540d6ac1 Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sun, 24 Sep 2023 12:48:31 -0600
Subject: [PATCH 13/15] Added dark version of branded logos.

---
 public/logos/dark-i-gelb.svg           | 91 ++++++++++++++++++++++++
 public/logos/dark-lullabot.svg         | 56 +++++++++++++++
 public/logos/dark-mac-stadium.svg      | 95 ++++++++++++++++++++++++++
 public/logos/dark-redfin-solutions.svg | 79 +++++++++++++++++++++
 public/logos/dark-tag1.svg             | 51 ++++++++++++++
 src/components/FeaturedSponsors.astro  | 18 +++--
 src/featured-sponsors.json             | 15 ++++
 7 files changed, 398 insertions(+), 7 deletions(-)
 create mode 100644 public/logos/dark-i-gelb.svg
 create mode 100644 public/logos/dark-lullabot.svg
 create mode 100644 public/logos/dark-mac-stadium.svg
 create mode 100644 public/logos/dark-redfin-solutions.svg
 create mode 100644 public/logos/dark-tag1.svg

diff --git a/public/logos/dark-i-gelb.svg b/public/logos/dark-i-gelb.svg
new file mode 100644
index 00000000..0a13bd2d
--- /dev/null
+++ b/public/logos/dark-i-gelb.svg
@@ -0,0 +1,91 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   fill="none"
+   height="42"
+   viewBox="0 0 139 42"
+   width="139"
+   version="1.1"
+   id="svg11"
+   sodipodi:docname="dark-i-gelb.svg"
+   inkscape:version="1.3 (0e150ed, 2023-07-21)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs11" />
+  <sodipodi:namedview
+     id="namedview11"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:zoom="5.6190476"
+     inkscape:cx="69.495763"
+     inkscape:cy="20.911017"
+     inkscape:window-width="1472"
+     inkscape:window-height="920"
+     inkscape:window-x="0"
+     inkscape:window-y="36"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="g11" />
+  <clipPath
+     id="a">
+    <path
+       d="m0 0h139v42h-139z"
+       id="path1" />
+  </clipPath>
+  <g
+     clip-path="url(#a)"
+     id="g11">
+    <g
+       fill="#222"
+       id="g8"
+       style="fill:#ffffff;fill-opacity:1">
+      <path
+         d="m.75 30.1989v-.9487c2.3116-.2063 2.5592-.4125 2.5592-2.8875v-7.425c0-2.2275-.1238-2.3925-2.31153-2.7225v-.8663c1.85753-.2887 3.59123-.7425 5.20103-1.4025v12.4163c0 2.4337.2477 2.6812 2.6006 2.8875v.9487zm1.9401-21.12004c0-1.0725.8668-1.8562 1.8575-1.8562 1.032 0 1.8162.7837 1.8162 1.8562 0 .99004-.8255 1.81504-1.8575 1.81504-.9081.0413-1.8162-.825-1.8162-1.81504z"
+         id="path2"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m19.9029 23.105h-8.3795l.4954-1.98h8.4207z"
+         id="path3"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m39.6749 14.7303c-.3302.5775-1.0732 1.5263-1.6511 1.815l-2.1052-.1237c.7018.7837 1.1145 1.8975 1.1145 3.2175 0 3.8775-3.3022 5.775-6.4394 5.775-.6191 0-1.2796-.1238-1.8575-.165-.4953.33-1.1145.99-1.1145 1.485 0 .7012.6605 1.4025 2.3116 1.4025 1.3209 0 2.6418-.0413 3.8389-.0413 2.2703 0 5.2836.7013 5.2836 4.2488 0 3.63-4.293 7.1362-9.1638 7.1362-4.0865 0-6.3156-2.3512-6.3568-4.3725 0-.7837.3302-1.485.8668-2.0212.743-.7013 2.1465-1.8563 3.0546-2.5163-1.3209-.4125-2.229-1.2375-2.7244-1.98-.3302-.5362-.454-1.155-.4128-1.5262 1.4861-.5363 2.6419-1.485 3.2197-2.1863-1.6511-.7012-3.2197-2.3925-3.2197-4.8262 0-4.0838 3.7564-5.9813 6.5633-5.9813 1.2383 0 2.4767.33 3.5086.9075 1.8163-.0825 3.6738-.2887 4.9947-.495zm-11.5166 16.665c-.9494.7425-1.6924 1.7738-1.6924 2.805 0 1.9388 2.1465 3.4238 4.8296 3.4238 3.5086 0 5.2836-1.7738 5.2836-4.0013 0-1.2375-.6192-2.1037-1.6924-2.5575-.9082-.3712-1.9814-.4537-3.5087-.4537-1.7749 0-2.5592.2062-3.2197.7837zm-.6192-11.9625c0 2.805 1.4035 4.8263 3.4674 4.8263 1.6099-.0413 3.0546-1.4438 3.0546-4.29 0-2.8463-1.3622-4.8675-3.4674-4.8675-1.6511.0412-3.0546 1.5262-3.0546 4.3312z"
+         id="path4"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m53.9178 27.1488c-2.3116 2.8462-4.8296 3.5062-5.9854 3.5062-4.4993 0-7.1824-3.5887-7.1824-7.6725 0-2.475.9081-4.6611 2.4354-6.3111 1.486-1.65 3.5087-2.6402 5.4075-2.6402 3.0546 0 5.49 2.6813 5.49 5.4863 0 .7013-.1651.9901-.8256 1.1551-.6192.1238-5.2011.4537-9.5765.6187.0412 4.9087 2.8894 6.8887 5.49 6.8887 1.486 0 2.8482-.5775 4.1691-1.815zm-10.0719-7.3425c2.0639 0 4.0865-.0412 6.1917-.1237.6605 0 .8668-.2063.8668-.7013.0413-1.8562-1.197-3.5888-3.2197-3.5888-1.6924 0-3.3022 1.485-3.8388 4.4138z"
+         id="path5"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m55.4023 30.1983v-.9488c2.3116-.2062 2.6418-.4125 2.6418-2.805v-16.995c0-2.4337-.2063-2.5575-2.5179-2.7225v-.86622c1.8988-.20625 4.1691-.825 5.4487-1.27875v21.86247c0 2.3925.289 2.5988 2.6418 2.805v.9488z"
+         id="path6"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m72.5726 14.4017c.5779-.2475 1.1145-.3712 1.486-.3712 3.9214 0 7.2237 3.3 7.2237 7.5487 0 5.28-4.293 9.0338-9.2051 9.0338-1.486 0-3.3848-.3713-5.4074-1.2788v-20.0062c0-2.2275-.0826-2.4338-2.4354-2.6813v-.82498c1.7337-.20625 3.9627-.78375 5.3249-1.27875v11.09623zm-2.9721 11.6325c0 .5363.0826.9075.2064 1.2375.2064.7013 1.3209 1.98 3.261 2.0213 3.0546 0 4.9947-2.5575 4.9947-6.7238 0-4.0837-2.5593-6.4762-5.6139-6.4762-1.0319 0-2.1877.2887-2.8482.7012z"
+         id="path7"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m89.5273 0h.7v42h-.7z"
+         id="path8"
+         style="fill:#ffffff;fill-opacity:1" />
+    </g>
+    <path
+       d="m118.988 40.2861c10.811 0 19.575-8.7578 19.575-19.561 0-10.8033-8.764-19.56104-19.575-19.56104-10.81 0-19.5739 8.75774-19.5739 19.56104 0 10.8032 8.7639 19.561 19.5739 19.561z"
+       fill="#fff"
+       id="path9" />
+    <path
+       d="m118.987 29.9924c5.121 0 9.272-4.1484 9.272-9.2657s-4.151-9.2658-9.272-9.2658-9.272 4.1485-9.272 9.2658 4.151 9.2657 9.272 9.2657z"
+       fill="#ffe60b"
+       id="path10" />
+    <path
+       d="m118.988.839844c-11.005 0-19.9021 8.891356-19.9021 19.888556s8.8971 19.8886 19.9021 19.8886 19.902-8.8914 19.902-19.8886-8.897-19.888556-19.902-19.888556zm0 39.122056c-10.63 0-19.2461-8.6106-19.2461-19.2335 0-10.6228 8.6161-19.2334 19.2461-19.2334s19.247 8.6106 19.247 19.2334c0 10.6229-8.617 19.2335-19.247 19.2335z"
+       fill="#222"
+       id="path11"
+       style="fill:#ffffff;fill-opacity:1" />
+  </g>
+</svg>
diff --git a/public/logos/dark-lullabot.svg b/public/logos/dark-lullabot.svg
new file mode 100644
index 00000000..80363421
--- /dev/null
+++ b/public/logos/dark-lullabot.svg
@@ -0,0 +1,56 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   fill="none"
+   height="36"
+   viewBox="0 0 181 36"
+   width="181"
+   version="1.1"
+   id="svg3"
+   sodipodi:docname="dark-lullabot.svg"
+   inkscape:version="1.3 (0e150ed, 2023-07-21)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs3" />
+  <sodipodi:namedview
+     id="namedview3"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:zoom="4.5635359"
+     inkscape:cx="90.390436"
+     inkscape:cy="17.968523"
+     inkscape:window-width="1312"
+     inkscape:window-height="449"
+     inkscape:window-x="0"
+     inkscape:window-y="37"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg3" />
+  <clipPath
+     id="a">
+    <path
+       d="m0 0h181v36h-181z"
+       id="path1" />
+  </clipPath>
+  <g
+     clip-path="url(#a)"
+     clip-rule="evenodd"
+     fill-rule="evenodd"
+     id="g3">
+    <path
+       d="m31.363 17.9224h1.4895c.989 0 1.7911.8013 1.7923 1.7891v6.8357c0 .9879-.8021 1.7891-1.791 1.7891h-1.4896v3.5612c0 1.9708-1.5993 3.5672-3.5711 3.5672h-20.25135c-1.97298 0-3.57114-1.5976-3.57114-3.5672v-3.5612h-1.48953c-.98894 0-1.791078-.8012-1.791078-1.7891v-6.8357c0-.9878.802138-1.7891 1.791078-1.7891h1.48953v-3.3964c0-1.9709 1.59937-3.5673 3.57114-3.5673h8.50005v-3.927c-1.1416-.58902-1.923-1.77566-1.923-3.14764 0-1.95744 1.5884-3.544064 3.548-3.544064s3.548 1.586624 3.548 3.544064c0 1.37077-.7814 2.55862-1.923 3.14764v3.927h8.5001c1.973 0 3.5711 1.5977 3.5711 3.5673zm-16.4127.972c0 1.1175-.9068 2.0233-2.0255 2.0233s-2.0255-.9058-2.0255-2.0233c0-1.1174.9068-2.0232 2.0255-2.0232s2.0255.9058 2.0255 2.0232zm9.6806 0c0 1.1175-.9068 2.0233-2.0255 2.0233-1.1186 0-2.0255-.9058-2.0255-2.0233 0-1.1174.9069-2.0232 2.0255-2.0232 1.1187 0 2.0255.9058 2.0255 2.0232zm-6.875 10.8481c-3.5003 0-6.7931-1.3586-9.27159-3.8258-.52499-.522-.5262-1.3708-.00363-1.894.5225-.5244 1.3723-.5256 1.89612-.0036 1.9729 1.9634 4.5943 3.044 7.3791 3.044 2.7935 0 5.4184-1.0867 7.3939-3.0599.5238-.5232 1.3723-.5232 1.8961 0s.5238 1.3708 0 1.894c-2.4809 2.4806-5.7798 3.8453-9.29 3.8453z"
+       fill="#f80000"
+       id="path2" />
+    <path
+       d="m86.313 10.7224v23.9706c0 .3279.2612.5953.5855.5921h4.6057c.3243 0 .5856-.2642.5856-.5921v-24.5468c0-.35658-.3084-.63354-.6575-.58894l-4.6064.57614c-.2925.0382-.5129.2897-.5129.589zm94.377 3.0146c0 .8722-.677 1.5598-1.557 1.5598-.872 0-1.571-.6844-1.571-1.5598 0-.8532.696-1.5408 1.571-1.5408.88 0 1.557.6844 1.557 1.5408zm-2.737 0c0 .6844.5 1.2287 1.189 1.2287.667 0 1.161-.5443 1.161-1.2192 0-.6844-.491-1.2383-1.17-1.2383-.68 0-1.18.5539-1.18 1.2288zm.937.8085h-.352v-1.5407c.139-.0287.334-.0478.585-.0478.29 0 .419.0478.528.1114.086.0669.148.1879.148.3375 0 .1687-.128.2992-.314.3566v.019c.148.0574.233.1687.277.3757.047.2356.076.3278.11.3852h-.38c-.041-.0492-.068-.1591-.102-.3016-.006-.0239-.012-.0486-.018-.0741-.029-.1687-.12-.2451-.315-.2451h-.167zm.01-.8754h.167c.195 0 .352-.0669.352-.226 0-.14-.101-.2356-.324-.2356-.091 0-.158.0096-.195.0191zm-108.6387 3.9665c.3237 0 .5849.2642.5849.5921v9.8461c0 2.1265.8996 2.8459 2.4007 2.8459 1.1136 0 2.0451-.4297 2.7402-.9868.1415-.1146.2236-.2865.2236-.4679v-11.2373c0-.3279.2613-.5921.5849-.5921h4.6064c.3237 0 .5849.2642.5849.5921v16.267c0 .2992-.2204.5506-.5129.5888l-4.6057.5763c-.3492.0445-.6576-.2325-.6576-.589v-.5825c0-.4967-.5695-.7768-.9537-.4616-1.2743 1.0505-2.913 1.8272-4.7128 1.8272-3.4137 0-5.4774-2.3143-5.4774-6.0738v-11.5524c0-.3279.2612-.5921.5849-.5921zm26.1482 17.0564v-23.9706c0-.2993.2198-.5508.5128-.589l4.6057-.57614c.349-.0446.658.23236.658.58894v24.5468c0 .3279-.262.5921-.585.5921h-4.6067c-.3236.0032-.5848-.2642-.5848-.5921zm14.4845 1.162c2.401 0 3.791-1.2161 5.028-2.6963h.117c.767 1.8909 2.573 2.9128 6.182 2.5021.157-.0191.283-.1464.305-.3056l.478-3.5431c.025-.1942-.11-.3725-.302-.3979-.897-.1114-1.076-.3184-1.076-1.4039l.038-5.2366c.076-4.9374-1.913-7.7069-7.953-7.7069-3.153 0-5.928 1.0027-7.772 1.9514-.151.0796-.226.2515-.179.4138l1.01 3.6036c.06.2101.295.3151.49.2196 1.907-.9295 3.861-1.598 5.55-1.598 2.14 0 3.078.8372 3.078 2.6963 0 .191-.151.347-.341.3533-7.572.2961-9.979 2.9606-9.979 6.2522 0 2.7313 2.325 4.896 5.326 4.896zm4.594-8.3755c.211-.0286.396.1369.396.3502v2.8428c0 .0891-.031.1782-.094.2419-.601.6303-1.501 1.0728-2.605 1.0728-1.278 0-2.177-.7576-2.177-1.8973 0-1.4994 1.214-2.1901 4.48-2.6104zm19.761 8.3373c-1.117 0-2.687-.2801-3.807-.6749-.088-.0319-.179-.0414-.274-.0287l-4.634.6463c-.352.0477-.667-.2292-.667-.5889v-24.4482c0-.2993.22-.5508.513-.589l4.606-.57614c.349-.0446.658.23236.658.58894v7.9679c0 .4998.569.7736.953.4616 1.01-.8182 2.322-1.5057 3.961-1.5057 4.314 0 7.429 3.5685 7.429 9.1871.002 5.8415-4.012 9.5597-8.738 9.5597zm-.676-14.08c-1.161 0-1.979.4075-2.712 1.025-.136.1146-.214.2802-.214.4584v6.8124c0 .5793.113.7799.302.8818.632.3438 1.428.538 2.36.538 2.476 0 3.901-1.9737 3.901-4.896.003-3.037-1.274-4.8196-3.637-4.8196zm11.826 4.7814c0 5.9974 4.015 9.3368 9.266 9.3368 5.216 0 9.454-3.5272 9.454-9.4514 0-5.9211-3.977-9.3368-9.228-9.3368-5.288 0-9.492 3.4539-9.492 9.4514zm5.742-.0383c0-3.0369 1.237-4.9723 3.599-4.9723 2.363 0 3.638 1.9737 3.641 4.9342 0 3.0369-1.237 4.9342-3.599 4.9342-2.367 0-3.641-1.8973-3.641-4.8961zm23.374 9.3751c-4.317 0-6.639-1.7828-6.416-6.4145l.243-6.198c.012-.2961-.195-.5571-.488-.608l-1.617-.2802c-.29-.0509-.497-.3056-.488-.6016l.085-2.7886c.006-.2484.17-.468.403-.5444l1.84-.6112c.237-.0796.4-.2992.403-.5507l.057-3.0211c.006-.3246.267-.5825.585-.5825h4.424c.326 0 .588.2674.584.5985l-.024 3.0178c-.004.3311.261.5985.585.5985h3.158c.331 0 .595.2737.586.608l-.086 3.4062c-.008.3215-.266.5794-.584.5794h-3.512c-.317 0-.576.2546-.585.5761l-.17 5.7651c-.075 1.6331.866 2.3143 2.291 2.3143.522 0 1.082-.1019 1.655-.2611.337-.0923.683.1338.733.4839l.497 3.3648c.044.2961-.138.5794-.422.659-1.142.3184-2.196.4903-3.737.4903zm-113.321-5.0743c.123 1.4388.4562 2.6581 1.1991 3.5176.3332.3884.072.99-.4345.9868h-1.3966-1.7119-12.912c-.3243 0-.5849-.2642-.5849-.5921v-22.5381c0-.328.2606-.5922.5849-.5922h4.7918c.3243 0 .5849.2642.5849.5922v17.4893c0 .3279.2612.5921.5855.5921h6.9434.0032 1.7623c.0114 0 .0203.0055.0299.011.0083.0049.0166.0098.0268.0113.0751.0127.1414.0382.2045.0796.1695.0923.3052.2356.3236.4425z"
+       fill="#223340"
+       id="path3"
+       style="fill:#ffffff;fill-opacity:1" />
+  </g>
+</svg>
diff --git a/public/logos/dark-mac-stadium.svg b/public/logos/dark-mac-stadium.svg
new file mode 100644
index 00000000..8353b20b
--- /dev/null
+++ b/public/logos/dark-mac-stadium.svg
@@ -0,0 +1,95 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   fill="none"
+   height="69"
+   viewBox="0 0 175 69"
+   width="175"
+   version="1.1"
+   id="svg13"
+   sodipodi:docname="dark-mac-stadium.svg"
+   inkscape:version="1.3 (0e150ed, 2023-07-21)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs13" />
+  <sodipodi:namedview
+     id="namedview13"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:zoom="3.4202899"
+     inkscape:cx="87.565678"
+     inkscape:cy="34.5"
+     inkscape:window-width="1312"
+     inkscape:window-height="449"
+     inkscape:window-x="0"
+     inkscape:window-y="37"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg13" />
+  <clipPath
+     id="a">
+    <path
+       d="m0 0h175v69h-175z"
+       id="path1" />
+  </clipPath>
+  <g
+     clip-path="url(#a)"
+     id="g13">
+    <path
+       d="m128.325 22.4282v16.814l.114 3.588h-2.258l-.114-2.4149h-.056c-.776 1.5531-2.452 2.7376-4.699 2.7376-3.33 0-5.907-2.8528-5.907-7.073-.023-4.6238 2.828-7.4749 6.18-7.4749 2.11 0 3.536 1.0114 4.163 2.1273h.057v-8.3041zm-2.509 12.1567c0-.3227-.023-.7474-.114-1.0587-.365-1.6093-1.733-2.932-3.626-2.932-2.6 0-4.128 2.2997-4.128 5.382 0 2.8175 1.369 5.1532 4.082 5.1532 1.688 0 3.216-1.1282 3.672-3.0137.091-.3456.114-.6903.114-1.0931zm-42.3639 6.4742c-1.7104 0-3.3302-.5752-4.448-1.2655l-.6498 2.0701c1.0262.6903 3.0568 1.2426 4.9035 1.2426 4.5386 0 6.7283-2.5881 6.7283-5.578 0-2.8405-1.6533-4.4278-4.9036-5.6932-2.6566-1.0351-3.8201-1.9206-3.8201-3.7375 0-1.3103 1.0034-2.8985 3.6267-2.8985 1.2743-.005 2.5292.3117 3.6486.9208l.6842-2.0473c-.8548-.4836-2.2803-.9436-4.2422-.9436-3.7287 0-6.2147 2.2548-6.2147 5.2676 0 2.7376 1.939 4.3706 5.0741 5.4971 2.6003 1.0008 3.6266 2.0358 3.6266 3.8527 0 1.9558-1.4827 3.3127-4.0136 3.3127zm-43.2197-13.6052c0 2.8528.08 5.6361.1715 7.97l.3306 7.43h4.2194l-1.0263-19.3793h-5.702l-2.0296 6.4407c-.6613 2.1511-1.3112 4.7154-1.8248 6.9578h-.1143c-.4382-2.3341-.9784-4.648-1.619-6.9349l-1.8819-6.4636h-5.7926l-1.2311 19.3793h4.0136l.3649-7.3605.3192-8.0281h.0572c.4755 2.545 1.0534 5.0698 1.7324 7.5681l2.0534 7.4987h3.398l2.3383-7.5681c.7404-2.2777 1.5389-5.0372 2.166-7.5101zm19.7284 15.3886c-.1715-.7712-.2286-2.071-.2286-3.3936h.0114v-4.9106c0-3.3118-1.4475-6.0722-6.1004-6.0722-2.5432 0-4.4471.7123-5.4171 1.2655l.7985 2.7832c.9128-.5522 2.4289-1.0359 3.8544-1.0359 2.1326 0 2.5318 1.0702 2.5318 1.8177v.1724c-4.9378 0-8.1872 1.7254-8.1872 5.3819 0 2.2425 1.6753 4.3134 4.5034 4.3134 1.6533 0 3.0797-.5979 3.9916-1.7253h.0915l.2506 1.4035zm-8.4616-4.4401c0-1.6559 1.7676-2.2073 4.0479-2.2073h.0114v1.5179c0 .2638-.0334.517-.0905.7474-.2973.897-1.2092 1.6093-2.2583 1.6093-.9691 0-1.7105-.5399-1.7105-1.6673zm22.1459 4.0602c-.7756.3685-2.224.6674-3.8773.6674-4.5042 0-7.3895-2.7832-7.3895-7.1881 0-4.0831 2.7938-7.4529 7.9823-7.4529 1.1405 0 2.3954.2075 3.3065.5522l-.6833 3.2432c-.5136-.2304-1.2778-.437-2.4184-.437-2.2802 0-3.762 1.6445-3.74 3.9107 0 2.5871 1.7113 3.9326 3.821 3.9326 1.0262 0 1.8238-.1723 2.4851-.4599zm22.6128-16.8598v3.3118h3.5924v1.932h-3.5924v7.4986c0 1.7254.4793 2.7033 1.8819 2.7033.6613 0 1.1406-.0923 1.4598-.1732l.1135 1.8977c-.4784.2075-1.2541.3456-2.2231.3456-1.1635 0-2.1097-.3685-2.7139-1.0588-.707-.7475-.9699-1.9777-.9699-3.6231v-7.5892h-2.144v-1.9329h2.144v-2.5643zm13.8441 15.4914.205 1.7483v-.0114h2.281c-.171-.9436-.228-2.1282-.228-3.3356v-5.1981c0-2.7947-1.027-5.6932-5.246-5.6932-1.745 0-3.398.4951-4.538 1.2426l.569 1.6673c.97-.6332 2.316-1.0351 3.593-1.0351 2.816 0 3.136 2.0701 3.136 3.2204v.2876c-5.337-.0229-8.302 1.8168-8.302 5.1752 0 2.0244 1.426 4.0021 4.219 4.0021 1.962 0 3.444-.9778 4.22-2.0701zm-5.998-2.231c0-2.6909 3.102-3.186 5.838-3.128v2.4148c0 .2533-.046.5523-.137.8055-.387 1.1723-1.527 2.3225-3.329 2.3225-1.289 0-2.372-.7826-2.372-2.4148zm29.58-12.294c1.004 0 1.619-.6903 1.597-1.553 0-.897-.593-1.5873-1.528-1.5873-.209-.0049-.417.0329-.611.1112-.194.0782-.371.1951-.518.3437s-.263.3256-.339.5203c-.077.1947-.113.403-.106.6121 0 .8618.616 1.553 1.505 1.553zm-1.197 2.3568v13.9165h2.508v-13.9165zm18.223 10.121c0 1.4378.023 2.7024.114 3.7955h-2.223l-.138-2.2777h-.057c-.661 1.1274-2.11 2.5881-4.561 2.5881-2.167 0-4.767-1.2074-4.767-6.096v-8.1423h2.509v7.7053c0 2.6452.798 4.4277 3.079 4.4277 1.688 0 2.851-1.1731 3.307-2.2996.137-.3685.228-.8284.228-1.2883v-8.5337h2.509zm4.048-10.1324c.092 1.1502.114 2.3348.114 3.7726v10.1553h2.452v-8.3965c0-.4371.069-.8741.205-1.2426.388-1.2646 1.528-2.53 3.103-2.53 1.903 0 2.873 1.6102 2.873 3.8183v8.3385h2.451v-8.6032c.003-.4296.073-.8561.206-1.2645.434-1.2426 1.539-2.3005 2.965-2.3005 2.019 0 2.988 1.6101 2.988 4.2782v7.8785h2.463v-8.188c0-4.8306-2.714-6.038-4.539-6.038-1.322 0-2.235.3448-3.056.9779-.633.4932-1.157 1.1117-1.539 1.8169h-.058c-.592-1.6331-2.018-2.7833-3.9-2.7833-2.28 0-3.558 1.2311-4.332 2.5529h-.092l-.114-2.2425z"
+       fill="#000"
+       id="path2"
+       style="fill:#ffffff;fill-opacity:1" />
+    <path
+       d="m35.8416.070343h-3.3065v16.676857h3.3065zm.1143 51.156257h-3.3065v16.676h3.3065zm-8.5829-1.3789 3.1386 1.0527-5.2219 15.823-3.1377-1.0536zm-1.94-.9849-2.676-1.9602-9.7138 13.4944 2.676 1.9593zm-6.0282-6.1751 1.9241 2.712-13.44774 9.7033-1.92412-2.7129zm-.9331-1.9136-1.0245-3.1711-15.72182 5.1665 1.02449 3.1711zm-1.3305-8.5249v3.3356h-16.535295v-3.3356zm.2506-2.0032 1.0201-3.1729-15.72974-5.1436-1.0201 3.1729zm3.8808-7.7669-1.9558 2.6892-13.33426-9.8624 1.95578-2.6892zm4.0558-21.28313-3.143 1.03769 5.1454 15.84674 3.1429-1.0377zm-12.2359 6.24108 2.6654-1.97424 9.7877 13.44159-2.6663 1.9734z"
+       fill="#fe9000"
+       id="path3" />
+    <g
+       fill="#686868"
+       id="g12"
+       style="fill:#ffffff;fill-opacity:1">
+      <path
+         d="m92.6603 17.5879h1.3771v-4.2738c.3166.0791.6965.0949 1.1081.0949 1.3454 0 2.5326-.3957 3.2608-1.1713.5382-.554.8231-1.3138.8231-2.27941 0-.94975-.3483-1.72538-.9339-2.23191-.6332-.56985-1.6304-.88643-2.9917-.88643-1.1081 0-1.9787.09497-2.6435.20578zm1.3771-9.54494c.2375-.06332.6965-.1108 1.298-.1108 1.5196 0 2.5169.68065 2.5169 2.08944 0 1.4721-1.0131 2.2794-2.6752 2.2794-.459 0-.8389-.0317-1.1397-.1108z"
+         id="path4"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m104.435 9.75251c-2.122 0-3.799 1.50379-3.799 4.06809 0 2.4219 1.598 3.9415 3.672 3.9415 1.852 0 3.815-1.2347 3.815-4.0681 0-2.3427-1.488-3.94149-3.688-3.94149zm-.032 1.04469c1.646 0 2.295 1.6463 2.295 2.9443 0 1.7253-.997 2.9758-2.327 2.9758-1.361 0-2.327-1.2663-2.327-2.9442 0-1.4563.713-2.9759 2.359-2.9759z"
+         id="path5"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m109.452 9.92663 2.311 7.66127h1.267l1.234-3.6407c.269-.8231.507-1.6145.697-2.5326h.032c.189.9022.411 1.662.68 2.5168l1.172 3.6565h1.266l2.469-7.66127h-1.377l-1.092 3.84647c-.253.9023-.459 1.7096-.586 2.4852h-.047c-.174-.7756-.396-1.5829-.681-2.501l-1.187-3.83067h-1.172l-1.25 3.89397c-.253.8389-.507 1.6621-.681 2.4377h-.047c-.143-.7915-.348-1.5829-.57-2.4377l-1.013-3.89397z"
+         id="path6"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m128.535 14.0106c.016-.1425.048-.3641.048-.649 0-1.4088-.665-3.60909-3.166-3.60909-2.232 0-3.593 1.82039-3.593 4.13139 0 2.3111 1.409 3.8782 3.767 3.8782 1.219 0 2.058-.2691 2.549-.4907l-.238-.9973c-.522.2216-1.124.3957-2.121.3957-1.393 0-2.596-.7756-2.628-2.6592zm-5.366-.9973c.111-.9656.728-2.2636 2.137-2.2636 1.567 0 1.947 1.3772 1.931 2.2636z"
+         id="path7"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m130.862 17.5879h1.377v-4.0839c0-.2374.032-.459.063-.649.19-1.0447.887-1.7887 1.868-1.7887.19 0 .333.0159.475.0475v-1.3138c-.127-.03166-.237-.04749-.396-.04749-.934 0-1.773.64899-2.121 1.67789h-.063l-.048-1.50377h-1.218c.047.71227.063 1.48797.063 2.39017z"
+         id="path8"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m142.597 14.0106c.016-.1425.048-.3641.048-.649 0-1.4088-.665-3.60909-3.166-3.60909-2.232 0-3.593 1.82039-3.593 4.13139 0 2.3111 1.409 3.8782 3.767 3.8782 1.219 0 2.058-.2691 2.549-.4907l-.238-.9973c-.522.2216-1.124.3957-2.121.3957-1.393 0-2.596-.7756-2.628-2.6592zm-5.366-.9973c.111-.9656.728-2.2636 2.137-2.2636 1.567 0 1.947 1.3772 1.931 2.2636z"
+         id="path9"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m150.147 6.34924v4.57466h-.031c-.348-.6174-1.14-1.17139-2.311-1.17139-1.868 0-3.451 1.56709-3.435 4.11559 0 2.3269 1.424 3.894 3.276 3.894 1.251 0 2.185-.649 2.612-1.5038h.032l.063 1.3296h1.251c-.048-.5223-.064-1.298-.064-1.9786v-9.26006zm0 8.02536c0 .2216-.015.4116-.063.6015-.253 1.0448-1.108 1.6621-2.042 1.6621-1.504 0-2.263-1.2822-2.263-2.8334 0-1.6937.854-2.9601 2.295-2.9601 1.045 0 1.804.7282 2.01 1.6146.048.1741.063.4116.063.5857z"
+         id="path10"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m158.369 17.5563c.459.0633 1.187.1266 2.137.1266 1.741 0 2.944-.3166 3.688-.9972.538-.5224.902-1.2189.902-2.137 0-1.5829-1.187-2.4218-2.2-2.6751v-.0316c1.124-.4116 1.804-1.3139 1.804-2.34276 0-.83894-.332-1.47211-.886-1.88367-.665-.53819-1.551-.77562-2.929-.77562-.965 0-1.915.09497-2.516.22161zm1.377-9.56083c.221-.04748.585-.09497 1.219-.09497 1.393 0 2.342.4907 2.342 1.74121 0 1.02889-.855 1.78869-2.311 1.78869h-1.25zm0 4.47963h1.139c1.504 0 2.755.6015 2.755 2.0578 0 1.5513-1.314 2.0736-2.739 2.0736-.49 0-.886-.0158-1.155-.0633z"
+         id="path11"
+         style="fill:#ffffff;fill-opacity:1" />
+      <path
+         d="m166.503 9.92663 2.834 7.05977c.063.1742.095.285.095.3641s-.048.1899-.111.3324c-.317.7123-.792 1.2505-1.172 1.5513-.411.3482-.87.5698-1.218.6806l.348 1.1714c.348-.0633 1.029-.3008 1.709-.9023.95-.8231 1.631-2.1686 2.628-4.7962l2.089-5.46107h-1.472l-1.519 4.49547c-.19.554-.349 1.1397-.491 1.5988h-.032c-.126-.4591-.316-1.0606-.49-1.5671l-1.678-4.52717z"
+         id="path12"
+         style="fill:#ffffff;fill-opacity:1" />
+    </g>
+  </g>
+</svg>
diff --git a/public/logos/dark-redfin-solutions.svg b/public/logos/dark-redfin-solutions.svg
new file mode 100644
index 00000000..03ce5c75
--- /dev/null
+++ b/public/logos/dark-redfin-solutions.svg
@@ -0,0 +1,79 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   fill="none"
+   height="62"
+   viewBox="0 0 61 62"
+   width="61"
+   version="1.1"
+   id="svg6"
+   sodipodi:docname="dark-redfin-solutions.svg"
+   inkscape:version="1.3 (0e150ed, 2023-07-21)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs6" />
+  <sodipodi:namedview
+     id="namedview6"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:zoom="3.8064516"
+     inkscape:cx="30.605932"
+     inkscape:cy="31"
+     inkscape:window-width="1312"
+     inkscape:window-height="449"
+     inkscape:window-x="0"
+     inkscape:window-y="37"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg6" />
+  <linearGradient
+     id="a"
+     gradientUnits="userSpaceOnUse"
+     x1="24.2079"
+     x2="45.4204"
+     y1="3.81333"
+     y2="19.3385">
+    <stop
+       offset="0"
+       stop-color="#e15e29"
+       id="stop1" />
+    <stop
+       offset="1"
+       stop-color="#a51f25"
+       id="stop2" />
+  </linearGradient>
+  <clipPath
+     id="b">
+    <path
+       d="m0 0h61v62h-61z"
+       id="path2" />
+  </clipPath>
+  <g
+     clip-path="url(#b)"
+     id="g6">
+    <path
+       d="m16.7474.15477s12.5249-1.34682 21.0095 3.90559c8.4846 5.25242 6.7338 12.39024 6.7338 12.39024s-.9861 5.7439-6.7338 3.7708c-4.5116-1.5487-2.5587-6.8683-2.5587-6.8683s-5.4187.6806-7.2725 4.983c-1.7846 4.1412-1.8856 9.562 3.6361 14.545 0 0-13.4676-2.8282-13.0636-16.0266 0 0 .3631-6.1495 4.9956-9.37103 0 0-2.4801.3137-4.4567 2.53063 0 0-.0761-6.80692-2.2897-9.85933z"
+       fill="url(#a)"
+       id="path3" />
+    <g
+       clip-rule="evenodd"
+       fill-rule="evenodd"
+       id="g5">
+      <path
+         d="m1.04193 50.2323h2.39157v-4.0314h1.52023l2.3575 4.0314h2.73317l-2.64782-4.3902c1.34953-.5294 2.27199-1.6398 2.27199-3.3993 0-2.7161-1.94747-3.8265-4.32184-3.8265h-4.3048zm2.39157-6.047v-3.4679h1.84491c1.14444 0 1.93027.4271 1.93027 1.7254 0 1.2812-.7516 1.7425-1.93027 1.7425zm8.8981 6.047h7.9262v-2.1011h-5.5346v-2.6989h4.6634v-2.0499h-4.6634v-2.665h5.2954v-2.1011h-7.687zm10.649 0h3.5702c3.5873 0 6.1155-2.3744 6.1155-5.808 0-3.4335-2.5452-5.808-6.1155-5.808h-3.5702zm2.3916-2.1011v-7.4138h1.059c2.5795 0 3.7582 1.5375 3.7582 3.7069 0 2.1696-1.1787 3.7069-3.7582 3.7069zm9.8291 2.1011h2.3915v-4.3559h4.6293v-2.1354h-4.6293v-3.0236h5.0906v-2.1011h-7.4821zm9.9487 0h2.3915v-11.616h-2.3915zm14.7709.1025h.2392v-11.7185h-2.2378v4.8685c0 .8029.1537 2.1183.1537 2.1183s-.8029-1.0592-1.3666-1.5887l-5.8592-5.5005h-.2392v11.7184h2.2379v-4.8683c0-.8372-.1709-2.1184-.1709-2.1184s.8029 1.0421 1.3836 1.5887z"
+         fill="#b90e31"
+         id="path4" />
+      <path
+         d="m3.09528 61.8712c1.28408 0 2.22071-.7158 2.22071-1.8945 0-1.0735-.61035-1.6629-1.79969-2.1891l-.56831-.2631c-.79985-.3683-1.13663-.6526-1.13663-1.2839 0-.6105.43153-1.0209 1.13663-1.0209.67357 0 1.05239.3368 1.32612.7787l.61035-.3788c-.37882-.6316-.97882-1.0735-1.93647-1.0735-1.07358 0-1.88393.6841-1.88393 1.7155 0 .9998.55781 1.4944 1.57867 1.9575l.56832.2632c.89459.3999 1.34714.7682 1.34714 1.4944 0 .7579-.65255 1.2209-1.48393 1.2209-1.01035 0-1.50494-.5158-1.84173-1.1156l-.63153.3368c.378823.7578 1.12612 1.4524 2.49428 1.4524zm7.50402 0c2.0417 0 3.6836-1.5051 3.6836-3.6626s-1.6419-3.6625-3.6836-3.6625c-2.03122 0-3.67311 1.505-3.67311 3.6625s1.64189 3.6626 3.67311 3.6626zm0-.6841c-1.66291 0-2.88377-1.2736-2.88377-2.9785 0-1.705 1.22086-2.9784 2.88377-2.9784 1.6734 0 2.8943 1.2734 2.8943 2.9784 0 1.7049-1.2209 2.9785-2.8943 2.9785zm5.7569.5998h4.1361v-.6735h-3.3783v-6.4832h-.7578zm8.4722.0843c1.4524 0 2.568-.8526 2.568-2.526v-4.715h-.7578v4.6625c0 1.2734-.7051 1.9049-1.8102 1.9049-1.1157 0-1.8102-.6315-1.8102-1.9049v-4.6625h-.7578v4.715c0 1.6734 1.1051 2.526 2.568 2.526zm6.5567-.0843h.7576v-6.4831h2.1997v-.6736h-5.157v.6736h2.1997zm4.8413 0h.7683v-7.1567h-.7683zm6.5462.0843c2.0417 0 3.6836-1.5051 3.6836-3.6626s-1.6419-3.6625-3.6836-3.6625c-2.0313 0-3.6731 1.505-3.6731 3.6625s1.6418 3.6626 3.6731 3.6626zm0-.6841c-1.6629 0-2.8838-1.2736-2.8838-2.9785 0-1.705 1.2209-2.9784 2.8838-2.9784 1.6734 0 2.8942 1.2734 2.8942 2.9784 0 1.7049-1.2208 2.9785-2.8942 2.9785zm11.1769.6736h.1263v-7.2305h-.7051v4.8308c0 .3052.0526.7893.0526.8105-.0316-.0422-.3051-.4315-.4946-.6631l-4.273-5.0517h-.1263v7.2302h.7157v-4.8307c0-.2842-.0631-.7473-.0631-.7999.0315.0526.3051.4316.4946.6526zm4.4308.0105c1.2841 0 2.2207-.7158 2.2207-1.8945 0-1.0735-.6104-1.6629-1.7997-2.1891l-.5683-.2631c-.7998-.3683-1.1366-.6526-1.1366-1.2839 0-.6105.4315-1.0209 1.1366-1.0209.6736 0 1.0524.3368 1.3261.7787l.6104-.3788c-.3789-.6316-.9789-1.0735-1.9365-1.0735-1.0736 0-1.8839.6841-1.8839 1.7155 0 .9998.5578 1.4944 1.5786 1.9575l.5683.2632c.8946.3999 1.3472.7682 1.3472 1.4944 0 .7579-.6526 1.2209-1.4839 1.2209-1.0104 0-1.505-.5158-1.8418-1.1156l-.6315.3368c.3788.7578 1.1261 1.4524 2.4943 1.4524z"
+         fill="#64666c"
+         id="path5"
+         style="fill:#ffffff;fill-opacity:1" />
+    </g>
+  </g>
+</svg>
diff --git a/public/logos/dark-tag1.svg b/public/logos/dark-tag1.svg
new file mode 100644
index 00000000..f08304f0
--- /dev/null
+++ b/public/logos/dark-tag1.svg
@@ -0,0 +1,51 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   viewBox="0 0 159 65"
+   version="1.1"
+   id="svg3"
+   sodipodi:docname="dark-tag1.svg"
+   inkscape:version="1.3 (0e150ed, 2023-07-21)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs3" />
+  <sodipodi:namedview
+     id="namedview3"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:zoom="3.6307692"
+     inkscape:cx="79.459746"
+     inkscape:cy="32.5"
+     inkscape:window-width="1312"
+     inkscape:window-height="449"
+     inkscape:window-x="0"
+     inkscape:window-y="37"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="svg3" />
+  <g
+     fill="none"
+     fill-rule="evenodd"
+     id="g3">
+    <path
+       fill="#000"
+       d="M34 52V0h6.4v13H49v6.3h-8.6V52M50 35.3c0-3.5.8-5 2.3-7 1.7-2.5 4.2-3.7 7.6-3.7h15.8V22c0-.7-.2-1.3-.7-1.8-.4-.5-1-.8-1.6-.8H53V13h20c5 0 8 2.4 9 7l.2 2v20.4c0 1.7-.5 3.4-1.4 5-2 3.2-4.7 4.8-8 4.8h-13c-1.8 0-3.6-.6-5.5-2-1.8-1.3-3-2.8-3.7-4.7-.4-1-.6-2.3-.6-3.6v-6.7zm8 10c.8.3 2 .5 3.7.5h8.8c3.5 0 5.3-1.2 5.3-3.8v-7c0-2.3-1.5-3.7-4.5-4H61c-3 .4-4.6 1.7-4.6 4v7c0 1.6.6 2.7 1.7 3.3zM86 64.3V58h21c3 0 4.7-1.7 4.7-4.7v-1H96.3c-3 0-5.3-1-7.2-3.2-1.8-2-2.7-4.4-2.7-7.3V23c0-4.7 2-7.7 5.8-9.3 1.3-.5 2.4-.7 3.4-.7H109c5.3 0 8.3 2.5 9 7.6v34.2c0 3-1 5.5-3 7.2-2 1.5-4.7 2.3-8 2.3H86zm6.7-22.5c.4 2.7 1.8 4 4 4h11.6c1 0 2-.3 2.5-1 .6-.7 1-1.7 1-3V24c0-3-1.2-4.4-3.5-4.4h-12c-2.4.4-3.6 2-3.6 4.3v18zM126 0h4v30h-4z"
+       id="path1"
+       style="fill:#ffffff;fill-opacity:1" />
+    <path
+       fill="#000"
+       d="M122 0h8v4h-8"
+       id="path2"
+       style="fill:#000000;fill-opacity:0" />
+    <path
+       fill="#2D70C0"
+       d="M0 26L17 0h6L6 26l17 26h-6M159 26L142 0h-6l17 26-17 26h6"
+       id="path3" />
+  </g>
+</svg>
diff --git a/src/components/FeaturedSponsors.astro b/src/components/FeaturedSponsors.astro
index 1ee9ccd1..6059a125 100644
--- a/src/components/FeaturedSponsors.astro
+++ b/src/components/FeaturedSponsors.astro
@@ -8,14 +8,13 @@ import featuredSponsors from "../featured-sponsors.json"
  */
 const nudges = {
   "Platform.sh": "mt-12 h-11 dark:invert",
-  Tag1: "h-9 dark:bg-white",
+  Tag1: "h-9",
   "Oliver Wand": "h-12 w-12",
   DrupalEasy: "h-10 dark:invert",
   b13: "dark:invert",
-  "i-gelb": "dark:bg-white",
   "Redfin Solutions": "h-16 w-16",
-  MacStadium: "h-15 dark:bg-white",
-  Lullabot: "h-9 dark:bg-white",
+  MacStadium: "h-15",
+  Lullabot: "h-9",
   "Craft CMS": "h-11",
   undpaul: "h-9 dark:invert",
   "1xINTERNET": "h-11",
@@ -44,11 +43,16 @@ featuredSponsors.map((sponsor) => {
           href={sponsor.url}
           target="_blank"
         >
+        <picture>
+          <source 
+            srcset={sponsor.darklogo} 
+            media="(prefers-color-scheme: dark)">
           <img
-            src={sponsor.logo}
-            class="block w-auto h-full"
-            alt={`${sponsor.name} logo`}
+              src={sponsor.logo}
+              class="block w-auto h-full"
+              alt={`${sponsor.name} logo`}
           />
+        </picture>
         </a>
       ))
     }
diff --git a/src/featured-sponsors.json b/src/featured-sponsors.json
index 340c5b05..5d032b3d 100644
--- a/src/featured-sponsors.json
+++ b/src/featured-sponsors.json
@@ -3,6 +3,7 @@
     "name": "Platform.sh",
     "type": "major",
     "logo": "/logos/platform.sh.svg",
+    "darklogo": "/logos/platform.sh.svg",
     "squareLogo": "/logos/platform.sh-square.svg",
     "url": "https://platform.sh"
   },
@@ -10,6 +11,7 @@
     "name": "Tag1",
     "type": "major",
     "logo": "/logos/tag1.svg",
+    "darklogo": "/logos/dark-tag1.svg",
     "squareLogo": "/logos/tag1-square.svg",
     "url": "https://tag1.com"
   },
@@ -17,6 +19,7 @@
     "name": "1xINTERNET",
     "type": "major",
     "logo": "/logos/1xinternet.svg",
+    "darklogo": "/logos/1xinternet.svg",
     "squareLogo": "/logos/1xinternet-square.svg",
     "url": "https://1xinternet.de",
     "github": "1xINTERNET"
@@ -25,6 +28,7 @@
     "name": "i-gelb",
     "type": "major",
     "logo": "/logos/i-gelb.svg",
+    "darklogo": "/logos/dark-i-gelb.svg",
     "squareLogo": "/logos/i-gelb-square.svg",
     "url": "https://i-gelb.net",
     "github": "i-gelb"
@@ -33,6 +37,7 @@
     "name": "Agaric",
     "type": "standard",
     "logo": "/logos/agaric.svg",
+    "darklogo": "/logos/agaric.svg",
     "squareLogo": "/logos/agaric-square.svg",
     "url": "https://agaric.coop/",
     "github": "agaric"
@@ -41,6 +46,7 @@
     "name": "b13",
     "type": "standard",
     "logo": "/logos/b13.svg",
+    "darklogo": "/logos/b13.svg",
     "squareLogo": "/logos/b13.svg",
     "url": "https://b13.com/",
     "github": "b13"
@@ -49,6 +55,7 @@
     "name": "Gizra",
     "type": "standard",
     "logo": "/logos/gizra.svg",
+    "darklogo": "/logos/gizra.svg",
     "squareLogo": "/logos/gizra.svg",
     "url": "https://gizra.com/",
     "github": "gizra"
@@ -57,6 +64,7 @@
     "name": "Oliver Wand",
     "type": "standard",
     "logo": "/logos/oliver-wand.jpg",
+    "darklogo": "/logos/oliver-wand.jpg",
     "squareLogo": "/logos/oliver-wand.jpg",
     "url": "https://github.com/wandoliver",
     "github": "wandoliver"
@@ -65,6 +73,7 @@
     "name": "Centarro",
     "type": "standard",
     "logo": "/logos/centarro.svg",
+    "darklogo": "/logos/centarro.svg",
     "squareLogo": "/logos/centarro-square.svg",
     "url": "https://www.centarro.io/",
     "github": "centarro"
@@ -73,6 +82,7 @@
     "name": "DrupalEasy",
     "type": "standard",
     "logo": "/logos/drupaleasy.png",
+    "darklogo": "/logos/drupaleasy.png",
     "squareLogo": "/logos/drupaleasy-square.svg",
     "url": "https://www.drupaleasy.com/"
   },
@@ -80,6 +90,7 @@
     "name": "Redfin Solutions",
     "type": "standard",
     "logo": "/logos/redfin-solutions.svg",
+    "darklogo": "/logos/dark-redfin-solutions.svg",
     "squareLogo": "/logos/redfin-solutions-square.svg",
     "url": "https://redfinsolutions.com/",
     "github": "redfinsolutions"
@@ -88,6 +99,7 @@
     "name": "MacStadium",
     "type": "standard",
     "logo": "/logos/mac-stadium.svg",
+    "darklogo": "/logos/dark-mac-stadium.svg",
     "squareLogo": "/logos/mac-stadium-square.svg",
     "url": "https://www.macstadium.com"
   },
@@ -95,6 +107,7 @@
     "name": "Lullabot",
     "type": "standard",
     "logo": "/logos/lullabot.svg",
+    "darklogo": "/logos/dark-lullabot.svg",
     "squareLogo": "/logos/lullabot-square.svg",
     "url": "https://www.lullabot.com",
     "github": "Lullabot"
@@ -103,6 +116,7 @@
     "name": "Craft CMS",
     "type": "standard",
     "logo": "/logos/craft-cms.svg",
+    "darklogo": "/logos/craft-cms.svg",
     "squareLogo": "/logos/craft-cms-square.svg",
     "url": "https://craftcms.com/",
     "github": "craftcms"
@@ -111,6 +125,7 @@
     "name": "undpaul",
     "type": "standard",
     "logo": "/logos/undpaul.svg",
+    "darklogo": "/logos/undpaul.svg",
     "squareLogo": "/logos/undpaul-square.svg",
     "url": "https://undpaul.de",
     "github": "undpaul"

From 8e5fba4fbdf20608dc4c1ed9633ff0125467ea08 Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sun, 24 Sep 2023 12:56:52 -0600
Subject: [PATCH 14/15] Fixes about page stats and paging border.

---
 src/components/BlogPostFooter.astro | 2 +-
 src/pages/about.astro               | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/BlogPostFooter.astro b/src/components/BlogPostFooter.astro
index 9e716ec7..fee67238 100644
--- a/src/components/BlogPostFooter.astro
+++ b/src/components/BlogPostFooter.astro
@@ -34,7 +34,7 @@ orderedPosts.forEach((post, index) => {
       <a
         href={`/blog/${prev.slug}`}
         rel="prefetch"
-        class="flex border items-center rounded-md w-full my-1 md:my-0 content-center justify-start md:justify-start p-4 hover:border-blue-300 hover:shadow-sm"
+        class="flex border items-center rounded-md w-full my-1 md:my-0 content-center justify-start md:justify-start p-4 hover:border-blue-300 hover:shadow-sm dark:border-slate-700"
         title={`Previous: ${prev.data.title}`}
       >
         <div>
diff --git a/src/pages/about.astro b/src/pages/about.astro
index 9dfcd128..58653995 100644
--- a/src/pages/about.astro
+++ b/src/pages/about.astro
@@ -68,7 +68,7 @@ const releaseData = await getReleases()
         </PostBody>
       </div>
       <div class="mt-16 lg:mt-0 lg:w-1/3 lg:pl-16">
-        <ul class="flex flex-wrap lg:block">
+        <ul class="flex flex-wrap lg:block dark:text-white">
           <li class="mb-4 p-6 lg:p-0">
             <span class="text-5xl font-thin"
               >{parseInt(5000).toLocaleString("en-US")}+</span

From b745198a165c561bf70849905d198fc73d4a6430 Mon Sep 17 00:00:00 2001
From: Bernardo Martinez <israelm28@gmail.com>
Date: Sun, 24 Sep 2023 13:07:33 -0600
Subject: [PATCH 15/15] Fixes The Getting Started tab panels

---
 src/components/Heading.astro | 2 +-
 src/components/Tabs.astro    | 9 +--------
 2 files changed, 2 insertions(+), 9 deletions(-)

diff --git a/src/components/Heading.astro b/src/components/Heading.astro
index b3ad02ba..a91e1b6d 100644
--- a/src/components/Heading.astro
+++ b/src/components/Heading.astro
@@ -42,7 +42,7 @@ const { title, subtitle, date, author, authorUrl, authorAvatar, readTime } =
           )}
           {author && (
             <div class={authorAvatar ? `ml-1 dark:text-white` : ``}>
-              <a href={authorUrl}>{author}</a>
+              <a class="dark:text-white" href={authorUrl}>{author}</a>
             </div>
           )}
         </div>
diff --git a/src/components/Tabs.astro b/src/components/Tabs.astro
index 127015a3..48275202 100644
--- a/src/components/Tabs.astro
+++ b/src/components/Tabs.astro
@@ -49,7 +49,7 @@ order.map((label) => {
       @apply text-black dark:text-gray-300;
 
       span {
-        @apply border-solid border-black dark:text-gray-300;
+        @apply border-solid border-black dark:border-gray-300;
       }
     }
   }
@@ -61,13 +61,6 @@ order.map((label) => {
       @apply block;
     }
   }
-  @media (prefers-color-scheme: dark) {
-    .panel.active {
-      @apply dark:bg-slate-600;
-      box-shadow: none;
-    }
-
-  }
 
 </style>