added new component Logout

This commit is contained in:
2025-09-18 21:12:50 -06:00
parent 10adca26af
commit 18765ab8fb
6 changed files with 77 additions and 2 deletions
+2 -1
View File
@@ -21,4 +21,5 @@ export default function Information(props: InformationProps) {
</ul>
</div>
);
}
}
//IO
+45
View File
@@ -0,0 +1,45 @@
.button-logout {
background-color: #d32f2f;
position: absolute;
top: 10px;
right: 10px;
cursor: pointer;
z-index: 1;
}
.button-logout:hover {
background-color: #d12020;
}
@media (max-width: 800px) {
.button-logout {
color: transparent;
padding: 1.5rem;
font-size: 0px;
top: 15px;
}
.button-logout::after {
content: "";
border: 3px solid white;
border-radius: 2px;
height: 15px;
width: 15px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.button-logout::before {
content: "";
border: 2px solid white;
border-radius: 1px;
height: 0px;
width: 10px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(0, -50%);
}
}
+21
View File
@@ -0,0 +1,21 @@
"use client";
import Cookies from "js-cookie";
import { useRouter } from "next/navigation";
import "./Logout.css";
export default function Logout() {
const router = useRouter();
const handleLogout = () => {
Cookies.remove("token", { path: "/" });
router.push("/");
};
return (
<button onClick={handleLogout} className="button button-logout">
Cerrar sesión
</button>
);
}