feat: add typewriter-style love letter section with torn paper effect

- Added new love letter section below hero with custom typewriter font styling
- Integrated torn paper visual effect using new booktear.png images
- Added JMH Typewriter font and configured it in layout and Tailwind
- Created new UI component Booktear.jsx for reusable torn paper effect
- Added paper texture background and love-red color theme
- Included stylized message with custom typography and spacing
- Removed background color
This commit is contained in:
2025-10-24 04:47:57 +02:00
parent 0d5d8f9d8a
commit 1030e0150a
10 changed files with 90 additions and 5 deletions

View File

@@ -1,4 +1,5 @@
import { Inter, Lexend } from 'next/font/google'
import localFont from 'next/font/local'
import clsx from 'clsx'
import '@/styles/tailwind.css'
@@ -18,6 +19,11 @@ const inter = Inter({
variable: '--font-inter',
})
const jmhTypewriter = localFont({
src: '../fonts/jmh_typewriter/JMH Typewriter.otf',
variable: '--font-jmh-typewriter',
})
const lexend = Lexend({
subsets: ['latin'],
display: 'swap',
@@ -29,9 +35,10 @@ export default function RootLayout({ children }) {
<html
lang="en"
className={clsx(
'h-full scroll-smooth bg-creme-600 antialiased',
'h-full scroll-smooth antialiased',
inter.variable,
lexend.variable,
jmhTypewriter.variable,
)}
>
<body className="flex h-full flex-col pt-20">