albert/albert.lol
1
0
Fork 0
mirror of https://github.com/skidoodle/albert.lol.git synced 2025-02-15 06:09:15 +01:00
Code Issues Projects Releases Packages Wiki Activity

.minor changes

Browse source
This commit is contained in:
skidoodle 2023-04-11 04:17:14 +02:00
parent f797a18a59
commit 56e6282f68
4 changed files with 36 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/MainLayout.tsx
View file

@ -12,7 +12,7 @@ export const MainLayout = () => {
<div className='ml-[10%] mr-[10%]'> <div className='ml-[10%] mr-[10%]'>
<div className='flex flex-col max-w-3xl mx-auto mb-16 mt-32'> <div className='flex flex-col max-w-3xl mx-auto mb-16 mt-32'>
<h1 className='text-7xl font-bold'>albert</h1> <h1 className='text-7xl font-bold'>albert</h1>
<p className='text-2xl text-gray-600 dark:text-gray-400 mt-2 font-semibold'> <p className='text-2xl text-gray-600 mt-2 font-semibold'>
{Math.floor( {Math.floor(
(new Date().getTime() - new Date('2004-07-22').getTime()) / (new Date().getTime() - new Date('2004-07-22').getTime()) /
(1000 * 60 * 60 * 24 * 365.25), (1000 * 60 * 60 * 24 * 365.25),

2
src/components/SocialLayout.tsx
View file

@ -4,7 +4,6 @@ import React from 'react';
export const SocialLayout = () => { export const SocialLayout = () => {
return ( return (
<>
<div className='grid grid-flow-col w-48 mt-3 text-2xl space-x-8'> <div className='grid grid-flow-col w-48 mt-3 text-2xl space-x-8'>
{socials.map((social) => ( {socials.map((social) => (
<Icon <Icon
@ -16,6 +15,5 @@ export const SocialLayout = () => {
</Icon> </Icon>
))} ))}
</div> </div>
</>
); );
}; };

14
src/components/SpotifyCard.tsx
View file

@ -1,9 +1,9 @@
import { truncate } from '@/utils/truncate'; import { truncate } from '@/utils/truncate';
import FadeIn from 'react-fade-in';
import Image from 'next/image'; import Image from 'next/image';
import useSWR from 'swr'; import useSWR from 'swr';
import SongImage from '@/public/song.webp'; import SongImage from '@/public/song.webp';
import Link from 'next/link'; import Link from 'next/link';
import { HiMusicNote } from 'react-icons/hi';
export const fetcher = (url: RequestInfo) => fetch(url).then((r) => r.json()); export const fetcher = (url: RequestInfo) => fetch(url).then((r) => r.json());
@ -14,7 +14,6 @@ export const NowPlayingCard = () => {
}); });
return ( return (
<FadeIn>
<div className='mt-5 focus:outline-none transition duration-300 ease-in-out transform hover:scale-105 p-3 rounded-md border border-gray-800 shadow flex flex-row max-w-sm'> <div className='mt-5 focus:outline-none transition duration-300 ease-in-out transform hover:scale-105 p-3 rounded-md border border-gray-800 shadow flex flex-row max-w-sm'>
{spotify.song ? ( {spotify.song ? (
<Image <Image
@ -24,25 +23,20 @@ export const NowPlayingCard = () => {
src={spotify.song?.image} src={spotify.song?.image}
/> />
) : ( ) : (
<Image height={45} width={45} alt='Song cover art' src={SongImage} /> <HiMusicNote size={45} className='p-2.5' />
)} )}
<div className='my-auto ml-4'> <div className='my-auto ml-4'>
<div className='font-semibold text-l sm:text-regular'> <div className='font-semibold text-l sm:text-regular'>
Listening to{' '} Listening to{' '}
{spotify.song ? ( {spotify.song ? (
<Link <Link href={`${spotify.song.url}`} target='_blank'>
href={`${spotify.song.url}`}
target='_blank'
className='text-[rgb(50,180,100)]'
>
{truncate(`${spotify.song.title}`, 20)} {truncate(`${spotify.song.title}`, 20)}
</Link> </Link>
) : ( ) : (
<span className='text-[rgb(50,180,100)]'>nothing</span> <span>nothing</span>
)} )}
</div> </div>
</div> </div>
</div> </div>
</FadeIn>
); );
}; };

6
src/pages/index.tsx
View file

@ -1,9 +1,5 @@
import { MainLayout } from '@/components/MainLayout'; import { MainLayout } from '@/components/MainLayout';
export default function Home () { export default function Home () {
return ( return <MainLayout />;
<>
<MainLayout />
</>
);
} }