Add Footer component to layout and remove StyleGuidePage
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 2m19s

This commit is contained in:
Julien Froidefond
2025-12-12 17:10:19 +01:00
parent 5b96cf907e
commit 6d1e3daebb
4 changed files with 59 additions and 11 deletions

View File

@@ -4,6 +4,7 @@ import { Orbitron, Rajdhani } from "next/font/google";
import "./globals.css"; import "./globals.css";
import SessionProvider from "@/components/layout/SessionProvider"; import SessionProvider from "@/components/layout/SessionProvider";
import { ThemeProvider } from "@/contexts/ThemeContext"; import { ThemeProvider } from "@/contexts/ThemeContext";
import Footer from "@/components/layout/Footer";
const orbitron = Orbitron({ const orbitron = Orbitron({
subsets: ["latin"], subsets: ["latin"],
@@ -34,7 +35,10 @@ export default function RootLayout({
> >
<body className="antialiased"> <body className="antialiased">
<ThemeProvider> <ThemeProvider>
<SessionProvider>{children}</SessionProvider> <SessionProvider>
{children}
<Footer />
</SessionProvider>
</ThemeProvider> </ThemeProvider>
</body> </body>
</html> </html>

View File

@@ -0,0 +1,40 @@
"use client";
import Link from "next/link";
export default function Footer() {
return (
<footer
className="w-full py-6 px-4 sm:px-8 border-t"
style={{
backgroundColor: "var(--background)",
borderColor: "color-mix(in srgb, var(--gray-800) 30%, transparent)",
}}
>
<div className="max-w-7xl mx-auto flex flex-col sm:flex-row items-center justify-between gap-4">
<div
className="text-xs text-center sm:text-left"
style={{ color: "var(--muted-foreground)" }}
>
© {new Date().getFullYear()} Game of Tech - Peaksys
</div>
<div className="flex items-center gap-6">
<Link
href="/style-guide"
className="text-xs uppercase tracking-widest transition"
style={{ color: "var(--muted-foreground)" }}
onMouseEnter={(e) =>
(e.currentTarget.style.color = "var(--accent-color)")
}
onMouseLeave={(e) =>
(e.currentTarget.style.color = "var(--muted-foreground)")
}
>
Style Guide
</Link>
</div>
</div>
</footer>
);
}

View File

@@ -42,21 +42,25 @@ export default function StarRating({
type="button" type="button"
onClick={() => handleClick(star)} onClick={() => handleClick(star)}
disabled={disabled} disabled={disabled}
onMouseEnter={() => !disabled && setHoverValue(star)}
onMouseLeave={() => !disabled && setHoverValue(0)}
className={`transition-transform hover:scale-110 disabled:hover:scale-100 disabled:cursor-not-allowed ${sizeClasses[size]}`}
style={{
color: star <= displayValue ? "var(--accent-color)" : "var(--gray-500)",
}}
onMouseEnter={(e) => { onMouseEnter={(e) => {
if (!disabled && star > displayValue) { if (!disabled) {
setHoverValue(star);
if (star > displayValue) {
e.currentTarget.style.color = "var(--gray-400)"; e.currentTarget.style.color = "var(--gray-400)";
} }
}
}} }}
onMouseLeave={(e) => { onMouseLeave={(e) => {
if (!disabled && star > displayValue) { if (!disabled) {
setHoverValue(0);
if (star > displayValue) {
e.currentTarget.style.color = "var(--gray-500)"; e.currentTarget.style.color = "var(--gray-500)";
} }
}
}}
className={`transition-transform hover:scale-110 disabled:hover:scale-100 disabled:cursor-not-allowed ${sizeClasses[size]}`}
style={{
color: star <= displayValue ? "var(--accent-color)" : "var(--gray-500)",
}} }}
aria-label={`Noter ${star} étoile${star > 1 ? "s" : ""}`} aria-label={`Noter ${star} étoile${star > 1 ? "s" : ""}`}
> >