mirror of
https://github.com/snapotter-hq/SnapOtter.git
synced 2026-08-03 07:46:42 +02:00
feat: add Nunito font for headings and navbar wordmark
This commit is contained in:
@@ -1,8 +1,9 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Inter } from "next/font/google";
|
||||
import { Inter, Nunito } from "next/font/google";
|
||||
import "@/styles/globals.css";
|
||||
|
||||
const inter = Inter({ subsets: ["latin"], variable: "--font-inter" });
|
||||
const nunito = Nunito({ subsets: ["latin"], variable: "--font-nunito" });
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "SnapOtter | Self-Hosted Image Processing",
|
||||
@@ -36,7 +37,7 @@ export const metadata: Metadata = {
|
||||
|
||||
export default function RootLayout({ children }: { children: React.ReactNode }) {
|
||||
return (
|
||||
<html lang="en" className={inter.variable} suppressHydrationWarning>
|
||||
<html lang="en" className={`${inter.variable} ${nunito.variable}`} suppressHydrationWarning>
|
||||
<body
|
||||
className="bg-background text-foreground font-[family-name:var(--font-inter)] antialiased"
|
||||
suppressHydrationWarning
|
||||
|
||||
@@ -114,7 +114,7 @@ export function Hero() {
|
||||
</div>
|
||||
|
||||
<div className="relative mx-auto max-w-4xl text-center">
|
||||
<h1 className="animate-[fadeUp_0.6s_ease-out_both] text-4xl font-extrabold tracking-tight sm:text-5xl md:text-6xl lg:text-7xl">
|
||||
<h1 className="animate-[fadeUp_0.6s_ease-out_both] font-[family-name:var(--font-nunito)] text-4xl font-extrabold tracking-tight sm:text-5xl md:text-6xl lg:text-7xl">
|
||||
Your images. Stay yours.
|
||||
</h1>
|
||||
|
||||
|
||||
@@ -37,10 +37,15 @@ export function Navbar() {
|
||||
<nav className="fixed top-0 left-0 right-0 z-50 bg-background/60 backdrop-blur-xl after:absolute after:bottom-0 after:left-0 after:h-px after:w-full after:bg-gradient-to-r after:from-transparent after:via-accent/30 after:to-transparent">
|
||||
<div className="mx-auto flex h-16 max-w-6xl items-center justify-between px-6">
|
||||
<a href="/" className="flex items-center gap-2">
|
||||
<div className="flex h-8 w-8 items-center justify-center rounded-lg bg-accent text-accent-foreground text-sm font-bold">
|
||||
S
|
||||
</div>
|
||||
<span className="text-lg font-bold tracking-tight">SnapOtter</span>
|
||||
<img
|
||||
src="/logo.png"
|
||||
alt="SnapOtter"
|
||||
className="h-8 w-8"
|
||||
style={{ imageRendering: "auto" }}
|
||||
/>
|
||||
<span className="font-[family-name:var(--font-nunito)] text-lg font-bold tracking-tight">
|
||||
SnapOtter
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<div className="hidden items-center gap-6 lg:flex">
|
||||
|
||||
Reference in New Issue
Block a user