diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 5ceb497..3cc360d 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -28,6 +28,9 @@ module.exports = { parserOptions: { parser: "@typescript-eslint/parser", }, + rules: { + "react/no-unknown-property": "off", + }, }, ], } diff --git a/.prettierrc.cjs b/.prettierrc.cjs new file mode 100644 index 0000000..b3c2157 --- /dev/null +++ b/.prettierrc.cjs @@ -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", + }, + }, + ], +} diff --git a/package.json b/package.json index f82de26..58a359e 100644 --- a/package.json +++ b/package.json @@ -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" + } } diff --git a/packages/website/package.json b/packages/website/package.json index 1e2c54a..cc446e9 100644 --- a/packages/website/package.json +++ b/packages/website/package.json @@ -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", diff --git a/packages/website/src/assets/banner.png b/packages/website/src/assets/banner.png new file mode 100644 index 0000000..17351e4 Binary files /dev/null and b/packages/website/src/assets/banner.png differ diff --git a/packages/website/src/assets/blob-comfy.png b/packages/website/src/assets/blob-comfy.png new file mode 100644 index 0000000..4c09920 Binary files /dev/null and b/packages/website/src/assets/blob-comfy.png differ diff --git a/packages/website/src/assets/cursor-ibeam.png b/packages/website/src/assets/cursor-ibeam.png new file mode 100644 index 0000000..44e5411 Binary files /dev/null and b/packages/website/src/assets/cursor-ibeam.png differ diff --git a/packages/website/src/assets/cursor.png b/packages/website/src/assets/cursor.png new file mode 100644 index 0000000..f097a66 Binary files /dev/null and b/packages/website/src/assets/cursor.png differ diff --git a/packages/website/src/assets/dots-background.svg b/packages/website/src/assets/dots-background.svg new file mode 100644 index 0000000..c041603 --- /dev/null +++ b/packages/website/src/assets/dots-background.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/website/src/assets/favicon.png b/packages/website/src/assets/favicon.png new file mode 100644 index 0000000..09ac92b Binary files /dev/null and b/packages/website/src/assets/favicon.png differ diff --git a/packages/website/src/layout.astro b/packages/website/src/layout.astro new file mode 100644 index 0000000..4566507 --- /dev/null +++ b/packages/website/src/layout.astro @@ -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" +--- + + + + + + + + + + + + + + + + + + + + + + Reacord + + + + + + + diff --git a/packages/website/src/pages/index.astro b/packages/website/src/pages/index.astro index 258cdbb..558befa 100644 --- a/packages/website/src/pages/index.astro +++ b/packages/website/src/pages/index.astro @@ -1 +1,5 @@ -

hi world

+--- +import Layout from "~/layout.astro" +--- + +content! diff --git a/packages/website/src/styles/prism-theme.css b/packages/website/src/styles/prism-theme.css new file mode 100644 index 0000000..45b8096 --- /dev/null +++ b/packages/website/src/styles/prism-theme.css @@ -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; +} diff --git a/packages/website/tailwind.config.cjs b/packages/website/tailwind.config.cjs index d47cfec..900ca9b 100644 --- a/packages/website/tailwind.config.cjs +++ b/packages/website/tailwind.config.cjs @@ -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: { diff --git a/packages/website/tsconfig.json b/packages/website/tsconfig.json index 987c58f..b52814b 100644 --- a/packages/website/tsconfig.json +++ b/packages/website/tsconfig.json @@ -5,7 +5,7 @@ "jsxImportSource": "react", "baseUrl": ".", "paths": { - "~/*": ["./app/*"] + "~/*": ["./src/*"] } }, "include": ["**/*.ts", "**/*.tsx", "**/*.cjs", "**/*.mjs", "**/*.astro"] diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 2087f6b..a98f702 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -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'}