From 72c93a170317effcc8c440cb454cc78d6704aab2 Mon Sep 17 00:00:00 2001
From: Manav Rathi <manav@mrmr.io>
Date: Fri, 27 Sep 2024 18:44:53 +0530
Subject: [PATCH] Tweak styling

---
 web/packages/new/photos/components/Gallery/BarImpl.tsx | 5 ++++-
 web/packages/new/photos/components/Gallery/index.tsx   | 8 +++++++-
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/web/packages/new/photos/components/Gallery/BarImpl.tsx b/web/packages/new/photos/components/Gallery/BarImpl.tsx
index 21ca50f357..a3db5a1e5e 100644
--- a/web/packages/new/photos/components/Gallery/BarImpl.tsx
+++ b/web/packages/new/photos/components/Gallery/BarImpl.tsx
@@ -250,7 +250,10 @@ export const GalleryBarImpl: React.FC<GalleryBarImplProps> = ({
     );
 
     return (
-        <BarWrapper>
+        // Hide the bottom border if we're showing the empty state for people.
+        <BarWrapper
+            sx={people.length ? {} : { borderBlockEndColor: "transparent" }}
+        >
             <Row1>
                 <ModeIndicator {...{ mode, onChangeMode }} />
                 {controls1}
diff --git a/web/packages/new/photos/components/Gallery/index.tsx b/web/packages/new/photos/components/Gallery/index.tsx
index 5ac9cda5b9..ddf14e4dea 100644
--- a/web/packages/new/photos/components/Gallery/index.tsx
+++ b/web/packages/new/photos/components/Gallery/index.tsx
@@ -45,7 +45,13 @@ export const SearchResultsHeader: React.FC<SearchResultsHeaderProps> = ({
 
 export const PeopleEmptyState: React.FC = () => (
     <VerticallyCentered>
-        <Typography color="text.muted">
+        <Typography
+            color="text.muted"
+            sx={{
+                // Approximately compensate for the hidden section bar
+                paddingBlockEnd: "86px",
+            }}
+        >
             {pt("People will appear here once indexing completes")}
         </Typography>
     </VerticallyCentered>