mirror of
https://github.com/linsa-io/linsa.git
synced 2026-01-11 20:00:23 +01:00
feat: homepage font (#145)
* feat: new fonts file * chore: apply geist * chore: use relaway font for 'I want to learn' * chore: config font geist * feat(util): suffle array * feat: add geist
This commit is contained in:
7
web/app/fonts.ts
Normal file
7
web/app/fonts.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
import { Raleway } from "next/font/google"
|
||||
export { GeistSans } from "geist/font/sans"
|
||||
export { GeistMono } from "geist/font/mono"
|
||||
// import { Inter } from "next/font/google"
|
||||
|
||||
// export const inter = Inter({ subsets: ["latin"] })
|
||||
export const raleway = Raleway({ subsets: ["latin"] })
|
||||
@@ -1,19 +1,13 @@
|
||||
import type { Metadata } from "next"
|
||||
import { Inter as FontSans } from "next/font/google"
|
||||
import { cn } from "@/lib/utils"
|
||||
import { ThemeProvider } from "@/lib/providers/theme-provider"
|
||||
import "./globals.css"
|
||||
|
||||
import { ClerkProviderClient } from "@/components/custom/clerk/clerk-provider-client"
|
||||
import { JotaiProvider } from "@/lib/providers/jotai-provider"
|
||||
import { Toaster } from "@/components/ui/sonner"
|
||||
import { ConfirmProvider } from "@/lib/providers/confirm-provider"
|
||||
import { DeepLinkProvider } from "@/lib/providers/deep-link-provider"
|
||||
|
||||
const fontSans = FontSans({
|
||||
subsets: ["latin"],
|
||||
variable: "--font-sans"
|
||||
})
|
||||
import { GeistMono, GeistSans } from "./fonts"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Learn Anything",
|
||||
@@ -29,7 +23,7 @@ export default function RootLayout({
|
||||
<html lang="en" className="h-full w-full" suppressHydrationWarning>
|
||||
<ClerkProviderClient>
|
||||
<DeepLinkProvider>
|
||||
<body className={cn("h-full w-full font-sans antialiased", fontSans.variable)}>
|
||||
<body className={cn("h-full w-full font-sans antialiased", GeistSans.variable, GeistMono.variable)}>
|
||||
<ThemeProvider attribute="class" defaultTheme="system" enableSystem>
|
||||
<JotaiProvider>
|
||||
<ConfirmProvider>
|
||||
|
||||
@@ -103,7 +103,7 @@ export function Autocomplete({ topics = [], onSelect, onInputChange }: Autocompl
|
||||
return (
|
||||
<Command
|
||||
key={commandKey}
|
||||
className={cn("relative overflow-visible", {
|
||||
className={cn("relative mx-auto max-w-md overflow-visible shadow-md", {
|
||||
"rounded-lg border": !open,
|
||||
"rounded-none rounded-t-lg border-l border-r border-t": open
|
||||
})}
|
||||
|
||||
@@ -5,6 +5,8 @@ import dynamic from "next/dynamic"
|
||||
import { motion } from "framer-motion"
|
||||
import { Autocomplete } from "./Autocomplete"
|
||||
import { useRouter } from "next/navigation"
|
||||
import { cn } from "@/lib/utils"
|
||||
import { raleway } from "@/app/fonts"
|
||||
|
||||
let graph_data_promise = import("./graph-data.json").then(a => a.default)
|
||||
|
||||
@@ -38,10 +40,13 @@ export function PublicHomeRoute() {
|
||||
filter_query={filterQuery}
|
||||
/>
|
||||
|
||||
<div className="absolute left-1/2 top-1/2 w-full max-w-md -translate-x-1/2 -translate-y-1/2 transform max-sm:px-5">
|
||||
<div className="absolute left-1/2 top-1/2 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 transform max-sm:px-5">
|
||||
<motion.div initial={{ opacity: 0, y: 20 }} animate={{ opacity: 1, y: 0 }} transition={{ duration: 0.5 }}>
|
||||
<motion.h1
|
||||
className="mb-2 text-center text-3xl font-bold uppercase sm:mb-4 md:text-5xl"
|
||||
className={cn(
|
||||
"mb-2 text-center text-5xl font-bold tracking-tight sm:mb-4 md:text-7xl",
|
||||
raleway.className
|
||||
)}
|
||||
initial={{ opacity: 0, y: -20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.5, delay: 0.2 }}
|
||||
|
||||
@@ -25,6 +25,15 @@ export const searchSafeRegExp = (inputValue: string) => {
|
||||
return new RegExp(escapedChars.join(".*"), "i")
|
||||
}
|
||||
|
||||
export function shuffleArray<T>(array: T[]): T[] {
|
||||
const shuffled = [...array]
|
||||
for (let i = shuffled.length - 1; i > 0; i--) {
|
||||
const j = Math.floor(Math.random() * (i + 1))
|
||||
;[shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]]
|
||||
}
|
||||
return shuffled
|
||||
}
|
||||
|
||||
export * from "./urls"
|
||||
export * from "./slug"
|
||||
export * from "./keyboard"
|
||||
|
||||
@@ -69,6 +69,7 @@
|
||||
"cmdk": "^1.0.0",
|
||||
"date-fns": "^3.6.0",
|
||||
"framer-motion": "^11.5.4",
|
||||
"geist": "^1.3.1",
|
||||
"jazz-react": "0.7.35-unique.2",
|
||||
"jazz-react-auth-clerk": "0.7.33-new-auth.1",
|
||||
"jazz-tools": "0.7.35-unique.2",
|
||||
|
||||
@@ -79,7 +79,9 @@ const config = {
|
||||
|
||||
// learn anything custom
|
||||
fontFamily: {
|
||||
sans: ["var(--font-sans)", ...fontFamily.sans]
|
||||
// sans: ["var(--font-sans)", ...fontFamily.sans],
|
||||
sans: ["var(--font-geist-sans)"],
|
||||
mono: ["var(--font-geist-mono)"]
|
||||
},
|
||||
|
||||
backgroundImage: {
|
||||
|
||||
Reference in New Issue
Block a user