1- import * as React from "react "
1+ import { ArrowUpRight } from "akar-icons "
22
33import type { Viewport } from "next"
4- import localFont from "next/font/local"
5- import Link from "next/link"
64import {
7- Inter ,
5+ Geist_Mono ,
86 IBM_Plex_Serif ,
97 Instrument_Serif ,
8+ Inter ,
109 JetBrains_Mono ,
11- Geist_Mono ,
1210} from "next/font/google"
13- import { ArrowUpRight } from "akar-icons"
11+ import localFont from "next/font/local"
12+ import Link from "next/link"
13+ import type * as React from "react"
1414
1515import classNames from "@/utils/classNames"
1616
@@ -103,26 +103,12 @@ const RootLayout: React.FC<Props> = ({ children }) => {
103103 > </ script >
104104 </ head >
105105
106- < body
107- className = "
108- flex flex-col overflow-x-hidden bg-zinc-100 font-sans
109- md:flex-row
110- "
111- >
112- < aside
113- className = "
114- flex flex-col px-8 pt-12
115- md:w-3/12
116- "
117- >
118- < h1 className = "mb-2 font-serif text-3xl tracking-tighter text-zinc-900" >
106+ < body className = "flex flex-col overflow-x-hidden bg-zinc-100 font-sans md:flex-row" >
107+ < aside className = "flex flex-col px-8 pt-12 md:w-3/12" >
108+ < h1 className = "mb-2 font-serif text-3xl text-zinc-900 tracking-tighter" >
119109 Interactive Interfaces
120110 </ h1 >
121- < p
122- className = "
123- mb-6 max-w-65 font-serif text-base tracking-tight text-zinc-600
124- "
125- >
111+ < p className = "mb-6 max-w-65 font-serif text-base text-zinc-600 tracking-tight" >
126112 A collection of interactive interfaces crafted with React,
127113 TypeScript, TailwindCSS, Framer Motion, and a tiny bit of CSS
128114 animations.
@@ -133,6 +119,7 @@ const RootLayout: React.FC<Props> = ({ children }) => {
133119 target = "_blank"
134120 href = "https://nirnejak.com/"
135121 className = "text-zinc-900 underline underline-offset-2"
122+ rel = "noopener"
136123 >
137124 Jeet
138125 </ a >
@@ -142,31 +129,19 @@ const RootLayout: React.FC<Props> = ({ children }) => {
142129 < Link
143130 key = { i }
144131 href = { component . link }
145- className = "
146- group flex items-center gap-2 py-1.5 tracking-tighter
147- text-zinc-500 transition-colors
148- hover:text-zinc-900
149- "
132+ className = "group flex items-center gap-2 py-1.5 text-zinc-500 tracking-tighter transition-colors hover:text-zinc-900"
150133 >
151134 < span > { component . title } </ span >
152- < div className = "flex-1 border-t border-dashed border-zinc-300 " />
135+ < div className = "flex-1 border-zinc-300 border-t border-dashed " />
153136 < ArrowUpRight
154137 size = { 16 }
155- className = "
156- transition-transform
157- group-hover:rotate-45
158- "
138+ className = "transition-transform group-hover:rotate-45"
159139 />
160140 </ Link >
161141 ) ) }
162142 </ div >
163143 </ aside >
164- < main
165- className = "
166- flex min-h-dvh p-4
167- md:w-9/12
168- "
169- >
144+ < main className = "flex min-h-dvh p-4 md:w-9/12" >
170145 < div className = "w-full rounded-xl bg-white" > { children } </ div >
171146 </ main >
172147 </ body >
0 commit comments