A listen later implementation for Spotify
1"use client";
2
3import Image from "next/image";
4import Link from "next/link";
5import { signIn } from "next-auth/react";
6
7const Home = () => {
8 return (
9 <div className="bg-neutral-900 grid grid-cols-5 grid-rows-1 h-screen w-screen">
10 <div className="col-span-3 flex items-center justify-center">
11 <div className="h-4/5 relative w-4/5">
12 <Image
13 alt="The llamify logo: a dark gray llama wearing green over-the-ear headphones with its eyes closed contently vibing to music with the name 'Llamify' underneath"
14 fill
15 src="/logo.png"
16 />
17 </div>
18 </div>
19 <div className="col-span-2 flex flex-col items-center justify-center relative">
20 <button
21 className="hover:bg-green-400 bg-green-500 active:bg-green-600 hover:cursor-pointer px-4 py-2 rounded-lg"
22 onClick={() => signIn("spotify")}
23 >
24 Log in with Spotify
25 </button>
26 <Link
27 className="absolute bottom-12 text-green-500 underline"
28 href="https://buymeacoffee.com/modamo"
29 >
30 ☕️ Buy me a coffee
31 </Link>
32 </div>
33 </div>
34 );
35};
36
37export default Home;