starred/linsa-linsa-io
1
0
Fork 0
mirror of https://github.com/linsa-io/linsa.git synced 2026-04-24 17:28:41 +02:00
Code Issues 2 Packages Projects Releases Wiki Activity

feat: homepage font (#145)

Browse Source 
* 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:
Aslam
2024-09-07 01:48:51 +07:00
committed by GitHub
parent e7bd9a9d42
commit 3fe1f8012b
7 changed files with 30 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
web/app/fonts.ts Normal file
View 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"] })

10
web/app/layout.tsx
View File

@@ -1,19 +1,13 @@
import type { Metadata } from "next" import type { Metadata } from "next"
import { Inter as FontSans } from "next/font/google"
import { cn } from "@/lib/utils" import { cn } from "@/lib/utils"
import { ThemeProvider } from "@/lib/providers/theme-provider" import { ThemeProvider } from "@/lib/providers/theme-provider"
import "./globals.css" import "./globals.css"
import { ClerkProviderClient } from "@/components/custom/clerk/clerk-provider-client" import { ClerkProviderClient } from "@/components/custom/clerk/clerk-provider-client"
import { JotaiProvider } from "@/lib/providers/jotai-provider" import { JotaiProvider } from "@/lib/providers/jotai-provider"
import { Toaster } from "@/components/ui/sonner" import { Toaster } from "@/components/ui/sonner"
import { ConfirmProvider } from "@/lib/providers/confirm-provider" import { ConfirmProvider } from "@/lib/providers/confirm-provider"
import { DeepLinkProvider } from "@/lib/providers/deep-link-provider" import { DeepLinkProvider } from "@/lib/providers/deep-link-provider"
import { GeistMono, GeistSans } from "./fonts"
const fontSans = FontSans({
subsets: ["latin"],
variable: "--font-sans"
})
export const metadata: Metadata = { export const metadata: Metadata = {
title: "Learn Anything", title: "Learn Anything",
@@ -29,7 +23,7 @@ export default function RootLayout({
<html lang="en" className="h-full w-full" suppressHydrationWarning> <html lang="en" className="h-full w-full" suppressHydrationWarning>
<ClerkProviderClient> <ClerkProviderClient>
<DeepLinkProvider> <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> <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
<JotaiProvider> <JotaiProvider>
<ConfirmProvider> <ConfirmProvider>

2
web/components/routes/public/Autocomplete.tsx
View File

@@ -103,7 +103,7 @@ export function Autocomplete({ topics = [], onSelect, onInputChange }: Autocompl
return ( return (
<Command <Command
key={commandKey} key={commandKey}
className={cn("relative overflow-visible", { className={cn("relative mx-auto max-w-md overflow-visible shadow-md", {
"rounded-lg border": !open, "rounded-lg border": !open,
"rounded-none rounded-t-lg border-l border-r border-t": open "rounded-none rounded-t-lg border-l border-r border-t": open
})} })}

9
web/components/routes/public/PublicHomeRoute.tsx
View File

@@ -5,6 +5,8 @@ import dynamic from "next/dynamic"
import { motion } from "framer-motion" import { motion } from "framer-motion"
import { Autocomplete } from "./Autocomplete" import { Autocomplete } from "./Autocomplete"
import { useRouter } from "next/navigation" 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) let graph_data_promise = import("./graph-data.json").then(a => a.default)
@@ -38,10 +40,13 @@ export function PublicHomeRoute() {
filter_query={filterQuery} 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.div initial={{ opacity: 0, y: 20 }} animate={{ opacity: 1, y: 0 }} transition={{ duration: 0.5 }}>
<motion.h1 <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 }} initial={{ opacity: 0, y: -20 }}
animate={{ opacity: 1, y: 0 }} animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.5, delay: 0.2 }} transition={{ duration: 0.5, delay: 0.2 }}

9
web/lib/utils/index.ts
View File

@@ -25,6 +25,15 @@ export const searchSafeRegExp = (inputValue: string) => {
return new RegExp(escapedChars.join(".*"), "i") 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 "./urls"
export * from "./slug" export * from "./slug"
export * from "./keyboard" export * from "./keyboard"

1
web/package.json
View File

@@ -69,6 +69,7 @@
"cmdk": "^1.0.0", "cmdk": "^1.0.0",
"date-fns": "^3.6.0", "date-fns": "^3.6.0",
"framer-motion": "^11.5.4", "framer-motion": "^11.5.4",
"geist": "^1.3.1",
"jazz-react": "0.7.35-unique.2", "jazz-react": "0.7.35-unique.2",
"jazz-react-auth-clerk": "0.7.33-new-auth.1", "jazz-react-auth-clerk": "0.7.33-new-auth.1",
"jazz-tools": "0.7.35-unique.2", "jazz-tools": "0.7.35-unique.2",

4
web/tailwind.config.ts
View File

@@ -79,7 +79,9 @@ const config = {
// learn anything custom // learn anything custom
fontFamily: { fontFamily: {
sans: ["var(--font-sans)", ...fontFamily.sans] // sans: ["var(--font-sans)", ...fontFamily.sans],
sans: ["var(--font-geist-sans)"],
mono: ["var(--font-geist-mono)"]
}, },
backgroundImage: { backgroundImage: {