样式修复

Web/src/components/ContributionHeatmap.vue

@@ -1,45 +1,45 @@
 <template>
   <div class="heatmap-card">
-        <div class="grid-row">
+    <div class="grid-row">
-          <!-- Weekday Labels (Fixed Left) -->
+      <!-- Weekday Labels (Fixed Left) -->
-          <div class="weekday-col-fixed">
+      <div class="weekday-col-fixed">
-            <div class="weekday-label">二</div>
+        <div class="weekday-label">二</div>
-            <div class="weekday-label">四</div>
+        <div class="weekday-label">四</div>
-            <div class="weekday-label">六</div>
+        <div class="weekday-label">六</div>
+      </div>
+      
+      <!-- Scrollable Heatmap Area -->
+      <div ref="scrollContainer" class="heatmap-scroll-container">
+        <div class="heatmap-content">
+          <!-- Month Labels -->
+          <div class="month-row">
+            <div 
+              v-for="(month, index) in monthLabels" 
+              :key="index" 
+              class="month-label"
+              :style="{ left: month.left + 'px' }"
+            >
+              {{ month.text }}
+            </div>
           </div>
-          
-          <!-- Scrollable Heatmap Area -->
-          <div ref="scrollContainer" class="heatmap-scroll-container">
-            <div class="heatmap-content">
-              <!-- Month Labels -->
-              <div class="month-row">
-                <div 
-                  v-for="(month, index) in monthLabels" 
-                  :key="index" 
-                  class="month-label"
-                  :style="{ left: month.left + 'px' }"
-                >
-                  {{ month.text }}
-                </div>
-              </div>
 
-              <!-- Heatmap Grid -->
+          <!-- Heatmap Grid -->
-              <div class="heatmap-grid">
+          <div class="heatmap-grid">
-                <div v-for="(week, wIndex) in weeks" :key="wIndex" class="heatmap-week">
+            <div v-for="(week, wIndex) in weeks" :key="wIndex" class="heatmap-week">
-                  <div
+              <div
-                    v-for="(day, dIndex) in week"
+                v-for="(day, dIndex) in week"
-                    :key="dIndex"
+                :key="dIndex"
-                    class="heatmap-cell"
+                class="heatmap-cell"
-                    :class="getLevelClass(day)"
+                :class="getLevelClass(day)"
-                    @click="onCellClick(day)"
+                @click="onCellClick(day)"
-                  >
+              >
-                    <!-- Tooltip could be implemented here or using title -->
+                <!-- Tooltip could be implemented here or using title -->
-                  </div>
-                </div>
               </div>
             </div>
           </div>
         </div>
+      </div>
+    </div>
     
     <div class="heatmap-footer">
       <div v-if="totalCount > 0" class="summary-text">
@@ -59,7 +59,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted, computed, nextTick } from 'vue';
+import { ref, onMounted, nextTick } from 'vue';
 import { getDailyStatisticsRange } from '@/api/statistics';
 
 const stats = ref({});

Web/src/views/CalendarView.vue

@@ -13,6 +13,9 @@
     
     <ContributionHeatmap ref="heatmapRef" />
 
+    <!-- 底部安全距离 -->
+    <div style="height: calc(80px + env(safe-area-inset-bottom, 0px))"></div>
+
     <!-- 日期交易列表弹出层 -->
     <PopupContainer
       v-model="listVisible"
@@ -303,8 +306,6 @@ onBeforeUnmount(() => {
 
 .calendar-container {
   /* 使用准确的视口高度减去 TabBar 高度（50px）和安全区域 */
-  height: calc(var(--vh, 100vh) - 50px - env(safe-area-inset-bottom, 0px));
-  max-height: calc(var(--vh, 100vh) - 50px - env(safe-area-inset-bottom, 0px));
   display: flex;
   flex-direction: column;
   overflow: hidden;