Browse Source

调整智能AI助手新的UI界面

nelson 3 months ago
parent
commit
150df19eb7

+ 21 - 20
sikey-hmd-business/sikey-hmd-business-biz/src/main/resources/templates/index.html

@@ -13,43 +13,45 @@
 
         body {
             font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-            background: #025E8E;
+            background: url('/images/ai-background.png') no-repeat center center;
             margin: 0;
             line-height: 1.6;
             position: relative; /* 为绝对定位子元素提供参照 */
-            z-index: 1000;
+            /*z-index: 1000;*/
             height: 610px;
         }
 
         /* 容器样式 */
         .container {
             /*max-width: 600px;*/
-            margin: -20% auto;
+            /*margin: -20% auto;*/
             background: #F5F5F5;
             border-radius: 15px;
             box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
             /* overflow: hidden;*/
-            position: relative;
-            top: 10%;
+            position: absolute;
+            top: 15%;
             width: 100%;
-            height: 96%;
+            height: 50%;
+            margin-top: 85%;
         }
 
         /* 页头区域 */
         .header {
             position: absolute;
-            width: 350px;
-            height: 95px;
-            top: 80px;
-            left: 16px;
+            /* width: 350px; */
+            /* height: 95px; */
+            /* top: 80px; */
+            /* left: 16px; */
             border-radius: 13px 13px 4px 4px;
             background: linear-gradient(135deg, #5689AF, #025E8E);
-            padding: 1.2rem;
-            z-index: -10;
-            box-sizing: border-box;
-            margin-top: -160px;
+            /* padding: 1.2rem; */
+            /* z-index: -10; */
+            /* box-sizing: border-box; */
+            /* margin-top: -160px; */
         }
 
+
         /* 渐变边框实现 */
         .header::before {
             content: '';
@@ -207,10 +209,9 @@
         /* 支付方式 */
         .payment-section {
             padding: 0.6rem;
-            /*display: inline-block;
-            margin-top: -9%;*/
             position: absolute;
             height: -webkit-fill-available;
+            margin-top: 3%;
         }
 
         .payment-section-pay {
@@ -600,13 +601,13 @@
 <div class="container" th:fragment="main">
     <!-- 页头动态数据绑定 -->
     <header class="header">
-        <div class="branding">
+        <!--<div class="branding">
             <div class="header-text">
                 <h1 th:text="${serviceInfo.title}"></h1>
                 <p th:text="${serviceInfo.subtitle}"></p>
             </div>
             <img th:src="@{/images/助手机器人.png}" alt="AI助手" class="robot-logo">
-        </div>
+        </div>-->
     </header>
 
     <!--<div class="middle">
@@ -631,7 +632,7 @@
     </section>-->
 
     <!-- 功能对比表动态生成 -->
-    <section class="feature-grid_out">
+    <!--<section class="feature-grid_out">
         <th:block th:each="col : ${featureList}">
             <div class="feature-grid">
                 <div class="grid-item col-header" th:classappend="${col.getIsHighlight()} ? 'isHighlight' : ''"
@@ -642,7 +643,7 @@
                      th:text="${detail.value}"></div>
             </div>
         </th:block>
-    </section>
+    </section>-->
 
     <!--支付方式-->
     <section class="payment-section">