diff --git a/web/apps/photos/src/pages/index.tsx b/web/apps/photos/src/pages/index.tsx index 8b005ea989..bc56c30638 100644 --- a/web/apps/photos/src/pages/index.tsx +++ b/web/apps/photos/src/pages/index.tsx @@ -118,6 +118,14 @@ export default function LandingPage() { const redirectToSignupPage = () => router.push(PAGES.SIGNUP); const redirectToLoginPage = () => router.push(PAGES.LOGIN); + // return ( + // + // + // + // + // + // + // ); return ( {loading ? ( @@ -239,15 +247,16 @@ const shouldAllowChangingAPIOrigin = () => { }; const SlideshowPanel = styled("div")` + align-self: stretch; + flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; - text-align: center; @media (width <= 1024px) { - flex-grow: 0; + // flex-grow: 0; } `; @@ -310,19 +319,19 @@ const SideBox = styled("div")` const Slide: React.FC< React.PropsWithChildren<{ index: number; ref: Ref }> > = ({ ref, children }) => { - return {children}; + return ( + + {children} + + ); }; const SlidesContainer = styled("div")` display: flex; - box-sizing: border-box; - width: max(350px, 100%); - overflow: hidden; - border: 1px solid red; + overflow-x: hidden; scroll-behavior: smooth; & > div { flex: 0 0 100%; - border: 1px solid green; } `; @@ -334,7 +343,6 @@ const Slideshow: React.FC = () => { const intervalID = setInterval(() => { setSelectedIndex((selectedIndex + 1) % 3); }, 5000); - return () => clearInterval(intervalID); }); @@ -354,7 +362,14 @@ const Slideshow: React.FC = () => { }; return ( -
+ { onClick={() => setSelectedIndex(2)} > -
+ ); };