Skip to content

Commit 5c9814b

Browse files
quiteboringquiteboring
committed
feat: basic site
1 parent 55818d4 commit 5c9814b

13 files changed

Lines changed: 216 additions & 50 deletions

File tree

‎.prettierrc‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"tabWidth": 2,
3+
"useTabs": false,
4+
"semi": true,
5+
"singleQuote": true,
6+
"printWidth": 70
7+
}

‎app/_components/Navbar.tsx‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import Link from 'next/link';
2+
import { FaDiscord, FaGithub } from 'react-icons/fa';
3+
4+
export default function Navbar() {
5+
return (
6+
<nav className="sticky top-0 z-50 w-full border-b border-white/10 bg-[var(--background)]/80 backdrop-blur-md select-none">
7+
<div className="mx-auto flex h-16 max-w-7xl items-center justify-between px-6">
8+
<div className="flex items-center gap-8">
9+
<Link href="/" className="text-xl font-bold">
10+
cobalt.
11+
</Link>
12+
13+
<div className="hidden md:flex items-center gap-6">
14+
<Link href="/" className="text-xs font-semibold transition-colors hover:text-[#347BB2]">
15+
Home
16+
</Link>
17+
<Link href="/about" className="text-xs font-semibold transition-colors hover:text-[#347BB2]">
18+
About
19+
</Link>
20+
</div>
21+
</div>
22+
23+
<div className="flex items-center gap-4">
24+
<Link
25+
href="https://discord.gg/GAhS8UfDyy"
26+
target="_blank"
27+
className="text-[#B4B4B4] transition-colors hover:text-[#F8F9FA]"
28+
>
29+
<FaDiscord size={20} />
30+
</Link>
31+
32+
<Link
33+
href="https://github.com/CobaltScripts"
34+
target="_blank"
35+
className="text-[#B4B4B4] transition-colors hover:text-[#F8F9FA]"
36+
>
37+
<FaGithub size={20} />
38+
</Link>
39+
</div>
40+
</div>
41+
</nav>
42+
);
43+
}

‎app/_components/User.tsx‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import React from "react";
2+
import { getDiscordAvatarUrl } from "../../data/team";
3+
4+
interface UserProps {
5+
name: string;
6+
userId: string;
7+
avatarHash: string;
8+
role: string;
9+
}
10+
11+
export default function User({ name, userId, avatarHash, role }: UserProps) {
12+
const avatarUrl = getDiscordAvatarUrl(userId, avatarHash);
13+
14+
return (
15+
<div className="group flex flex-col items-center rounded-xl border border-white/5 bg-[#18181b] p-8 transition-all duration-300 ease-out hover:-translate-y-2 hover:border-[#347BB2] hover:shadow-xl hover:shadow-[#347BB2]/20">
16+
<div className="relative mb-5 h-24 w-24 overflow-hidden rounded-full shadow-md ring-2 ring-white/10 transition-all duration-300 ease-out">
17+
<img
18+
src={avatarUrl}
19+
alt={name}
20+
className="h-full w-full object-cover"
21+
/>
22+
</div>
23+
<h3 className="mb-1 text-lg font-bold text-white">{name}</h3>
24+
<span className="rounded-full border border-[#347BB2] bg-[#347BB2]/20 px-3 py-0.5 text-xs font-medium text-[#347BB2]">
25+
{role}
26+
</span>
27+
</div>
28+
);
29+
}

‎app/about/page.tsx‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import User from "../_components/User";
2+
import { team } from "../../data/team";
3+
4+
export default function About() {
5+
6+
return (
7+
<main className="flex flex-1 flex-col items-center px-4 py-20 md:justify-center md:py-0">
8+
<div className="mb-16 text-center">
9+
<h1 className="text-4xl font-bold md:text-5xl">The Team</h1>
10+
<p className="mt-4 text-gray-400">Meet the people behind Cobalt.</p>
11+
</div>
12+
13+
<div className="grid w-full max-w-5xl grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-3">
14+
{team.map((member) => (
15+
<User key={member.userId} {...member} />
16+
))}
17+
</div>
18+
</main>
19+
);
20+
}

‎app/favicon.ico‎

10.9 KB
Binary file not shown.

‎app/globals.css‎

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,18 @@
1-
@import "tailwindcss";
1+
@import 'tailwindcss';
22

33
:root {
4-
--background: rgb(3, 2, 8);
5-
--foreground: #FFFFFF;
4+
--background: #121212;
5+
--foreground: #f8f9fa;
6+
}
7+
8+
::selection {
9+
background-color: #6eb7e7;
10+
color: var(--background);
611
}
712

813
body {
914
color: var(--foreground);
1015
background: var(--background);
11-
font-family: Arial, Helvetica, sans-serif;
16+
font-family: var(--font-inter), sans-serif;
17+
letter-spacing: 0.02em;
1218
}

‎app/layout.tsx‎

