美化了样式2.0

pages/welcome/homePage/homePage.wxss

@@ -1,57 +1,104 @@
-.mt-9 {
-  margin-top: 16.88rpx;
-}
+/* ===== 基础设置 ===== */
 .page {
-  padding: 255rpx 0 0;
-  background-image: linear-gradient(180deg, #ffeed9 0%, #f5f5f500 125%);
+  min-height: 100vh;
   width: 100%;
-  overflow-y: auto;
-  overflow-x: hidden;
-  height: 100vh;
+  box-sizing: border-box;
+  padding: 220rpx 32rpx 48rpx;
+  background-image: linear-gradient(180deg, #ffeed9 0%, rgba(245,245,245,0) 120%);
 }
+
+/* 卡片容器 */
 .section {
-  padding: 39.38rpx 52.5rpx 18.75rpx;
+  margin: 0 auto;
+  padding: 48rpx 40rpx 40rpx;
   background-color: #ffffff;
-  border-radius: 35.16rpx;
-  box-shadow: 0rpx 3.75rpx 7.5rpx #00000040;
+  border-radius: 32rpx;
+  box-shadow: 0 8rpx 24rpx rgba(0,0,0,0.08);
+  max-width: 680rpx;   /* 更大屏适配 */
 }
-.image {
-  width: 232.5rpx;
-  height: 232.5rpx;
+
+/* 顶部 Logo 与标题 */
+.logo-area {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
 }
-.text {
+.logo {
+  width: 232rpx;
+  height: 232rpx;
+  border-radius: 28rpx;
+  box-shadow: 0 6rpx 16rpx rgba(0,0,0,0.12);
+}
+.title {
+  margin-top: 28rpx;
   color: #1c2023;
-  font-size: 45rpx;
+  font-size: 44rpx;
+  line-height: 1.32;
+  font-weight: 600;
   font-family: AlibabaPuHuiTi;
-  line-height: 41.53rpx;
+  text-align: center;
+  letter-spacing: 0.5rpx;
 }
-.text-wrapper {
-  padding: 37.5rpx 0 30rpx;
+
+/* 按钮区域 */
+.btn-group {
+  margin-top: 56rpx;
+  display: grid;
+  grid-auto-rows: min-content;
+  row-gap: 22rpx;
+}
+
+/* 按钮基类 */
+.btn {
+  width: 100%;
+  box-sizing: border-box;
+  border-radius: 20rpx;
+  padding: 32rpx 28rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: transform 120ms ease, opacity 120ms ease, background-color 120ms ease, border-color 120ms ease;
+}
+
+/* 主按钮：橙色 */
+.btn--primary {
   background-color: #ff8d1a;
-  border-radius: 18.75rpx;
-  width: 498.75rpx;
+  box-shadow: 0 10rpx 20rpx rgba(255,141,26,0.25);
 }
-.font {
-  font-size: 33.75rpx;
-  font-family: SourceHanSansCN;
-  line-height: 32.06rpx;
+
+/* 描边按钮：白底橙边 */
+.btn--outline {
+  background-color: #ffffff;
+  border: 4rpx solid #ff8d1a;
+}
+
+/* 按钮文字 */
+.btn-text {
+  font-size: 34rpx;
+  line-height: 1.2;
   font-weight: 700;
   color: #ff8d1a;
+  font-family: SourceHanSansCN;
 }
-.text_2 {
+.btn-text--light {
   color: #ffffff;
-  line-height: 32.14rpx;
 }
-.text-wrapper_2 {
-  padding: 37.5rpx 0 30rpx;
-  background-color: #ffffff;
-  border-radius: 18.75rpx;
-  width: 500.63rpx;
-  border-left: solid 4rpx #ff8d1a;
-  border-right: solid 4rpx #ff8d1a;
-  border-top: solid 4rpx #ff8d1a;
-  border-bottom: solid 4rpx #ff8d1a;
+
+/* 交互态（按压反馈） */
+.btn--hover {
+  transform: translateY(2rpx) scale(0.99);
+  opacity: 0.96;
+}
+.btn--primary.btn--hover {
+  background-color: #e67807; /* 按压加深 */
+}
+
+/* 兼容你原有的工具类（如仍有使用可保留） */
+.mt-9 { margin-top: 16rpx; }
+
+/* 可选：为小屏做一点收紧（不影响大屏） */
+@media (max-width: 360px) {
+  .section { padding: 40rpx 28rpx 32rpx; }
+  .btn { padding: 28rpx 24rpx; }
+  .title { font-size: 42rpx; }
 }
-.text_3 {
-  line-height: 31.8rpx;
-}