From 7e61c07a495d99cffab3a59c70b82c66e65cd7d8 Mon Sep 17 00:00:00 2001
From: Saibotk <git@saibotk.de>
Date: Mon, 26 Aug 2024 01:25:34 +0200
Subject: [PATCH 1/2] [web][photos] Fix missing sidebar button padding

Previously the button was assigned 0 left padding instead of its default 12px padding. This caused the ripple and hover effects to be off. It also caused the button to be right on the screen edge on mobile.

This is now fixed by just removing the override.
---
 web/apps/photos/src/components/pages/gallery/Navbar.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/apps/photos/src/components/pages/gallery/Navbar.tsx b/web/apps/photos/src/components/pages/gallery/Navbar.tsx
index 45ae67d80c..a2cf98b4e3 100644
--- a/web/apps/photos/src/components/pages/gallery/Navbar.tsx
+++ b/web/apps/photos/src/components/pages/gallery/Navbar.tsx
@@ -53,7 +53,7 @@ export function GalleryNavbar({
             ) : (
                 <>
                     {!isInSearchMode && (
-                        <IconButton onClick={openSidebar} sx={{ pl: 0 }}>
+                        <IconButton onClick={openSidebar}>
                             <MenuIcon />
                         </IconButton>
                     )}

From f77fadee26a290b122fa6c1fde043e3e2a5a5ff7 Mon Sep 17 00:00:00 2001
From: Saibotk <git@saibotk.de>
Date: Mon, 26 Aug 2024 01:28:19 +0200
Subject: [PATCH 2/2] [web][photos] Fix mobile upload button hover & position

The hover and ripple effects and the positioning were off on the mobile upload button, because the `.mobile-button` class used the wrong class to let the element appear again. It used `display: block`, but the MUI IconButton actually has `display: inline-flex`, which will also fix the wrong height of the button.

See https://github.com/mui/material-ui/issues/33020
---
 web/apps/photos/src/components/Upload/UploadButton.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/apps/photos/src/components/Upload/UploadButton.tsx b/web/apps/photos/src/components/Upload/UploadButton.tsx
index 72d0319bc5..b202dfb8e0 100644
--- a/web/apps/photos/src/components/Upload/UploadButton.tsx
+++ b/web/apps/photos/src/components/Upload/UploadButton.tsx
@@ -17,7 +17,7 @@ const Wrapper = styled("div")<{ $disableShrink: boolean }>`
         !$disableShrink &&
         `@media (max-width: 624px) {
         & .mobile-button {
-            display: block;
+            display: inline-flex;
         }
         & .desktop-button {
             display: none;