docs(example): fix vite-svelte-postcss example (#2701)

unocss · Jun 2, 2023 · 5c9fc99 · 5c9fc99
1 parent 867fb2a
commit 5c9fc99
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 7 deletions.
diff --git a/docs/guide/index.md b/docs/guide/index.md
@@ -137,7 +137,7 @@ Source code for all the examples can be found in the [/examples](https://github.
 | `vite-react` | [GitHub](https://github.com/unocss/unocss/tree/main/examples/vite-react) | [Play Online](https://stackblitz.com/fork/github/unocss/unocss/tree/main/examples/vite-react) |
 | `vite-solid` | [GitHub](https://github.com/unocss/unocss/tree/main/examples/vite-solid) | [Play Online](https://stackblitz.com/fork/github/unocss/unocss/tree/main/examples/vite-solid) |
 | `vite-svelte` | [GitHub](https://github.com/unocss/unocss/tree/main/examples/vite-svelte) | [Play Online](https://stackblitz.com/fork/github/unocss/unocss/tree/main/examples/vite-svelte) |
-| `vite-svelte-postcss` | [GitHub](https://github.com/unocss/unocss/tree/main/examples/vite-svelte-postcss) |
+| `vite-svelte-postcss` | [GitHub](https://github.com/unocss/unocss/tree/main/examples/vite-svelte-postcss) | [Play Online](https://stackblitz.com/fork/github/unocss/unocss/tree/main/examples/vite-svelte-postcss) |
 | `vite-vue3` | [GitHub](https://github.com/unocss/unocss/tree/main/examples/vite-vue3) | [Play Online](https://stackblitz.com/fork/github/unocss/unocss/tree/main/examples/vite-vue3) |
 | `vite-vue3-postcss` | [GitHub](https://github.com/unocss/unocss/tree/main/examples/vite-vue3-postcss) | [Play Online](https://stackblitz.com/fork/github/unocss/unocss/tree/main/examples/vite-vue3-postcss) |
 | `vite-watch-mode` | [GitHub](https://github.com/unocss/unocss/tree/main/examples/vite-watch-mode) | [Play Online](https://stackblitz.com/fork/github/unocss/unocss/tree/main/examples/vite-watch-mode?view=editor) |

diff --git a/examples/vite-svelte-postcss/src/App.svelte b/examples/vite-svelte-postcss/src/App.svelte
@@ -1,7 +1,7 @@
 <div text-center font-sans p4 flex flex-col items-center gap-8>
   <div class="flex gap-4">
-    <div class="i-logos-svelte-icon text-3xl" />
     <div class="i-logos-unocss text-3xl" />
+    <div class="i-logos-svelte-icon text-3xl" />
     <div class="i-logos-postcss text-3xl" />
   </div>
   <div text-gray2 text-2xl font-medium>
@@ -22,10 +22,8 @@
 </div>
 
 <style lang="postcss">
-@screen md {
-  .my-class {
-    @apply bg-red-800;
-    color: theme('colors.red.300');
-  }
+.my-class {
+  @apply bg-red-800 p-2 rounded;
+  color: theme('colors.red.200');
 }
 </style>