hookehuyr

style(profile): 调整打卡统计卡片布局和样式

...@@ -36,21 +36,21 @@ ...@@ -36,21 +36,21 @@
36 <!-- <span class="text-xs text-blue-500">查看更多</span> --> 36 <!-- <span class="text-xs text-blue-500">查看更多</span> -->
37 </div> 37 </div>
38 38
39 - <div class="flex justify-between"> 39 + <div class="flex justify-around">
40 - <div class="flex flex-col items-center"> 40 + <div class="flex flex-col items-center min-w-[4rem]">
41 - <div class="text-2xl font-bold text-gray-800"> 41 + <div class="font-bold text-gray-800 px-2 leading-normal text-center w-full" style="font-size: 1.5rem;">
42 {{ checkIns?.total_days || 0 }} 42 {{ checkIns?.total_days || 0 }}
43 </div> 43 </div>
44 <div class="text-xs text-gray-500 mt-1">累计打卡</div> 44 <div class="text-xs text-gray-500 mt-1">累计打卡</div>
45 </div> 45 </div>
46 - <div class="flex flex-col items-center"> 46 + <div class="flex flex-col items-center min-w-[4rem]">
47 - <div class="text-2xl font-bold text-green-600"> 47 + <div class="font-bold text-green-600 px-2 leading-normal text-center w-full" style="font-size: 1.5rem;">
48 {{ checkIns?.consecutive_days || 0 }} 48 {{ checkIns?.consecutive_days || 0 }}
49 </div> 49 </div>
50 <div class="text-xs text-gray-500 mt-1">连续打卡</div> 50 <div class="text-xs text-gray-500 mt-1">连续打卡</div>
51 </div> 51 </div>
52 - <div class="flex flex-col items-center"> 52 + <div class="flex flex-col items-center min-w-[4rem]">
53 - <div class="text-2xl font-bold text-blue-600"> 53 + <div class="font-bold text-blue-600 px-2 leading-normal text-center w-full" style="font-size: 1.5rem;">
54 {{ checkIns?.longest_consecutive_days || 0 }} 54 {{ checkIns?.longest_consecutive_days || 0 }}
55 </div> 55 </div>
56 <div class="text-xs text-gray-500 mt-1">最长连续</div> 56 <div class="text-xs text-gray-500 mt-1">最长连续</div>
......