diff --git a/.gitignore b/.gitignore index 91db659..242b94c 100644 --- a/.gitignore +++ b/.gitignore @@ -8,3 +8,5 @@ coverage/ .nx/cache .nx/workspace-data + +demo.old diff --git a/.prettierignore b/.prettierignore index d4ec270..6389fa8 100644 --- a/.prettierignore +++ b/.prettierignore @@ -1,7 +1,5 @@ coverage dist node_modules -.nuxt -.output pnpm-lock.yaml -/.nx/workspace-data \ No newline at end of file +/.nx/workspace-data diff --git a/.prettierrc.mjs b/.prettierrc.mjs index 846a2a4..4cbdcfa 100644 --- a/.prettierrc.mjs +++ b/.prettierrc.mjs @@ -3,6 +3,14 @@ import config from "@lehoczky/prettier-config" /** @type {import("prettier").Options} */ export default { ...config, - plugins: ["prettier-plugin-tailwindcss"], + plugins: ["prettier-plugin-astro", "prettier-plugin-tailwindcss"], tailwindConfig: "./packages/demo/tailwind.config.ts", + overrides: [ + { + files: "*.astro", + options: { + parser: "astro", + }, + }, + ], } diff --git a/.vscode/extensions.json b/.vscode/extensions.json index a03e7df..5e5a692 100644 --- a/.vscode/extensions.json +++ b/.vscode/extensions.json @@ -6,7 +6,7 @@ "esbenp.prettier-vscode", "stylelint.vscode-stylelint", "streetsidesoftware.code-spell-checker", - "bierner.comment-tagged-templates", + "astro-build.astro-vscode", "vitest.explorer" ] } diff --git a/.vscode/settings.json b/.vscode/settings.json index 6631dc0..81f0457 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -6,5 +6,15 @@ }, "css.validate": false, "stylelint.validate": ["css", "vue"], - "cSpell.words": ["octo", "octocat", "postcss", "Shiki", "shikiji", "vueuse"] + "cSpell.words": [ + "astro", + "astrojs", + "clsx", + "octo", + "octocat", + "postcss", + "Shiki", + "shikiji", + "vueuse" + ] } diff --git a/package.json b/package.json index 46b7e53..e355b09 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "postcss": "^8.4.40", "postcss-html": "^1.7.0", "prettier": "^3.3.3", + "prettier-plugin-astro": "^0.14.1", "prettier-plugin-tailwindcss": "^0.5.14", "stylelint": "^16.8.1", "stylelint-config-recommended-vue": "^1.5.0", @@ -24,5 +25,5 @@ "typescript": "~5.4.5" }, "nx": {}, - "packageManager": "pnpm@9.6.0" + "packageManager": "pnpm@9.7.0" } diff --git a/packages/demo/.gitignore b/packages/demo/.gitignore index 438cb08..016b59e 100644 --- a/packages/demo/.gitignore +++ b/packages/demo/.gitignore @@ -1,8 +1,24 @@ -node_modules -*.log* -.nuxt -.nitro -.cache -.output +# build output +dist/ + +# generated types +.astro/ + +# dependencies +node_modules/ + +# logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* + +# environment variables .env -dist +.env.production + +# macOS-specific files +.DS_Store + +# jetbrains setting folder +.idea/ diff --git a/packages/demo/assets/css/main.css b/packages/demo/assets/css/main.css deleted file mode 100644 index c5d229f..0000000 --- a/packages/demo/assets/css/main.css +++ /dev/null @@ -1,21 +0,0 @@ -@tailwind base; -@tailwind components; -@tailwind utilities; - -@layer base { - h1 { - @apply text-4xl sm:text-5xl; - } - - h2 { - @apply mb-6 text-2xl sm:text-3xl; - } -} - -:root { - color-scheme: dark; -} - -.shiki { - @apply overflow-x-auto p-4; -} diff --git a/packages/demo/astro.config.mjs b/packages/demo/astro.config.mjs new file mode 100644 index 0000000..c94b8bb --- /dev/null +++ b/packages/demo/astro.config.mjs @@ -0,0 +1,14 @@ +import tailwind from "@astrojs/tailwind" +import { defineConfig } from "astro/config" + +// https://astro.build/config +export default defineConfig({ + integrations: [ + tailwind({ + applyBaseStyles: false, + }), + ], + devToolbar: { + enabled: false, + }, +}) diff --git a/packages/demo/code-examples.ts b/packages/demo/code-examples.ts deleted file mode 100644 index eb19d41..0000000 --- a/packages/demo/code-examples.ts +++ /dev/null @@ -1,103 +0,0 @@ -export const typography = /*css*/ ` -div { - font-size: fluid(16px, 28px, 480px, 720px); - line-height: fluid(26px, 38px, 480px, 720px); - letter-spacing: fluid(0, 0.6px, 480px, 720px); -} - -/* Compiled output: -div { - font-size: clamp(16px, -8px + 5vw, 28px); - line-height: clamp(26px, 2px + 5vw, 38px); - letter-spacing: clamp(0px, -1.2px + 0.25vw, 0.6px); -} -*/` - -export const growingSquare = /*css*/ ` -div { - width: fluid(50px, 200px, 480px, 720px); - height: fluid(50px, 200px, 480px, 720px); -} - -/* Compiled output: -div { - width: clamp(50px, -250px + 62.5vw, 200px); - height: clamp(50px, -250px + 62.5vw, 200px); -} -*/` - -export const paddedBox = /*css*/ ` -div { - padding: fluid(4px, 40px, 480px, 720px); -} - -/* Compiled output: -div { - padding: clamp(4px, -68px + 15vw, 40px); -} -*/` - -export const positionedBox = /*css*/ ` -div { - position: absolute; - top: fluid(0px, 60px, 480px, 720px); - left: fluid(0px, 60px, 480px, 720px); -} - -/* Compiled output: -div { - position: absolute; - top: clamp(0px, -120px + 25vw, 60px); - left: clamp(0px, -120px + 25vw, 60px); -} -*/` - -export const shrinkingSquare = /*css*/ ` -div { - width: fluid(200px, 50px, 480px, 720px); - height: fluid(200px, 50px, 480px, 720px); -} - -/* Compiled output: -div { - width: clamp(50px, 500px + -62.5vw, 200px); - height: clamp(50px, 500px + -62.5vw, 200px); -} -*/` - -export const boxToCircle = /*css*/ ` -div { - border-radius: fluid(0, 50px, 480px, 720px); -} - -/* Compiled output: -div { - border-radius: clamp(0px, -100px + 20.8333vw, 50px); -} -*/` - -export const fluidGridGap = /*css*/ ` -div { - display: grid; - grid-template-columns: 1fr 1fr; - gap: fluid(0, 30px, 480px, 720px); -} - -/* Compiled output: -div { - display: grid; - grid-template-columns: 1fr 1fr; - gap: clamp(0px, -60px + 12.5vw, 30px); -} -*/` - -export const fluidBorder = /*css*/ ` -div { - border: fluid(10px, 22px, 480px, 720px) solid black; -} - -/* Compiled output: -div { - border: clamp(10px, -14px + 5vw, 22px) solid black; -} -*/` diff --git a/packages/demo/components/CodeBlock.vue b/packages/demo/components/CodeBlock.vue deleted file mode 100644 index 1273f9a..0000000 --- a/packages/demo/components/CodeBlock.vue +++ /dev/null @@ -1,22 +0,0 @@ - - - diff --git a/packages/demo/components/DemoFrame.vue b/packages/demo/components/DemoFrame.vue deleted file mode 100644 index 58752dd..0000000 --- a/packages/demo/components/DemoFrame.vue +++ /dev/null @@ -1,16 +0,0 @@ -