feat(style): add --vue-preview-color-loading

litingyes · litingyes · commit 305c47c2c8a2 · 2023-08-07T20:13:52.000+08:00
diff --git a/src/VuePreview.vue b/src/VuePreview.vue
@@ -135,7 +135,7 @@ const isHover = useElementHover(vuePreviewContainerRef)
       </Transition>
       <Transition v-if="previewUpdateFlag === 'UPDATING'" name="fade">
         <div class="vue-preview__loading-model">
-          <Loading />
+          <Loading class="vue-preview__loading-icon" />
         </div>
       </Transition>
     </div>
@@ -222,6 +222,10 @@ const isHover = useElementHover(vuePreviewContainerRef)
     background-color: var(--vue-preview-color-model-bg);
   }
 
+  &__loading-icon {
+    color: var(--vue-preview-color-loading, black);
+  }
+
   :deep(.editor) {
     box-sizing: border-box;
     overflow: hidden;
diff --git a/test/vitepress/.vitepress/theme/base.css b/test/vitepress/.vitepress/theme/base.css
@@ -0,0 +1,3 @@
+:root {
+  --vue-preview-color-loading: rgba(0,255,0,0.8);
+}
diff --git a/test/vitepress/.vitepress/theme/index.ts b/test/vitepress/.vitepress/theme/index.ts
@@ -1,6 +1,7 @@
 import DefaultTheme from 'vitepress/theme'
 import { VuePreview } from '../../../../dist'
 import '../../../../dist/style.css'
+import './base.css'
 
 export default {
   ...DefaultTheme,

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+:root {`
	`2`	`+ --vue-preview-color-loading: rgba(0,255,0,0.8);`
	`3`	`+}`