From 2a12e292351ae16ad7880d9074dad053405d5ffe Mon Sep 17 00:00:00 2001
From: Alex Gleason <alex@alexgleason.me>
Date: Sun, 15 May 2022 22:30:48 -0500
Subject: [PATCH] SiteLogo: never, under any circumstances, squish the logo

---
 app/soapbox/components/site-logo.tsx | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/app/soapbox/components/site-logo.tsx b/app/soapbox/components/site-logo.tsx
index 8a614d08c..81f9ed417 100644
--- a/app/soapbox/components/site-logo.tsx
+++ b/app/soapbox/components/site-logo.tsx
@@ -1,9 +1,15 @@
+import classNames from 'classnames';
 import React from 'react';
 
 import { useSoapboxConfig, useSettings, useSystemTheme } from 'soapbox/hooks';
 
+interface ISiteLogo extends React.ComponentProps<'img'> {
+  /** Extra class names for the <img> element. */
+  className?: string,
+}
+
 /** Display the most appropriate site logo based on the theme and configuration. */
-const SiteLogo: React.FC<React.ComponentProps<'img'>> = (props) => {
+const SiteLogo: React.FC<ISiteLogo> = ({ className, ...rest }) => {
   const { logo, logoDarkMode } = useSoapboxConfig();
   const settings = useSettings();
 
@@ -28,7 +34,11 @@ const SiteLogo: React.FC<React.ComponentProps<'img'>> = (props) => {
 
   return (
     // eslint-disable-next-line jsx-a11y/alt-text
-    <img src={getSrc()} {...props} />
+    <img
+      className={classNames('object-contain', className)}
+      src={getSrc()}
+      {...rest}
+    />
   );
 };