diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/Header.astro | 2 | ||||
| -rw-r--r-- | src/consts.ts | 2 | ||||
| -rw-r--r-- | src/pages/index.astro | 63 | ||||
| -rw-r--r-- | src/styles/global.css | 29 | ||||
| -rw-r--r-- | src/styles/typography.css | 5 |
5 files changed, 66 insertions, 35 deletions
diff --git a/src/components/Header.astro b/src/components/Header.astro index ff7dafe..c8b06d1 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -13,7 +13,7 @@ import logo from '../../public/static/logo.svg' <Link href="/" class="flex shrink-0 items-center justify-center gap-3"> <Image src={logo} alt="Logo" class="size-5 sm:size-6" /> <span - class="hidden h-full text-lg leading-none font-medium min-[400px]:block" + class="hidden h-full font-mono text-lg leading-none font-medium min-[400px]:block" >{SITE.title}</span > </Link> diff --git a/src/consts.ts b/src/consts.ts index 58bb71e..15c6ad1 100644 --- a/src/consts.ts +++ b/src/consts.ts @@ -1,7 +1,7 @@ import type { IconMap, SocialLink, Site } from '@/types' export const SITE: Site = { - title: 'FOSS CET', + title: 'FOSSCET', description: "Don't just join a club; build one. We need architects, not just members", href: 'https://astro-erudite.vercel.app', diff --git a/src/pages/index.astro b/src/pages/index.astro index 9549a7c..c884146 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -6,7 +6,7 @@ import PageHead from '@/components/PageHead.astro' import { buttonVariants } from '@/components/ui/button' import { SITE } from '@/consts' import Layout from '@/layouts/Layout.astro' -import { getRecentPosts, getRecentEvents } from '@/lib/data-utils' +import { getRecentEvents, getRecentPosts } from '@/lib/data-utils' const blog = await getRecentPosts(SITE.featuredPostCount) const events = await getRecentEvents(SITE.featuredEventsCount) @@ -16,55 +16,58 @@ const events = await getRecentEvents(SITE.featuredEventsCount) <PageHead slot="head" title="Home" /> <section class="rounded-lg border"> <div class="flex flex-col space-y-1.5 p-6"> - <h3 class="text-3xl leading-none font-medium">er·u·dite</h3> - <p class="text-muted-foreground text-sm"> - /ˈer(y)əˌdīt/ • <span class="font-medium">adjective</span> + <h3 class="font-mono text-3xl leading-none font-medium"> + Software belongs to the people. + </h3> + <p class="text-muted-foreground mt-5"> + We are a community of hackers, builders, and privacy advocates dedicated + to Free and Open Source Software. </p> </div> </section> <section class="flex flex-col gap-y-4"> - <h2 class="text-2xl font-medium">Latest events</h2> + <h2 class="text-2xl font-medium">Events</h2> <ul class="flex flex-col gap-y-4"> { - events.map((event) => ( - <li> - <EventCard entry={event} /> - </li> - )) + events.map((event) => ( + <li> + <EventCard entry={event} /> + </li> + )) } </ul> <div class="flex justify-center"> <Link - href="/events" - class={buttonVariants({ variant: 'ghost' }) + ' group'} - > - See all posts <span - class="ml-1.5 transition-transform group-hover:translate-x-1" - >→</span - > + href="/events" + class={buttonVariants({ variant: 'ghost' }) + ' group'} + > + See all posts <span + class="ml-1.5 transition-transform group-hover:translate-x-1" + >→</span + > </Link> </div> </section> <section class="flex flex-col gap-y-4"> - <h2 class="text-2xl font-medium">Latest posts</h2> + <h2 class="text-2xl font-medium">Blog posts</h2> <ul class="flex flex-col gap-y-4"> { - blog.map((post) => ( - <li> - <BlogCard entry={post} /> - </li> - )) + blog.map((post) => ( + <li> + <BlogCard entry={post} /> + </li> + )) } </ul> <div class="flex justify-center"> <Link - href="/blog" - class={buttonVariants({ variant: 'ghost' }) + ' group'} - > - See all posts <span - class="ml-1.5 transition-transform group-hover:translate-x-1" - >→</span - > + href="/blog" + class={buttonVariants({ variant: 'ghost' }) + ' group'} + > + See all posts <span + class="ml-1.5 transition-transform group-hover:translate-x-1" + >→</span + > </Link> </div> </section> diff --git a/src/styles/global.css b/src/styles/global.css index 719f8dc..d7dffa3 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -7,7 +7,7 @@ Geist, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; --font-mono: - Geist Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, + '0xProto', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; --color-background: var(--background); @@ -42,6 +42,33 @@ font-display: swap; } +/* Regular */ +@font-face { + font-family: '0xProto'; + src: url('/fonts/0xProto/0xProto-Regular.woff2') format('woff2'); + font-weight: 400; + font-style: normal; + font-display: swap; +} + +/* Bold */ +@font-face { + font-family: '0xProto'; + src: url('/fonts/0xProto/0xProto-Bold.woff2') format('woff2'); + font-weight: 700; + font-style: normal; + font-display: swap; +} + +/* Italic */ +@font-face { + font-family: '0xProto'; + src: url('/fonts/0xProto/0xProto-Italic.woff2') format('woff2'); + font-weight: 400; + font-style: italic; + font-display: swap; +} + :root { --background: oklch(1 0 0); --foreground: oklch(0.145 0 0); diff --git a/src/styles/typography.css b/src/styles/typography.css index e8f6e14..6667606 100644 --- a/src/styles/typography.css +++ b/src/styles/typography.css @@ -18,6 +18,7 @@ h5, h6 { @apply text-balance; + @apply font-mono; } p { @@ -134,8 +135,8 @@ } :where(img, video, figure, .expressive-code):not( - :where(.not-prose, .not-prose *) - ) { + :where(.not-prose, .not-prose *) + ) { @apply mx-auto my-6; } |