summaryrefslogtreecommitdiff
path: root/examples/snowpack/src/pages/guides/tailwind-css.md
diff options
context:
space:
mode:
authorGravatar Fred K. Schott <fkschott@gmail.com> 2021-09-16 08:06:22 -0700
committerGravatar GitHub <noreply@github.com> 2021-09-16 08:06:22 -0700
commitcb7a957f413a9af0651266769b5a6a4a9996aafa (patch)
tree98aa0dbd5d19c8cc7787bf79c54f4dc1264e4636 /examples/snowpack/src/pages/guides/tailwind-css.md
parentc4634e5ea6f2c0e86216251831525497c9821daa (diff)
downloadastro-cb7a957f413a9af0651266769b5a6a4a9996aafa.tar.gz
astro-cb7a957f413a9af0651266769b5a6a4a9996aafa.tar.zst
astro-cb7a957f413a9af0651266769b5a6a4a9996aafa.zip
update examples for stackblitz (#1379)
Diffstat (limited to 'examples/snowpack/src/pages/guides/tailwind-css.md')
-rw-r--r--examples/snowpack/src/pages/guides/tailwind-css.md57
1 files changed, 0 insertions, 57 deletions
diff --git a/examples/snowpack/src/pages/guides/tailwind-css.md b/examples/snowpack/src/pages/guides/tailwind-css.md
deleted file mode 100644
index a0643b69e..000000000
--- a/examples/snowpack/src/pages/guides/tailwind-css.md
+++ /dev/null
@@ -1,57 +0,0 @@
----
-layout: ../../layouts/content.astro
-title: 'Tailwind CSS'
-tags: communityGuide
-published: true
-img: '/img/logos/tailwind.svg'
-imgBackground: '#f2f8f8'
-description: How to use Tailwind CSS with Snowpack.
----
-
-[Tailwind](https://tailwindcss.com) is a popular class-based CSS utility library.
-
-### Using Tailwind with Native CSS
-
-The easiest way to use Tailwind is via native CSS `@import` _or_ JS `import`.
-
-```css
-/* index.css */
-@import 'tailwindcss/dist/tailwind.css';
-```
-
-```js
-/* index.js */
-import 'tailwindcss/dist/tailwind.css';
-```
-
-This imports Tailwind's full CSS build into your application. This simple usage comes at the cost of performance: Tailwind's full CSS build is 3.5+ MB of CSS. For any serious production use, the Tailwind team **strongly** recommends using [PostCSS](https://postcss.org/).
-
-#### Using Tailwind with PostCSS
-
-Follow our [PostCSS guide](/guides/postcss) to set up PostCSS in your Snowpack project. Then, add Tailwind and autoprefixer as plugins to your `postcss.config.js`:
-
-```js
-// postcss.config.js
-// Taken from: https://tailwindcss.com/docs/installation#using-tailwind-with-postcss
-module.exports = {
- plugins: [
- // ...
- require('tailwindcss'),
- require('autoprefixer'),
- // ...
- ],
-};
-```
-
-Once the plugin is enabled, you can replace your native CSS `dist` imports with Tailwind's more powerful `base`, `components`, and `utilities` imports:
-
-```diff
-/* index.css */
-- @import 'tailwindcss/dist/tailwind.css';
-+ @tailwind base;
-+ @tailwind components;
-+ @tailwind utilities;
-
-```
-
-Follow the official [Tailwind CSS Docs](https://tailwindcss.com/docs/installation/#using-tailwind-with-postcss) for more information.