Переглянути джерело

feat: 动态时钟样式优化

Burt 2 роки тому
батько
коміт
02778be13f
1 змінених файлів з 7 додано та 6 видалено
  1. 7 6
      src/pages/demo/clock.vue

+ 7 - 6
src/pages/demo/clock.vue

@@ -1,5 +1,5 @@
 <template>
-  <view class="clock-box">
+  <view class="clock-box mt-10">
     <view class="clock" :style="{ '--ds': ds, '--dm': dm, '--dh': dh }">
       <view class="clock-pane">
         <text class="clock-num" :style="{ '--i': n }" v-for="n in 12" :key="n">{{ n }}</text>
@@ -22,6 +22,12 @@ const dh = ref(h + m / 60 + s / 3600)
 </script>
 
 <style lang="scss">
+.clock-box {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
 .clock {
   position: relative;
   display: flex;
@@ -112,9 +118,4 @@ const dh = ref(h + m / 60 + s / 3600)
     transform: translateY(-50%) rotate(360deg);
   }
 }
-
-a {
-  width: 8px;
-  height: 9px;
-}
 </style>