From 6bdfa6b1b36e4f62bdaf300f640b9d809676b752 Mon Sep 17 00:00:00 2001
From: Doji <138183055+BeanDz@users.noreply.github.com>
Date: Fri, 31 Oct 2025 20:14:10 +0800
Subject: [PATCH] refactor(ui): remove unocss attributify for `FieldRange`
 (#694)

Co-authored-by: LemonNeko <self@lemonneko.moe>
---
 .../ui/src/components/Form/Field/FieldRange.vue  | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/packages/ui/src/components/Form/Field/FieldRange.vue b/packages/ui/src/components/Form/Field/FieldRange.vue
index 4c21faa31..4fa1c5b9f 100644
--- a/packages/ui/src/components/Form/Field/FieldRange.vue
+++ b/packages/ui/src/components/Form/Field/FieldRange.vue
@@ -17,29 +17,29 @@ const modelValue = defineModel<number>({ required: true })
 </script>
 
 <template>
-  <props.as flex="~ col gap-4">
-    <div flex="~ row" items-center gap-2>
-      <div flex="1">
-        <div class="flex items-center gap-1 text-sm font-medium">
+  <props.as :class="['flex flex-col gap-4']">
+    <div :class="['flex', 'flex-row', 'items-center', 'gap-2']">
+      <div :class="['flex-1']">
+        <div :class="['flex', 'items-center', 'gap-1', 'text-sm', 'font-medium']">
           <slot name="label">
             {{ label }}
           </slot>
         </div>
-        <div class="text-xs text-neutral-500 dark:text-neutral-400">
+        <div :class="['text-xs', 'text-neutral-500', 'dark:text-neutral-400']">
           <slot name="description">
             {{ description }}
           </slot>
         </div>
       </div>
-      <span font-mono>{{ props.formatValue?.(modelValue) || modelValue }}</span>
+      <span :class="['font-mono']">{{ props.formatValue?.(modelValue) || modelValue }}</span>
     </div>
-    <div flex="~ row" items-center gap-2>
+    <div :class="['flex', 'flex-row', 'items-center', 'gap-2']">
       <Range
         v-model="modelValue"
         :min="min || 0"
         :max="max || 1"
         :step="step || 0.01"
-        w-full
+        :class="['w-full']"
       />
     </div>
   </props.as>