首页美化一下

admin/dashboard/templates/index.html

@@ -6,11 +6,11 @@
 <!-- 首页概览 -->
 <div>
     <!-- 用户信息和统计数据 -->
-    <el-row :gutter="20" style="margin-top: 20px;">
+    <el-row :gutter="12" style="margin-top: 12px;">
         <el-col :span="6">
             <el-card shadow="hover">
                 <div v-if="currentUser.success" class="user-info-container">
-                    <el-row :gutter="10">
+                    <el-row :gutter="8">
                         <el-col :span="6">
                             <div class="user-avatar-column">
                                 <div class="user-avatar-container">
@@ -109,7 +109,7 @@
     </el-row>
         
     <!-- 添加热门用户、群组和插件 -->
-    <el-row :gutter="20" style="margin-top: 20px;">
+    <el-row :gutter="12" style="margin-top: 12px;">
         <el-col :span="8">
             <el-card shadow="hover">
                 <div slot="header">
@@ -156,7 +156,7 @@
         </el-col>
     </el-row>
     
-    <el-row :gutter="20" style="margin-top: 20px;">
+    <el-row :gutter="12" style="margin-top: 12px;">
         <el-col :span="12">
             <el-card shadow="hover">
                 <div slot="header">
@@ -179,7 +179,7 @@
         </el-col>
     </el-row>
     
-    <el-row :gutter="20" style="margin-top: 20px;">
+    <el-row :gutter="12" style="margin-top: 12px;">
         <el-col :span="24">
             <el-card shadow="hover">
                 <div slot="header">
@@ -193,7 +193,7 @@
     </el-row>
 
     <!-- 添加一个新行用于显示按小时聊天趋势图 -->
-    <el-row :gutter="20" style="margin-top: 20px;">
+    <el-row :gutter="12" style="margin-top: 12px;">
         <el-col :span="24">
             <el-card shadow="hover" v-loading="hourlyMessageTrendLoading">
                 <div slot="header" style="display: flex; justify-content: space-between; align-items: center;">
@@ -704,8 +704,8 @@
 <style>
     /* 基础卡片样式 */
     .stats-card {
-        margin-bottom: 15px;
+        margin-bottom: 10px;
-        height: 120px;
+        height: 100px;
         position: relative;
         overflow: hidden;
         background: #f9fbff;
@@ -724,8 +724,8 @@
     }
     
     .chart-container {
-        margin-bottom: 20px;
+        margin-bottom: 12px;
-        padding: 10px;
+        padding: 8px;
         background-color: #f7faff;
         border-radius: 4px;
         border: 1px solid #d6e6ff;
@@ -734,14 +734,14 @@
     
     .chart-container h3 {
         margin-top: 0;
-        margin-bottom: 10px;
+        margin-bottom: 6px;
-        font-size: 16px;
+        font-size: 14px;
         color: #2a3b55;
     }
     
     /* 用户信息卡片样式 */
     .user-info-container {
-        padding: 5px 0;
+        padding: 2px 0;
     }
     
     .user-avatar-column {
@@ -777,7 +777,7 @@
         align-items: center;
         font-size: 12px;
         line-height: 1.4;
-        margin-bottom: 4px;
+        margin-bottom: 2px;
     }
     
     .user-info-label {
@@ -799,7 +799,7 @@
     .user-info-empty {
         text-align: center;
         color: #7a94b8;
-        padding: 10px 0;
+        padding: 6px 0;
     }
 
     /* 首页卡片统一冷色面板感 */
@@ -813,6 +813,9 @@
         border-bottom: 1px solid #d6e6ff;
         color: #2a3b55;
     }
+    .content .el-card__body {
+        padding: 10px !important;
+    }
 
 </style>
 {% endblock %}