Lines changed: 16 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,22 @@
1-
import type { Metadata, Viewport } from "next";
2-
import { Poppins } from "next/font/google";
3-
import "./globals.css";
1+
import type { Metadata, Viewport } from 'next';
2+
import { Inter } from 'next/font/google';
3+
import Navbar from './_components/Navbar';
4+
import './globals.css';
45

5-
const poppinsSans = Poppins({
6-
variable: "--font-poppins-sans",
7-
subsets: ["latin"],
8-
weight: ["400", "700"],
9-
});
10-
11-
const poppinsMono = Poppins({
12-
variable: "--font-poppins-mono",
13-
subsets: ["latin"],
14-
weight: ["400", "700"],
15-
style: ["normal"],
6+
const inter = Inter({
7+
variable: '--font-inter',
8+
subsets: ['latin'],
169
});
1710

1811
export const metadata: Metadata = {
19-
title: "Cobalt",
20-
description: "Experience the next level of Skyblock and maximize your grinding potential with Cobalt.",
12+
title: 'Cobalt',
13+
description:
14+
'Experience the next level of Skyblock and maximize your grinding potential with Cobalt.',
2115

2216
openGraph: {
2317
title: 'Cobalt',
24-
description: 'Experience the next level of Skyblock and maximize your grinding potential with Cobalt.',
18+
description:
19+
'Experience the next level of Skyblock and maximize your grinding potential with Cobalt.',
2520
url: 'https://cobalt.quiteboring.dev',
2621
siteName: 'cobalt.quiteboring.dev',
2722
locale: 'en_US',
@@ -31,18 +26,17 @@ export const metadata: Metadata = {
3126

3227
export const viewport: Viewport = {
3328
themeColor: '#4682B4',
34-
}
35-
29+
};
30+
3631
export default function RootLayout({
3732
children,
3833
}: Readonly<{
3934
children: React.ReactNode;
4035
}>) {
4136
return (
4237
<html lang="en">
43-
<body
44-
className={`${poppinsSans.variable} ${poppinsMono.variable} antialiased`}
45-
>
38+
<body className={`${inter.variable} antialiased overflow-x-hidden flex flex-col min-h-screen`}>
39+
<Navbar />
4640
{children}
4741
</body>
4842
</html>

‎app/page.tsx‎

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,19 @@
1-
export default function Home() {
1+
import Link from "next/link";
22

3-
}
3+
export default function Home() {
4+
return (
5+
<main className="flex flex-1 flex-col items-center justify-center px-4 text-center">
6+
<div className="font-sm text-3xl sm:text-3xl md:text-4xl lg:text-5xl xl:text-6xl tracking-tighter leading-tight">
7+
<h1>Revolutionize your grind</h1>
8+
<h1 className="text-[#347BB2]">with superior automation</h1>
9+
</div>
10+
11+
<Link
12+
href="/about"
13+
className="mt-12 rounded-full border-2 border-gray-500 px-8 py-2.5 text-sm font-medium text-gray-400 transition-all duration-300 hover:border-[#347BB2] hover:bg-[#347BB2]/10 hover:text-[#347BB2]"
14+
>
15+
About Us
16+
</Link>
17+
</main>
18+
);
19+
}

‎data/team.ts‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
export const team = [
2+
{
3+
name: "Nathan",
4+
userId: "1441859003708866601",
5+
avatarHash: "46d66bb036a7198accd9c0437fa600e6",
6+
role: "Developer",
7+
},
8+
{
9+
name: "Oblongboot",
10+
userId: "768481984242253904",
11+
avatarHash: "b0c1a947725d21624e88adfac7717bbf",
12+
role: "Developer",
13+
},
14+
{
15+
name: "Twiston",
16+
userId: "855798460593733652",
17+
avatarHash: "b9e840cdf13ef7233be9bbee01ef3c88",
18+
role: "Developer",
19+
},
20+
];
21+
22+
export function getDiscordAvatarUrl(userId: string, avatarHash: string) {
23+
const extension = avatarHash.startsWith('a_') ? 'gif' : 'png';
24+
return `https://cdn.discordapp.com/avatars/${userId}/${avatarHash}.${extension}?size=256`;
25+
}

‎next.config.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,19 @@
1-
import type { NextConfig } from "next";
1+
import type { NextConfig } from 'next';
22

33
const nextConfig: NextConfig = {
44
/**
55
* Enable static exports.
66
*
77
* @see https://nextjs.org/docs/app/building-your-application/deploying/static-exports
88
*/
9-
output: "export",
9+
output: 'export',
1010

1111
/**
1212
* Set base path. This is usually the slug of your repository.
1313
*
1414
* @see https://nextjs.org/docs/app/api-reference/next-config-js/basePath
1515
*/
16-
basePath: "",
16+
basePath: '',
1717

1818
/**
1919
* Disable server-based image optimization. Next.js does not support

0 commit comments

Comments
 (0)