diff --git a/.prettierrc.cjs b/.prettierrc.cjs new file mode 100644 index 0000000..7772ceb --- /dev/null +++ b/.prettierrc.cjs @@ -0,0 +1,14 @@ +module.exports = { + plugins: [ + require.resolve("prettier-plugin-astro"), + require.resolve("prettier-plugin-tailwindcss"), + ], + overrides: [ + { + files: "*.astro", + options: { + parser: "astro", + }, + }, + ], +}; diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..d3b317b --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,6 @@ +{ + "prettier.documentSelectors": ["**/*.astro"], + "[astro]": { + "editor.defaultFormatter": "esbenp.prettier-vscode" + } +} diff --git a/README.md b/README.md index 961e54e..970bfb6 100644 --- a/README.md +++ b/README.md @@ -12,7 +12,6 @@ npm create astro@latest -- --template basics ![basics](https://user-images.githubusercontent.com/4677417/186188965-73453154-fdec-4d6b-9c34-cb35c248ae5b.png) - ## 🚀 Project Structure Inside of your Astro project, you'll see the following folders and files: diff --git a/astro.config.mjs b/astro.config.mjs index f6f2d14..51831af 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -1,9 +1,9 @@ -import { defineConfig } from 'astro/config'; +import { defineConfig } from "astro/config"; import tailwind from "@astrojs/tailwind"; import critters from "astro-critters"; // https://astro.build/config export default defineConfig({ - integrations: [tailwind(), critters({ critters: { preload: "swap" } })] -}); \ No newline at end of file + integrations: [tailwind(), critters({ critters: { preload: "swap" } })], +}); diff --git a/package.json b/package.json index 27de702..add0785 100644 --- a/package.json +++ b/package.json @@ -15,5 +15,10 @@ "astro": "^2.3.0", "astro-critters": "^1.1.31", "tailwindcss": "^3.0.24" + }, + "devDependencies": { + "prettier": "^2.8.7", + "prettier-plugin-astro": "^0.8.0", + "prettier-plugin-tailwindcss": "^0.2.7" } -} \ No newline at end of file +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 015570e..d33886d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -5,6 +5,9 @@ specifiers: '@tailwindcss/forms': ^0.5.3 astro: ^2.3.0 astro-critters: ^1.1.31 + prettier: ^2.8.7 + prettier-plugin-astro: ^0.8.0 + prettier-plugin-tailwindcss: ^0.2.7 tailwindcss: ^3.0.24 dependencies: @@ -14,6 +17,11 @@ dependencies: astro-critters: 1.1.31 tailwindcss: 3.3.1 +devDependencies: + prettier: 2.8.7 + prettier-plugin-astro: 0.8.0 + prettier-plugin-tailwindcss: 0.2.7_kb4gmvngxncp3puqxt3b6slppy + packages: /@ampproject/remapping/2.2.1: @@ -30,7 +38,6 @@ packages: /@astrojs/compiler/1.3.1: resolution: {integrity: sha512-xV/3r+Hrfpr4ECfJjRjeaMkJvU73KiOADowHjhkqidfNPVAWPzbqw1KePXuMK1TjzMvoAVE7E163oqfH3lDwSw==} - dev: false /@astrojs/language-server/0.28.3: resolution: {integrity: sha512-fPovAX/X46eE2w03jNRMpQ7W9m2mAvNt4Ay65lD9wl1Z5vIQYxlg7Enp9qP225muTr4jSVB5QiLumFJmZMAaVA==} @@ -632,7 +639,6 @@ packages: picocolors: 1.0.0 tiny-glob: 0.2.9 tslib: 2.5.0 - dev: false /@proload/core/0.3.3: resolution: {integrity: sha512-7dAFWsIK84C90AMl24+N/ProHKm4iw0akcnoKjRvbfHifJZBLhaDsDus1QJmhG12lXj4e/uB/8mB/0aduCW+NQ==} @@ -1149,7 +1155,6 @@ packages: path-key: 3.1.1 shebang-command: 2.0.0 which: 2.0.2 - dev: false /css-select/4.3.0: resolution: {integrity: sha512-wPpOYtnsVontu2mODhA19JrqWxNsfdatRKd64kmpRbQgh1KtItko5sTnEpPdpSaJszTOhEMlF/RPz28qj4HqhQ==} @@ -1209,7 +1214,6 @@ packages: /define-lazy-prop/2.0.0: resolution: {integrity: sha512-Ds09qNh8yw3khSjiJjiUInaGX9xlqZDY7JVryGxdxV7NPeuqQfplOpQ66yJFZut3jLa5zOwkXw1g9EI2uKh4Og==} engines: {node: '>=8'} - dev: false /dequal/2.0.3: resolution: {integrity: sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==} @@ -1508,11 +1512,9 @@ packages: /globalyzer/0.1.0: resolution: {integrity: sha512-40oNTM9UfG6aBmuKxk/giHn5nQ8RVz/SS4Ir6zgzOv9/qC3kKZ9v4etGTcJbEl/NyVQH7FGU7d+X1egr57Md2Q==} - dev: false /globrex/0.1.2: resolution: {integrity: sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg==} - dev: false /graceful-fs/4.2.11: resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==} @@ -1680,7 +1682,6 @@ packages: resolution: {integrity: sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==} engines: {node: '>=8'} hasBin: true - dev: false /is-docker/3.0.0: resolution: {integrity: sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==} @@ -1696,7 +1697,6 @@ packages: /is-extglob/2.1.1: resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==} engines: {node: '>=0.10.0'} - dev: false /is-fullwidth-code-point/3.0.0: resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==} @@ -1708,7 +1708,6 @@ packages: engines: {node: '>=0.10.0'} dependencies: is-extglob: 2.1.1 - dev: false /is-interactive/2.0.0: resolution: {integrity: sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==} @@ -1740,11 +1739,9 @@ packages: engines: {node: '>=8'} dependencies: is-docker: 2.2.1 - dev: false /isexe/2.0.0: resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==} - dev: false /jiti/1.18.2: resolution: {integrity: sha512-QAdOptna2NYiSSpv0O/BwoHBSmz4YhpzJHyi+fnMRTXFjp7B8i/YG5Z8IfusxB1ufjcD2Sre1F3R+nX3fvy7gg==} @@ -2384,7 +2381,6 @@ packages: define-lazy-prop: 2.0.0 is-docker: 2.2.1 is-wsl: 2.2.0 - dev: false /ora/6.3.0: resolution: {integrity: sha512-1/D8uRFY0ay2kgBpmAwmSA404w4OoPVhHMqRqtjvrcK/dnzcEZxMJ+V4DUbyICu8IIVRclHcOf5wlD1tMY4GUQ==} @@ -2465,7 +2461,6 @@ packages: /path-key/3.1.1: resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==} engines: {node: '>=8'} - dev: false /path-key/4.0.0: resolution: {integrity: sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ==} @@ -2482,7 +2477,6 @@ packages: /picocolors/1.0.0: resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==} - dev: false /picomatch/2.3.1: resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==} @@ -2618,11 +2612,76 @@ packages: synckit: 0.8.5 dev: false + /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.3.1 + prettier: 2.8.7 + sass-formatter: 0.7.6 + synckit: 0.8.5 + dev: true + + /prettier-plugin-tailwindcss/0.2.7_kb4gmvngxncp3puqxt3b6slppy: + resolution: {integrity: sha512-jQopIOgjLpX+y8HeD56XZw7onupRTC0cw7eKKUimI7vhjkPF5/1ltW5LyqaPtSyc8HvEpvNZsvvsGFa2qpa59w==} + engines: {node: '>=12.17.0'} + peerDependencies: + '@ianvs/prettier-plugin-sort-imports': '*' + '@prettier/plugin-php': '*' + '@prettier/plugin-pug': '*' + '@shopify/prettier-plugin-liquid': '*' + '@shufo/prettier-plugin-blade': '*' + '@trivago/prettier-plugin-sort-imports': '*' + prettier: '>=2.2.0' + prettier-plugin-astro: '*' + prettier-plugin-css-order: '*' + prettier-plugin-import-sort: '*' + prettier-plugin-jsdoc: '*' + prettier-plugin-organize-attributes: '*' + prettier-plugin-organize-imports: '*' + prettier-plugin-style-order: '*' + prettier-plugin-svelte: '*' + prettier-plugin-twig-melody: '*' + peerDependenciesMeta: + '@ianvs/prettier-plugin-sort-imports': + optional: true + '@prettier/plugin-php': + optional: true + '@prettier/plugin-pug': + optional: true + '@shopify/prettier-plugin-liquid': + optional: true + '@shufo/prettier-plugin-blade': + optional: true + '@trivago/prettier-plugin-sort-imports': + optional: true + prettier-plugin-astro: + optional: true + prettier-plugin-css-order: + optional: true + prettier-plugin-import-sort: + optional: true + prettier-plugin-jsdoc: + optional: true + prettier-plugin-organize-attributes: + optional: true + prettier-plugin-organize-imports: + optional: true + prettier-plugin-style-order: + optional: true + prettier-plugin-svelte: + optional: true + prettier-plugin-twig-melody: + optional: true + dependencies: + prettier: 2.8.7 + prettier-plugin-astro: 0.8.0 + dev: true + /prettier/2.8.7: resolution: {integrity: sha512-yPngTo3aXUUmyuTjeTUT75txrf+aMh9FiD7q9ZE/i6r0bPb22g4FsE6Y338PQX1bmfy08i9QQCB7/rcUAVntfw==} engines: {node: '>=10.13.0'} hasBin: true - dev: false /pretty-bytes/5.6.0: resolution: {integrity: sha512-FFw039TmrBqFK8ma/7OL3sDz/VytdtJr044/QUJtH0wK9lb9jLq9tJyIxUwtQJHwar2BqtiA4iCWSwo9JLkzFg==} @@ -2823,7 +2882,6 @@ packages: /s.color/0.0.15: resolution: {integrity: sha512-AUNrbEUHeKY8XsYr/DYpl+qk5+aM+DChopnWOPEzn8YKzOhv4l2zH6LzZms3tOZP3wwdOyc0RmTciyi46HLIuA==} - dev: false /sade/1.8.1: resolution: {integrity: sha512-xal3CZX1Xlo/k4ApwCFrHVACi9fBqJ7V+mwhBsuf/1IOKbBy098Fex+Wa/5QMubw09pSZ/u8EY8PWgevJsXp1A==} @@ -2840,7 +2898,6 @@ packages: resolution: {integrity: sha512-hXdxU6PCkiV3XAiSnX+XLqz2ohHoEnVUlrd8LEVMAI80uB1+OTScIkH9n6qQwImZpTye1r1WG1rbGUteHNhoHg==} dependencies: suf-log: 2.5.3 - dev: false /section-matter/1.0.0: resolution: {integrity: sha512-vfD3pmTzGpufjScBh50YHKzEu2lxBWhVEHsNGoEXmCmn2hKGfeNLYMzCJpe8cD7gqX7TJluOVpBkAequ6dgMmA==} @@ -2872,12 +2929,10 @@ packages: engines: {node: '>=8'} dependencies: shebang-regex: 3.0.0 - dev: false /shebang-regex/3.0.0: resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==} engines: {node: '>=8'} - dev: false /shiki/0.11.1: resolution: {integrity: sha512-EugY9VASFuDqOexOgXR18ZV+TbFrQHeCpEYaXamO+SZlsnT/2LxuLBX25GGtIrwaEVFXUAbUQ601SWE2rMwWHA==} @@ -3013,7 +3068,6 @@ packages: resolution: {integrity: sha512-KvC8OPjzdNOe+xQ4XWJV2whQA0aM1kGVczMQ8+dStAO6KfEB140JEVQ9dE76ONZ0/Ylf67ni4tILPJB41U0eow==} dependencies: s.color: 0.0.15 - dev: false /supports-color/5.5.0: resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==} @@ -3046,7 +3100,6 @@ packages: dependencies: '@pkgr/utils': 2.3.1 tslib: 2.5.0 - dev: false /tailwindcss/3.3.1: resolution: {integrity: sha512-Vkiouc41d4CEq0ujXl6oiGFQ7bA3WEhUZdTgXAhtKxSy49OmKs8rEfQmupsfF0IGW8fv2iQkp1EVUuapCFrZ9g==} @@ -3099,7 +3152,6 @@ packages: dependencies: globalyzer: 0.1.0 globrex: 0.1.2 - dev: false /to-fast-properties/2.0.0: resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==} @@ -3138,7 +3190,6 @@ packages: /tslib/2.5.0: resolution: {integrity: sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==} - dev: false /type-fest/0.13.1: resolution: {integrity: sha512-34R7HTnG0XIJcBSn5XhDd7nNFPRcXYRZrBB2O2jdKqYODldSzBAqzsWoZYYvduky73toYS/ESqxPvkDf/F0XMg==} @@ -3419,7 +3470,6 @@ packages: hasBin: true dependencies: isexe: 2.0.0 - dev: false /widest-line/4.0.1: resolution: {integrity: sha512-o0cyEG0e8GPzT4iGHphIOh0cJOV8fivsXxddQasHPHfoZf1ZexrfeA21w2NaEN1RHE+fXlfISmOE8R9N3u3Qig==} diff --git a/src/components/center-xy.astro b/src/components/center-xy.astro new file mode 100644 index 0000000..890aa5a --- /dev/null +++ b/src/components/center-xy.astro @@ -0,0 +1,8 @@ +--- +--- + +
+
+ +
+
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 7465533..f64bdf6 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -1,6 +1,6 @@ --- export interface Props { - title: string; + title: string; } const { title } = Astro.props; @@ -8,14 +8,14 @@ const { title } = Astro.props; - - - - - - {title} - - - - + + + + + + {title} + + + + diff --git a/src/pages/delete.astro b/src/pages/delete.astro index c0e4030..a016fde 100644 --- a/src/pages/delete.astro +++ b/src/pages/delete.astro @@ -1,32 +1,29 @@ --- import Layout from "../layouts/Layout.astro"; +import CenterXy from "../components/center-xy.astro"; import "../styles/global.css"; --- -
-
-
- - - -
-
-
+ +
+ + + +
+ diff --git a/src/pages/index.astro b/src/pages/index.astro index aa504eb..0467dd1 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -1,16 +1,15 @@ --- import Layout from "../layouts/Layout.astro"; import "../styles/global.css"; +import CenterXy from "../components/center-xy.astro"; --- -
-
-

What would you like to do?

-
- Submit a key - Delete a key -
-
+ +

What would you like to do?

+
+ Submit a key + Delete a key
+ diff --git a/src/pages/submit.astro b/src/pages/submit.astro index a9fd49a..fdf0588 100644 --- a/src/pages/submit.astro +++ b/src/pages/submit.astro @@ -1,31 +1,28 @@ --- import Layout from "../layouts/Layout.astro"; import "../styles/global.css"; +import CenterXy from "../components/center-xy.astro"; --- -
-
-
- - - -
-
-
+ +
+ + + +
+ diff --git a/src/styles/global.css b/src/styles/global.css index d35dd7a..21c611b 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -1,15 +1,23 @@ -.button { - @apply bg-teal-50; - @apply p-4; - @apply hover:drop-shadow-md; - @apply hover:rounded-lg; +.input { + @apply focus:rounded-lg; + @apply dark:bg-neutral-800; } -.round, .button { - @apply border-black; - @apply border; - @apply rounded-tr-lg; - @apply rounded-bl-lg; - @apply transition-all; -} \ No newline at end of file + @apply bg-slate-200; + @apply p-4; + @apply hover:rounded-lg; + @apply hover:drop-shadow-md; + @apply dark:bg-slate-700; +} + +.input, +.button { + @apply rounded-bl-lg; + @apply rounded-tr-lg; + @apply border; + @apply border-black; + @apply transition-all; + @apply duration-300; + @apply dark:border-neutral-300; +} diff --git a/tailwind.config.cjs b/tailwind.config.cjs index 88b4649..ce0a0a3 100644 --- a/tailwind.config.cjs +++ b/tailwind.config.cjs @@ -1,10 +1,8 @@ /** @type {import('tailwindcss').Config} */ module.exports = { - content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'], - theme: { - extend: {}, - }, - plugins: [ - require('@tailwindcss/forms'), - ], -} + content: ["./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}"], + theme: { + extend: {}, + }, + plugins: [require("@tailwindcss/forms")], +}; diff --git a/tsconfig.json b/tsconfig.json index 77da9dd..bcbf8b5 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,3 +1,3 @@ { "extends": "astro/tsconfigs/strict" -} \ No newline at end of file +}