From e038e9bd702253a8846586b8aff7f2f4d764a122 Mon Sep 17 00:00:00 2001
From: Alexander Ebert <ebert@woltlab.com>
Date: Mon, 10 May 2021 17:41:06 +0200
Subject: [PATCH] Explicit dimensions of the small page logo

---
 com.woltlab.wcf/templates/pageHeaderLogo.tpl  |  5 ++-
 .../files/lib/data/style/Style.class.php      | 44 +++++++++++++++++++
 .../files/style/layout/pageHeader.scss        |  3 +-
 3 files changed, 49 insertions(+), 3 deletions(-)

diff --git a/com.woltlab.wcf/templates/pageHeaderLogo.tpl b/com.woltlab.wcf/templates/pageHeaderLogo.tpl
index 5b4253509d..42f19137c3 100644
--- a/com.woltlab.wcf/templates/pageHeaderLogo.tpl
+++ b/com.woltlab.wcf/templates/pageHeaderLogo.tpl
@@ -6,7 +6,10 @@
 			*}{if $__wcf->getStyleHandler()->getStyle()->getVariable('pageLogoHeight')} height="{@$__wcf->getStyleHandler()->getStyle()->getVariable('pageLogoHeight')}"{/if}{*
 			*}{if $__wcf->getStyleHandler()->getStyle()->getVariable('pageLogoWidth')} width="{@$__wcf->getStyleHandler()->getStyle()->getVariable('pageLogoWidth')}"{/if}{*
 			*} loading="eager">
-		<img src="{$__wcf->getStyleHandler()->getStyle()->getPageLogoMobile()}" alt="" class="pageHeaderLogoSmall" loading="eager">
+		<img src="{$__wcf->getStyleHandler()->getStyle()->getPageLogoMobile()}" alt="" class="pageHeaderLogoSmall"{*
+			*}{if $__wcf->getStyleHandler()->getStyle()->getPageLogoSmallHeight()} height="{@$__wcf->getStyleHandler()->getStyle()->getPageLogoSmallHeight()}"{/if}{*
+			*}{if $__wcf->getStyleHandler()->getStyle()->getPageLogoSmallWidth()} width="{@$__wcf->getStyleHandler()->getStyle()->getPageLogoSmallWidth()}"{/if}{*
+			*} loading="eager">
 		
 		{event name='headerLogo'}
 	</a>
diff --git a/wcfsetup/install/files/lib/data/style/Style.class.php b/wcfsetup/install/files/lib/data/style/Style.class.php
index be269fb652..4611e19d72 100644
--- a/wcfsetup/install/files/lib/data/style/Style.class.php
+++ b/wcfsetup/install/files/lib/data/style/Style.class.php
@@ -40,6 +40,16 @@ use wcf\util\ImageUtil;
  */
 class Style extends DatabaseObject
 {
+    /**
+     * @since 5.4
+     */
+    protected $pageLogoSmallHeight = 0;
+
+    /**
+     * @since 5.4
+     */
+    protected $pageLogoSmallWidth = 0;
+
     /**
      * list of style variables
      * @var string[]
@@ -180,6 +190,25 @@ class Style extends DatabaseObject
         if (empty($this->variables['wcfPageThemeColor'])) {
             $this->variables['wcfPageThemeColor'] = $this->variables['wcfHeaderBackground'];
         }
+
+        // Fetch the dimensions of the small logo, avoding calls to `getimagesize` with every request.
+        $filename = \WCF_DIR . 'images/default-logo-small.png';
+        if ($this->getVariable('pageLogoMobile')) {
+            $filename = \WCF_DIR;
+            if ($this->imagePath) {
+                $filename .= $this->imagePath;
+            }
+
+            $filename .= $this->getVariable('pageLogoMobile');
+        }
+
+        if (\file_exists($filename)) {
+            $data = \getimagesize($filename);
+            if ($data !== false) {
+                $this->pageLogoSmallWidth = $data[0];
+                $this->pageLogoSmallHeight = $data[1];
+            }
+        }
     }
 
     /**
@@ -296,6 +325,21 @@ class Style extends DatabaseObject
         return WCF::getPath() . 'images/coverPhotos/' . $this->getCoverPhoto();
     }
 
+    /**
+     * @since 5.4
+     */
+    public function getPageLogoSmallHeight(): int {
+        return $this->pageLogoSmallHeight;
+    }
+
+    /**
+     * @since 5.4
+     */
+    public function getPageLogoSmallWidth(): int
+    {
+        return $this->pageLogoSmallWidth;
+    }
+
     /**
      * Serve the WebP variant of the cover photo if the browser supports
      * it and the original cover photo is not a GIF.
diff --git a/wcfsetup/install/files/style/layout/pageHeader.scss b/wcfsetup/install/files/style/layout/pageHeader.scss
index df7e323484..7b1ec4fdba 100644
--- a/wcfsetup/install/files/style/layout/pageHeader.scss
+++ b/wcfsetup/install/files/style/layout/pageHeader.scss
@@ -325,9 +325,8 @@
 
 		.pageHeaderLogoSmall {
 			max-height: 30px;
-
-			/* prevent over-sized logos from overlapping the user panel buttons */
 			max-width: 100%;
+			object-fit: contain;
 		}
 	}
 }
-- 
2.20.1