root layout

This commit is contained in:
itsMapleLeaf
2023-03-12 13:36:03 -05:00
parent eb0409f1a2
commit 95041acfd4
16 changed files with 231 additions and 5 deletions

View File

@@ -28,6 +28,9 @@ module.exports = {
parserOptions: {
parser: "@typescript-eslint/parser",
},
rules: {
"react/no-unknown-property": "off",
},
},
],
}

14
.prettierrc.cjs Normal file
View File

@@ -0,0 +1,14 @@
const base = require("@itsmapleleaf/configs/prettier")
module.exports = {
...base,
plugins: [require.resolve("prettier-plugin-astro")],
overrides: [
{
files: "*.astro",
options: {
parser: "astro",
},
},
],
}

View File

@@ -17,10 +17,10 @@
"astro-eslint-parser": "^0.12.0",
"eslint": "^8.36.0",
"prettier": "^2.7.1",
"prettier-plugin-astro": "^0.8.0",
"typescript": "^4.8.4"
},
"resolutions": {
"esbuild": "latest"
},
"prettier": "@itsmapleleaf/configs/prettier"
}
}

View File

@@ -17,6 +17,8 @@
},
"dependencies": {
"@astrojs/react": "^2.1.0",
"@fontsource/jetbrains-mono": "^4.5.12",
"@fontsource/rubik": "^4.5.14",
"@headlessui/react": "^1.6.6",
"@heroicons/react": "^1.0.6",
"@reach/rect": "^0.17.0",

Binary file not shown.

After

Width:  |  Height:  |  Size: 97 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@@ -0,0 +1,3 @@
<svg width="53" height="35" viewBox="0 0 53 35" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="3" cy="3" r="1" fill="white"/>
</svg>

After

Width:  |  Height:  |  Size: 146 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 658 B

View File

@@ -0,0 +1,43 @@
---
import "@fontsource/jetbrains-mono/500.css"
import "@fontsource/rubik/variable.css"
import packageJson from "reacord/package.json"
import bannerUrl from "~/assets/banner.png"
import faviconUrl from "~/assets/favicon.png"
import "~/styles/prism-theme.css"
---
<!DOCTYPE html>
<html lang="en" class="bg-slate-900 text-slate-100">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content={packageJson.description} />
<meta name="theme-color" content="#21754b" />
<meta property="og:url" content="https://reacord.mapleleaf.dev/" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Reacord" />
<meta
property="og:description"
content="Create interactive Discord messages using React"
/>
<meta property="og:image" content={bannerUrl} />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:domain" content="reacord.mapleleaf.dev" />
<meta name="twitter:url" content="https://reacord.mapleleaf.dev/" />
<meta name="twitter:title" content="Reacord" />
<meta
name="twitter:description"
content="Create interactive Discord messages using React"
/>
<meta name="twitter:image" content={bannerUrl} />
<title>Reacord</title>
<link rel="icon" href={faviconUrl} />
</head>
<body>
<slot />
</body>
</html>

View File

@@ -1 +1,5 @@
<h1>hi world</h1>
---
import Layout from "~/layout.astro"
---
<Layout>content!</Layout>

View File

@@ -0,0 +1,133 @@
/**
* Nord Theme Originally by Arctic Ice Studio
* https://nordtheme.com
*
* Ported for PrismJS by Zane Hitchcoxc (@zwhitchcox) and Gabriel Ramos (@gabrieluizramos)
*/
code[class*="language-"],
pre[class*="language-"] {
color: #f8f8f2;
background: none;
/* font-family: "Fira Code", Consolas, Monaco, "Andale Mono", "Ubuntu Mono",
monospace; */
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.7;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
/* Code blocks */
pre[class*="language-"] {
padding: 1em;
margin: 0.5em 0;
overflow: auto;
border-radius: 0.3em;
}
:not(pre) > code[class*="language-"],
pre[class*="language-"] {
/* background: #2e3440; */
background: rgba(0, 0, 0, 0.3);
}
/* Inline code */
:not(pre) > code[class*="language-"] {
padding: 0.1em;
border-radius: 0.3em;
white-space: normal;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: #636f88;
}
.token.punctuation {
color: #81a1c1;
}
.namespace {
opacity: 0.7;
}
.token.property,
.token.tag,
.token.constant,
.token.symbol,
.token.deleted {
color: #81a1c1;
}
.token.number {
color: #b48ead;
}
.token.boolean {
color: #81a1c1;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
color: #a3be8c;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string,
.token.variable {
color: #81a1c1;
}
.token.atrule,
.token.attr-value,
.token.function,
.token.class-name {
color: #88c0d0;
}
.token.keyword {
color: #81a1c1;
}
.token.regex,
.token.important {
color: #ebcb8b;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}
.code-line.highlight-line {
background-color: rgba(255, 255, 255, 0.08);
padding: 0 1rem;
margin: 0 -1rem;
display: block;
}

View File

@@ -3,7 +3,7 @@ module.exports = {
content: ["./app/**/*.{ts,tsx,md}"],
theme: {
fontFamily: {
sans: ["Rubik", "sans-serif"],
sans: ["RubikVariable", "sans-serif"],
monospace: ["'JetBrains Mono'", "monospace"],
},
boxShadow: {

View File

@@ -5,7 +5,7 @@
"jsxImportSource": "react",
"baseUrl": ".",
"paths": {
"~/*": ["./app/*"]
"~/*": ["./src/*"]
}
},
"include": ["**/*.ts", "**/*.tsx", "**/*.cjs", "**/*.mjs", "**/*.astro"]

24
pnpm-lock.yaml generated
View File

@@ -14,6 +14,7 @@ importers:
astro-eslint-parser: ^0.12.0
eslint: ^8.36.0
prettier: ^2.7.1
prettier-plugin-astro: ^0.8.0
typescript: ^4.8.4
devDependencies:
'@changesets/cli': 2.25.0
@@ -23,6 +24,7 @@ importers:
astro-eslint-parser: 0.12.0
eslint: 8.36.0
prettier: 2.7.1
prettier-plugin-astro: 0.8.0
typescript: 4.8.4
packages/helpers:
@@ -86,6 +88,8 @@ importers:
specifiers:
'@astrojs/react': ^2.1.0
'@astrojs/tailwind': ^3.1.0
'@fontsource/jetbrains-mono': ^4.5.12
'@fontsource/rubik': ^4.5.14
'@headlessui/react': ^1.6.6
'@heroicons/react': ^1.0.6
'@reach/rect': ^0.17.0
@@ -124,6 +128,8 @@ importers:
zod: ^3.17.10
dependencies:
'@astrojs/react': 2.1.0_v7vsrdtui4d36prbwvdnlb7tpq
'@fontsource/jetbrains-mono': 4.5.12
'@fontsource/rubik': 4.5.14
'@headlessui/react': 1.6.6_biqbaboplfbrettd7655fr4n2y
'@heroicons/react': 1.0.6_react@18.2.0
'@reach/rect': 0.17.0_biqbaboplfbrettd7655fr4n2y
@@ -2078,6 +2084,14 @@ packages:
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
dev: true
/@fontsource/jetbrains-mono/4.5.12:
resolution: {integrity: sha512-LJF1ala1/u+wXZmESFqIk08FA9yGX4/uAAleCHmXUMgEjvNAYFHUQQ7eK5hQQoBOwh99cU5suTrqYqEkgzwzPA==}
dev: false
/@fontsource/rubik/4.5.14:
resolution: {integrity: sha512-EvMK3kkeAgKkk8qAeT4PjpyAYyu72pIlJm+SXJ5vR/xhCX2yj2xoq3+YS38rPmPcCAnrAVONoQ3ezLxVm6jhBA==}
dev: false
/@gar/promisify/1.1.3:
resolution: {integrity: sha512-k2Ty1JcVojjJFwrg/ThKi2ujJ7XNLYaFGNB/bWT9wGR+oSMJHMa5w+CUq6p/pVrKeNNgA7pCqEcjSnHVoqJQFw==}
dev: true
@@ -9071,6 +9085,16 @@ packages:
sass-formatter: 0.7.6
synckit: 0.8.5
/prettier-plugin-astro/0.8.0:
resolution: {integrity: sha512-kt9wk33J7HvFGwFaHb8piwy4zbUmabC8Nu+qCw493jhe96YkpjscqGBPy4nJ9TPy9pd7+kEx1zM81rp+MIdrXg==}
engines: {node: ^14.15.0 || >=16.0.0, pnpm: '>=7.14.0'}
dependencies:
'@astrojs/compiler': 1.2.0
prettier: 2.8.4
sass-formatter: 0.7.6
synckit: 0.8.5
dev: true
/prettier/2.7.1:
resolution: {integrity: sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g==}
engines: {node: '>=10.13.0'}