فهرست منبع

style(home): 优化首页样式和布局

- 更新欢迎标题为"欢迎使用智慧阅读平台管理系统"
- 调整首页整体布局,增加高度和间距
- 修改标题和副标题的字体大小和位置
- 添加淡入动画效果
mcbaiyun 5 ماه پیش
والد
کامیت
1b3f8d1c6f
1فایلهای تغییر یافته به همراه8 افزوده شده و 6 حذف شده
  1. 8 6
      src/views/home/index.vue

+ 8 - 6
src/views/home/index.vue

@@ -1,6 +1,6 @@
 <template>
 <template>
   <div class="home">
   <div class="home">
-    <h1 class="welcome-title">欢迎使用管理系统</h1>
+    <h1 class="welcome-title">欢迎使用智慧阅读平台管理系统</h1>
     <p class="welcome-subtitle">智能阅读平台 - 欢迎您</p>
     <p class="welcome-subtitle">智能阅读平台 - 欢迎您</p>
     <div class="features">
     <div class="features">
       <el-row :gutter="20">
       <el-row :gutter="20">
@@ -42,20 +42,21 @@ const features = ref([
 .home {
 .home {
   padding: 40px;
   padding: 40px;
   text-align: center;
   text-align: center;
-  background-color: #f9f9f9;
+  height: 50vh;
 }
 }
 
 
 .welcome-title {
 .welcome-title {
-  font-size: 28px;
+  font-size: 42px;
   color: #1890ff;
   color: #1890ff;
-  margin-bottom: 10px;
+  margin-top: 8vh;
+  margin-bottom: 20px;
   animation: fadeInDown 1s ease-out;
   animation: fadeInDown 1s ease-out;
 }
 }
 
 
 .welcome-subtitle {
 .welcome-subtitle {
-  font-size: 18px;
+  font-size: 28px;
   color: #666;
   color: #666;
-  margin-bottom: 40px;
+  margin-bottom: 15vh;
   animation: fadeInUp 1s ease-out;
   animation: fadeInUp 1s ease-out;
   animation-delay: 0.5s;
   animation-delay: 0.5s;
 }
 }
@@ -99,6 +100,7 @@ const features = ref([
   transition: color 0.3s;
   transition: color 0.3s;
 }
 }
 
 
+
 @keyframes fadeInDown {
 @keyframes fadeInDown {
   from {
   from {
     opacity: 0;
     opacity: 0;