chore: lint fix

zyyv · Dec 22, 2023 · af353c7 · af353c7
1 parent 0c3b177
commit af353c7
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 26 deletions.
diff --git a/src/components/Animate.vue b/src/components/Animate.vue
@@ -11,20 +11,22 @@ const { name } = withDefaults(defineProps<{
 const classList = computed(() => [
   isOpenAnimate.value ? `animate-${name}` : `group-hover-animate-${name}`,
   hasDuration(name) ? '' : 'important-animate-duration-1500',
-  'important-animate-count-infinite'
+  'important-animate-count-infinite',
 ])
 </script>
 
 <template>
-  <div aspect="1/1" w-full fcc rd-2 bg="#333" ring="~ [hsla(0,0%,100%,.1)]" trans :class="{
-    group: !isOpenAnimate,
-    'hover-cursor-pointer': hoverable,
-    'hover-ring-[hsla(0,0%,100%,.5)]': hoverable,
-    'hover-text-purple-400': hoverable,
-  }">
+  <div
+    aspect="1/1" w-full fcc rd-2 bg="#333" ring="~ [hsla(0,0%,100%,.1)]" trans :class="{
+      'group': !isOpenAnimate,
+      'hover-cursor-pointer': hoverable,
+      'hover-ring-[hsla(0,0%,100%,.5)]': hoverable,
+      'hover-text-purple-400': hoverable,
+    }"
+  >
     <div v-if="type === 'text'" :class="classList">
       {{ name }}
     </div>
-    <div v-else-if="type === 'radio'" w="15%" h="15%" rd bg=" [hsla(0,0%,100%,.5)]" :class="classList"></div>
+    <div v-else-if="type === 'radio'" w="15%" h="15%" rd bg=" [hsla(0,0%,100%,.5)]" :class="classList" />
   </div>
 </template>
diff --git a/src/components/Modal.vue b/src/components/Modal.vue
@@ -37,31 +37,41 @@ watchEffect(() => {
 </script>
 
 <template>
-  <transition enter-active-class="animate-fade-in animate-duration-200"
-    leave-active-class="animate-fade-out animate-duration-200" mode="out-in">
-    <div v-show="modalVisible" bg="#222 op-80" pf z-10 h-screen w-screen fcc gap-10 backdrop-blur p-10>
-      <div i-ri:close-circle-line pa right-10 top-10 cursor-pointer text-xl hover-i-ri:close-circle-fill
-          @click="handleCloseModal()" />
-      <div flex-1 flex flex-col items-center class="prose" h-fit max-h-full of-scroll>
-        <h2 w-fit mb-2 mt-0 pb-1 cursor-pointer text="3xl #bbb" fw-600 b-b="~ dashed #888" hover="b-b-#eee text-#eee"
-          @click="handleCopy(activeAnimate.name)">
+  <transition
+    enter-active-class="animate-fade-in animate-duration-200"
+    leave-active-class="animate-fade-out animate-duration-200" mode="out-in"
+  >
+    <div v-show="modalVisible" bg="#222 op-80" pf z-10 h-screen w-screen fcc gap-10 p-10 backdrop-blur>
+      <div
+        i-ri:close-circle-line pa right-10 top-10 cursor-pointer text-xl hover-i-ri:close-circle-fill
+        @click="handleCloseModal()"
+      />
+      <div class="prose" h-fit max-h-full flex flex-1 flex-col items-center of-scroll>
+        <h2
+          text="3xl #bbb" mb-2 mt-0 w-fit cursor-pointer pb-1 fw-600 b-b="~ dashed #888" hover="b-b-#eee text-#eee"
+          @click="handleCopy(activeAnimate.name)"
+        >
           {{ activeAnimate.name }}
         </h2>
         <p text="#888 op-80">
           UnoCSS Usage:
-          <span ml-2 cursor-pointer inline-block b-b="~ dashed #888" hover="b-b-#eee text-#eee"
-            @click="handleCopy(`animate-${activeAnimate.name}`)">
+          <span
+            ml-2 inline-block cursor-pointer b-b="~ dashed #888" hover="b-b-#eee text-#eee"
+            @click="handleCopy(`animate-${activeAnimate.name}`)"
+          >
             animate-{{ activeAnimate.name }}
           </span>
         </p>
         <div pr w-full>
-          <div i-ri:clipboard-line pa right-4 top-8 cursor-pointer hover-i-ri:clipboard-fill
-            @click="handleCopy(fotmatkeyframeCSS)" />
+          <div
+            i-ri:clipboard-line pa right-4 top-8 cursor-pointer hover-i-ri:clipboard-fill
+            @click="handleCopy(fotmatkeyframeCSS)"
+          />
           <div v-html="keyframeCSS" />
         </div>
       </div>
 
-      <div flex-1 max-w-100 aspect-square hidden md:block>
+      <div hidden aspect-square max-w-100 flex-1 md:block>
         <Animate :key="activeAnimateName" :name="activeAnimateName" type="radio" :hoverable="false" />
       </div>
     </div>

diff --git a/src/components/Preview.vue b/src/components/Preview.vue
@@ -16,8 +16,8 @@ function handleClicked(keyframeName: string) {
         :key="k"
         :name="k"
         :status="isOpenAnimate"
-        @click="handleClicked(k)"
         type="radio"
+        @click="handleClicked(k)"
       />
     </template>
     <div v-else>

diff --git a/uno.config.ts b/uno.config.ts
@@ -9,12 +9,12 @@ const resolvedConfig = resolveConfig({
       cdn: 'https://esm.sh/',
     },
     typography: {
-      cssExtend:{
-        'pre': {
+      cssExtend: {
+        pre: {
           'background-color': '#222 !important',
           'border': '1px solid #444 !important',
-        }
-      }
+        },
+      },
     },
   })],
   preflights: [{