fix: Fix layout shifting with Copyright Component

This commit is contained in:
2025-09-28 15:24:23 -05:00
parent c778015244
commit 7f576bac73
2 changed files with 11 additions and 6 deletions

View File

@@ -57,7 +57,7 @@ function App() {
)} )}
</IconsContext.Provider> </IconsContext.Provider>
</div> </div>
<Copyright isLoginPage={location.pathname === '/login'} /> <Copyright isLoginPage={location.pathname === '/login'} isLoggedIn={isLoggedIn} onLogin={handleLogin} />
</div> </div>
); );
} }

View File

@@ -1,7 +1,7 @@
// Copyright.jsx // Copyright.jsx
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
export default function Copyright({ isLoginPage }) { export default function Copyright({ isLoginPage, isLoggedIn }) {
const [isCentered, setIsCentered] = useState(true); const [isCentered, setIsCentered] = useState(true);
useEffect(() => { useEffect(() => {
@@ -17,16 +17,21 @@ export default function Copyright({ isLoginPage }) {
} }
}, [isLoginPage]); }, [isLoginPage]);
// Show copyright on login page with transition, or at bottom after login
if (!isLoginPage && !isLoggedIn) {
return null;
}
return ( return (
<div <div
style={{ style={{
textAlign: "center", textAlign: "center",
marginTop: "1rem", marginTop: "1rem",
transition: "all 0.8s ease-in-out", transition: "all 0.8s ease-in-out",
position: "fixed", position: isLoginPage ? "fixed" : "relative",
top: isCentered ? "65%" : "90%", top: isLoginPage ? (isCentered ? "65%" : "90%") : "auto",
left: "50%", left: isLoginPage ? "50%" : "auto",
transform: "translate(-50%, -50%)", transform: isLoginPage ? "translate(-50%, -50%)" : "none"
}} }}
> >
<p> <p>