mirror of
https://github.com/M4X809/list-of-lp.git
synced 2025-12-25 19:12:48 +00:00
m4x809
6ce4950d54
- Updated AlbumCard to use a div wrapper instead of Card for layout, enhancing styling with dynamic theme colors. - Improved BackButton to accept a theme prop, allowing for dynamic styling on hover. - Adjusted layout.tsx to remove unnecessary imports and streamline the MantineProvider usage. - Enhanced album detail page with new theming and styling for better visual consistency. - Added Spotify URLs for tracks in the album list for better integration with music services.
34 lines
888 B
TypeScript
34 lines
888 B
TypeScript
"use client";
|
|
|
|
import { Button } from "@mantine/core";
|
|
import { Link } from "next-view-transitions";
|
|
import type { AlbumTheme } from "@/lib/themes";
|
|
|
|
interface BackButtonProps {
|
|
theme?: AlbumTheme;
|
|
}
|
|
|
|
export default function BackButton({ theme }: BackButtonProps) {
|
|
return (
|
|
<Button
|
|
component={Link}
|
|
href="/"
|
|
variant="subtle"
|
|
className="mb-8 transition-all duration-200"
|
|
style={{
|
|
color: theme?.text.secondary || "#d1d5db",
|
|
backgroundColor: "transparent",
|
|
}}
|
|
onMouseEnter={(e) => {
|
|
e.currentTarget.style.backgroundColor = theme?.card.background || "rgba(31, 41, 55, 0.5)";
|
|
e.currentTarget.style.color = theme?.text.primary || "#ffffff";
|
|
}}
|
|
onMouseLeave={(e) => {
|
|
e.currentTarget.style.backgroundColor = "transparent";
|
|
e.currentTarget.style.color = theme?.text.secondary || "#d1d5db";
|
|
}}
|
|
>
|
|
← Back to Albums
|
|
</Button>
|
|
);
|
|
}
|