docs: remove unnecessary files and add basic demo

Removed the unused file `docs/guide/demo/aaa.vue` and added a basic demo in `docs/guide/demo/basic.vue` that displays a "Hello World" text using `vue3-pixi`'s `Application` and `text` components.
hairyf · Jun 3, 2023 · 6c9fa3f · 6c9fa3f
1 parent 31b5729
commit 6c9fa3f
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 17 deletions.
diff --git a/docs/.vitepress/theme/components/PixiJSContainer/index.vue b/docs/.vitepress/theme/components/PixiJSContainer/index.vue
@@ -24,7 +24,7 @@ const message = useMessage()
 
 const containerRef = ref<HTMLElement>()
 const showHighlighted = ref(props.expand)
-const isUsingTs = ref(true)
+const isUsingTs = ref(!!props.sfcTsCode)
 
 const sfcTsCode = computed(() => decodeURIComponent(props.sfcTsCode))
 const sfcJsCode = computed(() => decodeURIComponent(props.sfcJsCode))
@@ -50,7 +50,7 @@ async function onCopyCode() {
   <Card>
     <template #header>
       <div class="flex gap-2">
-        <div class="cursor-pointer i-akar-icons-typescript-fill p-10px" :class="[isUsingTs && 'text-[#007acc]']" @click="isUsingTs = true" />
+        <div v-if="sfcTsCode" class="cursor-pointer i-akar-icons-typescript-fill p-10px" :class="[isUsingTs && 'text-[#007acc]']" @click="isUsingTs = true" />
         <div class="cursor-pointer i-akar-icons-javascript-fill p-10px" :class="[!isUsingTs && 'text-amber']" @click="isUsingTs = false" />
       </div>
       <div class="flex gap-2">
@@ -67,8 +67,8 @@ async function onCopyCode() {
         />
       </div>
     </template>
-    <div ref="containerRef" class="flex justify-center">
-      <Application v-if="app" :width="688" :height="300">
+    <div ref="containerRef" class="flex justify-center bg-black min-h-300px">
+      <Application v-if="app" :width="300" :height="300">
         <slot />
       </Application>
       <template v-else>

diff --git a/docs/guide/demo/aaa.vue b/docs/guide/demo/aaa.vue
diff --git a/docs/guide/demo/basic.vue b/docs/guide/demo/basic.vue
@@ -0,0 +1,11 @@
+<script setup>
+import { Application } from 'vue3-pixi'
+</script>
+
+<template>
+  <Application :width="300" :height="300">
+    <text :anchor="0.5" :x="150" :y="150" :style="{ fill: 'white' }">
+      Hello World
+    </text>
+  </Application>
+</template>
diff --git a/docs/guide/index.md b/docs/guide/index.md
@@ -1,5 +0,0 @@
-# adwa
-
-## bwawa
-
-<demo src="./demo/aaa.vue" />