From 35c35edc8b3f575d22f3b45beb33c7516333ae4f Mon Sep 17 00:00:00 2001
From: Jen Breese-Kauth <jbreese@stanford.edu>
Date: Thu, 11 Apr 2024 22:20:25 +0000
Subject: [PATCH] change logo based on width

---
 .../elements/lockup/lockup-logo.tsx           | 24 +++++++++----------
 1 file changed, 11 insertions(+), 13 deletions(-)

diff --git a/src/components/elements/lockup/lockup-logo.tsx b/src/components/elements/lockup/lockup-logo.tsx
index 634d77be..82bea3c5 100644
--- a/src/components/elements/lockup/lockup-logo.tsx
+++ b/src/components/elements/lockup/lockup-logo.tsx
@@ -1,23 +1,21 @@
 import {Maybe} from "@lib/gql/__generated__/drupal.d";
 import PressFooterLogoLg from "@components/images/logo-lg";
-// import PressFooterLogoXs from "@components/images/logo-xs";
+import PressFooterLogoXs from "@components/images/logo-xs";
 
 const LockupLogo = ({logoUrl, siteName = ""}: { logoUrl?: Maybe<string>, siteName?: Maybe<string> }) => {
 
   return (
     <>
-      {logoUrl &&
-        <picture>
-          <img
-            src={logoUrl}
-            alt={`${siteName} Logo`}
-            className="object-contain max-w-[400px] max-h-[35px] h-auto"
-          />
-        </picture>
-      }
-      {!logoUrl &&
-        <PressFooterLogoLg className="block"/>
-      }
+      <div className="hidden sm:block">
+        {!logoUrl &&
+          <PressFooterLogoLg/>
+        }
+      </div>
+      <div className="sm:hidden">
+        {!logoUrl &&
+          <PressFooterLogoXs/>
+        }
+      </div>
     </>
   )
 }