Fix various stuff

src/components/Paragraph.tsx

@@ -1,8 +1,8 @@
 import clsx from 'clsx'
 import { HTMLAttributes } from 'react'
 
-const Paragraph = ({ children, className = '' }: HTMLAttributes<HTMLParagraphElement>) => {
-  return <p className={clsx('w-full leading-relaxed', className)}>{children}</p>
+const Paragraph = ({ children, className }: HTMLAttributes<HTMLParagraphElement>) => {
+  return <p className={clsx('w-full max-w-xl leading-relaxed', className)}>{children}</p>
 }
 
 export default Paragraph

src/components/TimelineItem.tsx

@@ -15,7 +15,13 @@ const TimelineItem = ({
   right?: boolean
 }) => {
   return (
-    <div className={clsx('flex gap-4 border-b border-b-black/20 py-4', className)}>
+    <div
+      className={clsx(
+        'flex gap-4 border-b border-b-black/20 py-4',
+        className,
+        right && 'justify-between'
+      )}
+    >
       <div className="w-32 font-serif italic sm:w-40 md:w-52">{year}</div>
       <Paragraph className={clsx(bold && 'font-semibold', right && 'text-right')}>{desc}</Paragraph>
     </div>

src/components/WorkTile.tsx

@@ -6,7 +6,7 @@ const WorkTile = ({ children, title, links, className }: WorkTileWrapperProps) =
   return (
     <div className={clsx('flex min-h-screen w-full flex-col gap-12 p-12', className)}>
       {title && (
-        <Heading size={2} className="sticky top-6">
+        <Heading size={2} className="sticky top-8">
           {title}
         </Heading>
       )}

src/content/AboutMe.tsx

@@ -5,12 +5,14 @@ import TimelineItem from '@/components/TimelineItem'
 const AboutMe = () => {
   return (
     <div className="min-h-screen gap-12 bg-gradient-to-bl from-[#EBAF25] to-[#FEC84B] to-30% p-12">
-      <Heading size={2}>CV</Heading>
-      <Paragraph className="mb-24 mt-8 max-w-xl">
+      <Heading size={2} className="sticky top-8">
+        CV
+      </Heading>
+      <Paragraph className="mb-24 mt-8">
         I spend lot of quality time with my family—or alone if needed—preferably while mountain
         biking, traveling or both. I also shoot pictures and I love to read.
       </Paragraph>
-      <div className="flex max-w-6xl flex-col">
+      <div className="flex flex-col">
         <TimelineItem year={'A long time ago'} desc="Han shot first!" className="mb-72" right />
         <TimelineItem year={1985} desc="Born" className="mb-12" />
         <TimelineItem

src/content/Intro.tsx

@@ -9,7 +9,7 @@ const Intro = () => {
     <div className="flex min-h-screen flex-col gap-16 p-12">
       <Heading size={1}>Adam Plesník</Heading>
       <Heading size={2}>Design engineer.</Heading>
-      <Paragraph className="max-w-xl flex-1 text-2xl">
+      <Paragraph className="flex-1 text-2xl">
         I create, polish, and improve user interfaces by clicking in <Em>Figma</Em> and coding in{' '}
         <Em>React</Em>.
       </Paragraph>