update 调整样式·

src/views/index.vue

@@ -8,7 +8,7 @@
             <div class="title-d-right"> 累计运行时间：{{ dayTimeT }}</div>
         </div>
         <div class="body-d">
-            <div class="body-d-left">
+            <div class="body-d-left" :class="[themeType]">
                 <one-l theme="light" :setting="setting" :refreshState="refreshState" @handleClick="handlePhoneDialog" />
                 <two-l theme="light" :key="tabState" :refreshState="refreshState" />
                 <three-l :key="tabState" :setting="setting" :refreshState="refreshState" />
@@ -21,7 +21,7 @@
                     :mapOptions="lightMapOption"
                 />
             </div>
-            <div class="body-d-right">
+            <div class="body-d-right" :class="[themeType]">
                 <one-r :setting="setting" :refreshState="refreshState" />
                 <two-r :key="tabState" :setting="setting" :refreshState="refreshState" />
                 <three-r :key="refreshState" />
@@ -54,6 +54,7 @@
     import { Map } from '/@/assets/mapUtils/map.ts';
     import { useUserStore } from '/@/store/modules/user.ts';
     import { lightMapOption } from '/@/assets/mapUtils/mapConstant.ts';
+    import { useTheme } from '/@/hooks/theme/useTheme.ts';
 
     const { refreshState } = useRefresh(DEFAULT_TIME);
     const dayTimeO = ref();
@@ -81,6 +82,7 @@
         //设置主题
         store.setThemeType(ThemeType.light);
     });
+    const { themeType } = useTheme();
     onUnmounted(() => {
         clearInterval(interval.value);
         document.removeEventListener('visibilitychange', checkTabState);
@@ -374,14 +376,12 @@
         .body-d-left,
         .body-d-right {
             text-align: center;
-        }
+            display: flex;
+            flex-direction: column;
+            gap: 10px;
 
-        .body-d-left,
-        .body-d-right {
-            > :nth-child(n) {
-                width: 100%;
-                height: calc(100% / 3);
-                padding: 10px;
+            > div {
+                flex: 1;
             }
         }