优化菜单样式：彩色背景+白色图标文字

2026-03-27 02:59:13 +00:00
parent 42df88b654
commit 6e26355e7d
2 changed files with 21 additions and 38 deletions
--- a/src/pages/index/index.vue
+++ b/src/pages/index/index.vue
@@ -385,23 +385,30 @@ export default {
 /* 手机端 - 2列布局 */
 .menu-card {
  aspect-ratio: 1;
-  width: 44%;
-  background: #fff;
-  border-radius: 24rpx;
-  padding: 20rpx;
+  width: 30%;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  border-radius: 20rpx;
  margin: 10rpx;
-  box-shadow: 0 8rpx 30rpx rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
 }

-/* 平板/PC端 */
+.menu-card:active {
+  opacity: 0.9;
+}
+
+.menu-card-title {
+  font-size: 24rpx;
+  color: #fff;
+  font-weight: bold;
+  margin-top: 10rpx;
+}
+
@media (min-width: 768px) {
  .menu-card {
-    width: 18%;
-    padding: 30rpx;
+    width: 15%;
  }
 }