Update components

src/components/Heading.tsx

@@ -5,7 +5,7 @@ const Heading = ({ size = 1, className = '', children }: PropsWithChildren<Title
   const defaultClasses = clsx('relative text-zinc-950 font-semibold', className)
 
   if (size === 1) {
-    return <h1 className={clsx(defaultClasses, 'pb-8 text-xl leading-normal')}>{children}</h1>
+    return <h1 className={clsx(defaultClasses, 'text-xl leading-normal')}>{children}</h1>
   } else if (size === 2) {
     return <h2 className={clsx(defaultClasses, 'pb-12 text-3xl opacity-90')}>{children}</h2>
   } else if (size === 3) {

src/components/Link.tsx

@@ -24,12 +24,12 @@ const Link = ({
           }}
           transition={{ duration: 0.72, type: 'spring' }}
         >
-          <Icon className="size-7 pr-2 text-fuchsia-600 opacity-70" strokeWidth={1.8} />
+          <Icon className="size-7 pr-2 text-pink-600 opacity-70" strokeWidth={1.8} />
         </motion.div>
       ) : (
         ''
       )}
-      <a href={href} target={target} className="hover:text-fuchsia-700 print:text-gray-700">
+      <a href={href} target={target} className="hover:text-pink-700 print:text-gray-700">
         {children}
       </a>
     </div>

src/components/__snapshots__/Link.test.tsx.snap

@@ -7,7 +7,7 @@ exports[`Link with href 1`] = `
   onMouseLeave={[Function]}
 >
   <a
-    className="hover:text-fuchsia-700 print:text-gray-700"
+    className="hover:text-pink-700 print:text-gray-700"
     href="url/"
     target="_blank"
   >
@@ -23,7 +23,7 @@ exports[`Link with href and custom target 1`] = `
   onMouseLeave={[Function]}
 >
   <a
-    className="hover:text-fuchsia-700 print:text-gray-700"
+    className="hover:text-pink-700 print:text-gray-700"
     href="url/"
     target="_self"
   >
@@ -47,7 +47,7 @@ exports[`Link with href, custom target and icon 1`] = `
     }
   >
     <svg
-      className="lucide lucide-cog size-7 pr-2 text-fuchsia-600 opacity-70"
+      className="lucide lucide-cog size-7 pr-2 text-pink-600 opacity-70"
       fill="none"
       height={24}
       stroke="currentColor"
@@ -103,7 +103,7 @@ exports[`Link with href, custom target and icon 1`] = `
     </svg>
   </div>
   <a
-    className="hover:text-fuchsia-700 print:text-gray-700"
+    className="hover:text-pink-700 print:text-gray-700"
     href="url/"
     target="_self"
   >

src/content/Info.tsx

@@ -6,7 +6,20 @@ import TextAnim from '../components/TextAnim'
 const Info = () => {
   return (
     <div>
-      <Heading size={1}>Adam Plesník</Heading>
+      <div className="sticky top-0 flex items-center justify-between pb-12">
+        <Heading size={1}>Adam Plesník</Heading>
+        <a href="https://github.com/adamplesnik" className="text-zinc-700 hover:text-pink-500">
+          <svg
+            xmlns="http://www.w3.org/2000/svg"
+            viewBox="0 0 98 96"
+            height="100%"
+            className="size-5"
+            fill="currentColor"
+          >
+            <path d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z" />
+          </svg>
+        </a>
+      </div>
       <Heading size={2}>Design engineer based in Bratislava, Slovakia.</Heading>
       <p className="pb-4 text-2xl font-medium text-zinc-950">
         I love creating, polishing and improving user interfaces in Figma and React, with focus on{' '}

src/content/KolbordTile.tsx

@@ -1,4 +1,3 @@
-import { Github } from 'lucide-react'
 import Link from '../components/Link'
 import Paragraph from '../components/Paragraph'
 import Tile from '../components/Tile'
@@ -17,10 +16,8 @@ const KolbordTile = () => {
         Opinionated, free to use, and open source app for one-click reservation of anything.
       </Paragraph>
       <Paragraph>Built in React, Payload CMS with user management in Clerk.</Paragraph>
-      <Link href="https://github.com/adamplesnik/kolbord" Icon={Github}>
-        @adamplesnik/kolbord
-      </Link>
-      <Link href="https://github.com/adamplesnik/kolbord-payload" Icon={Github}>
+      <Link href="https://github.com/adamplesnik/kolbord">@adamplesnik/kolbord</Link>
+      <Link href="https://github.com/adamplesnik/kolbord-payload">
         @adamplesnik/kolbord-payload
       </Link>
     </Tile>

src/content/Work.tsx

@@ -1,5 +1,11 @@
+import Heading from '../components/Heading'
+
 const Work = () => {
-  return <div></div>
+  return (
+    <div>
+      <Heading size={3}>Work</Heading>
+    </div>
+  )
 }
 
 export default Work

src/pages/Home.tsx

@@ -1,10 +1,11 @@
-import KolbordTile from '@/content/KolbordTile'
-import LoveToDo from '@/content/LoveToDo'
 import Cv from '../content/Cv'
 import Info from '../content/Info'
+import KolbordTile from '../content/KolbordTile'
+import LoveToDo from '../content/LoveToDo'
 import PluginTile from '../content/PluginTile'
 import Skills from '../content/Skills'
 import WebUmeniaTile from '../content/WebUmeniaTile'
+import Work from '../content/Work'
 import Page from '../layouts/Page'
 
 const Home = () => {
@@ -13,6 +14,7 @@ const Home = () => {
       <Info />
       <Skills />
       <LoveToDo />
+      <Work />
       <KolbordTile />
       <PluginTile />
       <WebUmeniaTile />