fix: Fix layout shifting with Copyright Component
This commit is contained in:
@@ -57,7 +57,7 @@ function App() {
|
||||
)}
|
||||
</IconsContext.Provider>
|
||||
</div>
|
||||
<Copyright isLoginPage={location.pathname === '/login'} />
|
||||
<Copyright isLoginPage={location.pathname === '/login'} isLoggedIn={isLoggedIn} onLogin={handleLogin} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@@ -1,7 +1,7 @@
|
||||
// Copyright.jsx
|
||||
import React, { useState, useEffect } from "react";
|
||||
|
||||
export default function Copyright({ isLoginPage }) {
|
||||
export default function Copyright({ isLoginPage, isLoggedIn }) {
|
||||
const [isCentered, setIsCentered] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
@@ -17,16 +17,21 @@ export default function Copyright({ isLoginPage }) {
|
||||
}
|
||||
}, [isLoginPage]);
|
||||
|
||||
// Show copyright on login page with transition, or at bottom after login
|
||||
if (!isLoginPage && !isLoggedIn) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
textAlign: "center",
|
||||
marginTop: "1rem",
|
||||
transition: "all 0.8s ease-in-out",
|
||||
position: "fixed",
|
||||
top: isCentered ? "65%" : "90%",
|
||||
left: "50%",
|
||||
transform: "translate(-50%, -50%)",
|
||||
position: isLoginPage ? "fixed" : "relative",
|
||||
top: isLoginPage ? (isCentered ? "65%" : "90%") : "auto",
|
||||
left: isLoginPage ? "50%" : "auto",
|
||||
transform: isLoginPage ? "translate(-50%, -50%)" : "none"
|
||||
}}
|
||||
>
|
||||
<p>
|
||||
|
Reference in New Issue
Block a user