From afffac51c315f58fb26eb8c47e99ca654ac6afa1 Mon Sep 17 00:00:00 2001
From: Foster Irwin <foster@jfirwin.com>
Date: Wed, 21 Dec 2022 05:22:02 -0700
Subject: [PATCH] fixed logo light/dark appearance

---
 src/css/custom.css      |  4 ----
 src/pages/2.0/index.tsx | 25 ++++++++++++++++++-------
 2 files changed, 18 insertions(+), 11 deletions(-)

diff --git a/src/css/custom.css b/src/css/custom.css
index 2758c589..fb24cc70 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -118,10 +118,6 @@ html[data-theme="dark"] .header-github-link:before {
   margin: 20px 36px;
 }
 
-.responsive-color-svg {
-  fill: var(--ifm-heading-color)
-}
-
 .theme-doc-markdown {
   max-width: none;
 }
diff --git a/src/pages/2.0/index.tsx b/src/pages/2.0/index.tsx
index 0aa54cca..53dd55ac 100644
--- a/src/pages/2.0/index.tsx
+++ b/src/pages/2.0/index.tsx
@@ -7,6 +7,8 @@ import { FiTwitter } from 'react-icons/fi';
 import { ChevronRightIcon } from '@heroicons/react/20/solid';
 import FlipClockCountdown from '@leenguyen/react-flip-clock-countdown';
 import Layout from '@theme/Layout';
+import { Dark, Light } from '/src/components/ColorMode';
+
 
 const TwoPointZero = (): JSX.Element => {
   const stats = [
@@ -50,13 +52,22 @@ const TwoPointZero = (): JSX.Element => {
             <div className="mx-auto max-w-md px-4 sm:max-w-3xl sm:px-6 lg:grid lg:max-w-7xl lg:grid-cols-2 lg:gap-24 lg:px-8">
               <div>
                 <div>
-                  <img
-                    className="h-11 w-auto responsive-color-svg"
-                    it
-                    src="/design/logo/svg/Mesh_Logo_Black.svg"
-
-                    alt="Meshtastic Logo"
-                  />
+                  <Dark>
+                    <img
+                      className="h-11 w-auto"
+                      it
+                      src="/design/logo/svg/Mesh_Logo_White.svg"
+                      alt="Meshtastic Logo"
+                    />
+                  </Dark>
+                  <Light>
+                    <img
+                        className="h-11 w-auto"
+                        it
+                        src="/design/logo/svg/Mesh_Logo_Black.svg"
+                        alt="Meshtastic Logo"
+                      />
+                  </Light>
                 </div>
                 <div className="mt-20">
                   <div>