mirror of
https://github.com/jaronpate/unicord.git
synced 2026-10-18 21:47:40 +00:00
Website init
This commit is contained in:
@@ -0,0 +1,36 @@
|
||||
This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
|
||||
|
||||
## Getting Started
|
||||
|
||||
First, run the development server:
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
# or
|
||||
yarn dev
|
||||
# or
|
||||
pnpm dev
|
||||
# or
|
||||
bun dev
|
||||
```
|
||||
|
||||
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
||||
|
||||
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
|
||||
|
||||
This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
|
||||
|
||||
## Learn More
|
||||
|
||||
To learn more about Next.js, take a look at the following resources:
|
||||
|
||||
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
|
||||
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
|
||||
|
||||
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
|
||||
|
||||
## Deploy on Vercel
|
||||
|
||||
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
|
||||
|
||||
Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
|
||||
Vendored
+5
@@ -0,0 +1,5 @@
|
||||
/// <reference types="next" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
|
||||
@@ -0,0 +1,7 @@
|
||||
import type { NextConfig } from "next";
|
||||
|
||||
const nextConfig: NextConfig = {
|
||||
/* config options here */
|
||||
};
|
||||
|
||||
export default nextConfig;
|
||||
Generated
+1153
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,23 @@
|
||||
{
|
||||
"name": "unicord-website",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev --turbopack",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^19.0.0",
|
||||
"react-dom": "^19.0.0",
|
||||
"next": "15.1.7",
|
||||
"react-syntax-highlighter": "^15.4.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"typescript": "^5",
|
||||
"@types/node": "^20",
|
||||
"@types/react": "^19",
|
||||
"@types/react-dom": "^19"
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1012 KiB |
@@ -0,0 +1,32 @@
|
||||
|
||||
:root {
|
||||
--background: #252525;
|
||||
--foreground: #ededed;
|
||||
}
|
||||
|
||||
|
||||
html,
|
||||
body {
|
||||
max-width: 100vw;
|
||||
overflow-x: hidden;
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
body {
|
||||
color: var(--foreground);
|
||||
background: var(--background);
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Space_Grotesk, Space_Mono } from "next/font/google";
|
||||
import "./globals.css";
|
||||
|
||||
const spaceGrotesk = Space_Grotesk({
|
||||
variable: "--font-space-grotesk",
|
||||
subsets: ["latin"]
|
||||
});
|
||||
|
||||
const spaceMono = Space_Mono({
|
||||
variable: "--font-space-mono",
|
||||
subsets: ["latin"],
|
||||
weight: ["400"]
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Create Next App",
|
||||
description: "Generated by create next app",
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body className={`${spaceGrotesk.variable} ${spaceMono.variable}`}>
|
||||
{children}
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,148 @@
|
||||
.page {
|
||||
--gray-rgb: 255, 255, 255;
|
||||
--gray-alpha-200: rgba(var(--gray-rgb), 0.145);
|
||||
--gray-alpha-100: rgba(var(--gray-rgb), 0.06);
|
||||
|
||||
--button-primary-hover: #ccc;
|
||||
--button-secondary-hover: #1a1a1a;
|
||||
|
||||
font-family: var(--font-space-grotesk);
|
||||
}
|
||||
|
||||
/* pag with header needs margin atop */
|
||||
.pageWithHeader {
|
||||
margin-top: 4rem;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.7rem;
|
||||
/* glassy background */
|
||||
background: transparent;
|
||||
backdrop-filter: blur(16px);
|
||||
border-bottom: 1px solid var(--gray-alpha-200);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.header img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.logoMark {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0px;
|
||||
font-size: 32px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.logoMarkSpan {
|
||||
color: #ff0080;
|
||||
}
|
||||
|
||||
.main {
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
/* padding: 4rem 0em; */
|
||||
}
|
||||
|
||||
@keyframes dotPattern {
|
||||
0% {
|
||||
background-position: top right;
|
||||
}
|
||||
100% {
|
||||
background-position: bottom left;
|
||||
}
|
||||
}
|
||||
|
||||
.hero {
|
||||
padding: 0 15em 0;
|
||||
height: calc(100vh - 4rem);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid var(--gray-alpha-200);
|
||||
}
|
||||
|
||||
.hero::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background-image: radial-gradient(circle, #ff0080 1px, transparent 1px);
|
||||
background-size: 20px 20px;
|
||||
animation: dotPattern 30s linear infinite;
|
||||
opacity: 0.5;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.hero::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 50%;
|
||||
background: linear-gradient(to bottom, transparent, var(--gray-alpha-100));
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.code {
|
||||
font-family: var(--font-mono);
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.codeBlock {
|
||||
background: var(--gray-alpha-100);
|
||||
padding: 1em;
|
||||
border-radius: 0.5em;
|
||||
}
|
||||
|
||||
.codeBlock pre {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.codeBlock code {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.codeBlock code::before {
|
||||
content: "";
|
||||
}
|
||||
|
||||
.codeBlock code::after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
.codeBlock code:hover {
|
||||
background: var(--gray-alpha-200);
|
||||
}
|
||||
|
||||
.codeBlock code:active {
|
||||
background: var(--gray-alpha-200);
|
||||
}
|
||||
|
||||
.codeBlock code:focus {
|
||||
background: var(--gray-alpha-200);
|
||||
}
|
||||
|
||||
.codeBlock code:focus-visible {
|
||||
background: var(--gray-alpha-200);
|
||||
}
|
||||
|
||||
.codeBlock code:focus-within {
|
||||
background: var(--gray-alpha-200);
|
||||
}
|
||||
@@ -0,0 +1,79 @@
|
||||
import styles from "./page.module.css";
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className={[styles.page, styles.pageWithHeader].join(" ")}>
|
||||
<header className={styles.header}>
|
||||
<div className={styles.logoMark}>
|
||||
<img src="/unicord.png"></img>
|
||||
<div><span className={styles.logoMarkSpan}>uni</span>cord</div>
|
||||
</div>
|
||||
</header>
|
||||
<main className={styles.main}>
|
||||
<div className={styles.hero}>
|
||||
<div>
|
||||
<h1 className={styles.title}>
|
||||
Welcome to <span className={styles.logoMarkSpan}>uni</span>cord
|
||||
</h1>
|
||||
<p className={styles.description}>
|
||||
Finally a simpler way to build Discord bots.{" "}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<code className={styles.code}>
|
||||
<pre className={styles.codeBlock}>
|
||||
{`\
|
||||
import { Client, type Context } from 'unicord';
|
||||
|
||||
// Initialize and configure
|
||||
const client = new Client({
|
||||
token: '<token>',
|
||||
application_id: '<application_id>',
|
||||
intents: [
|
||||
Intent.GUILDS,
|
||||
Intent.GUILD_MESSAGES,
|
||||
Intent.GUILD_MESSAGE_REACTIONS,
|
||||
Intent.MESSAGE_CONTENT
|
||||
],
|
||||
prefix: '??'
|
||||
});
|
||||
|
||||
// Register a command
|
||||
client.chatCommands.register('ping', (context: Context, args) => {
|
||||
context.reply('Pong!', true);
|
||||
});
|
||||
|
||||
// Connect
|
||||
client.connect();
|
||||
`}
|
||||
</pre>
|
||||
</code>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h2 className={styles.title}>Features</h2>
|
||||
<ul className={styles.features}>
|
||||
<li>TypeScript support</li>
|
||||
<li>Intuitive API</li>
|
||||
<li>Powerful command system</li>
|
||||
<li>Built-in event handling</li>
|
||||
<li>Easy to use</li>
|
||||
</ul>
|
||||
<h2 className={styles.title}>Get Started</h2>
|
||||
<p className={styles.description}>
|
||||
To get started, check out the{" "}
|
||||
<a href="https://unicord.dev" target="_blank">
|
||||
<span className={styles.link}>documentation</span>
|
||||
</a>{" "}
|
||||
or join our{" "}
|
||||
<a href="https://discord.gg/9v6Z4J5q" target="_blank">
|
||||
<span className={styles.link}>Discord server</span>
|
||||
</a>{" "}
|
||||
for help and support.
|
||||
</p>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,27 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2017",
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
"strict": true,
|
||||
"noEmit": true,
|
||||
"esModuleInterop": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "bundler",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"jsx": "preserve",
|
||||
"incremental": true,
|
||||
"plugins": [
|
||||
{
|
||||
"name": "next"
|
||||
}
|
||||
],
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
},
|
||||
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
Reference in New Issue
Block a user