一些交互体验更新

view/Install/index.html

@@ -6,16 +6,13 @@
     <title>程序安装</title>
     <link rel="stylesheet" href="/component/pear/css/pear.css" />
     <style>
-        .logo {
+		.logo1 {
-            width: 60px !important;
+			width: 180px !important;
-            margin-top: 10px !important;
-            margin-bottom: 10px !important;
 		}
 
         .title {
             font-size: 30px !important;
             font-weight: 550 !important;
-            margin-left: 20px !important;
             color: #5FB878 !important;
             height: 60px !important;
             line-height: 60px !important;
@@ -37,8 +34,8 @@
     <div class="layui-card" style="padding-top: 40px; max-width: 780px; margin: 20px auto;">
         <div class="layui-card-body">
             <div class="layui-form-item">
-                <div style="display: flex; justify-content: center;">
+                <div style="display: flex;flex-direction: column;align-items: center;">
-                    <div><img class="logo" src="/admin/images/logo.png" /></div>
+                    <div><img class="logo1" src="/static/img/logo1.png" /></div>
                     <div class="title">码支付安装程序</div>
                 </div>
                 <div class="desc">

view/index/index.html

@@ -15,34 +15,47 @@
 	<link rel="stylesheet" type="text/css" href="/static/css/style.css" id="theme-opt">
 	<link rel="stylesheet" type="text/css" href="/static/css/index.css" id="theme-opt">
 	<style>
-		#topnav .navigation-menu {
+		.mlogo {
-			float: left;
+			display: flex;
+			align-items: center;
 		}
 
-		#topnav .login-menu {
+		.mlogo img {
-			float: right;
+			height: 28px;
-			list-style: none;
+		}
+
+		.top-head {
+			display: flex;
+			justify-content: space-between;
+		}
+
+		.nav-menu,
+		.log-menu {
+			display: flex;
 			margin: 0;
 			padding: 0;
 		}
 
-		#topnav .login-menu>li {
+		.nav-menu {
-			float: left;
+			justify-content: flex-start;
+		}
+
+		.log-menu {
+			justify-content: flex-end;
+		}
+
+		.nav-menu>li,
+		.log-menu>li {
 			display: block;
-			position: relative;
 			margin: 0 10px;
+			min-height: 74px;
+			display: flex;
+			align-items: center;
+			justify-content: center;
 		}
 
-		@media (min-width: 992px) {
+		.nav-menu>li>a,
-			#topnav .login-menu>li>a {
+		.log-menu>li>a {
-				padding-top: 25px;
-				padding-bottom: 25px;
-				min-height: 62px;
-
-			}
-		}
-
-		#topnav .login-menu>li>a {
 			display: block;
 			color: #3c4858;
 			font-size: 13px;
@@ -57,18 +70,23 @@
 			padding-right: 15px;
 		}
 
+		.nav-menu>li:first-child>a {
+			padding-left: 0;
+			padding-right: 0;
+		}
+
+		.nav-menu>li>a:hover,
+		.log-menu>li>a:hover {
+			color: #2f55d4;
+		}
+
 		@media (max-width: 991px) {
-			#topnav .navigation-menu {
+			.nav-menu > li:not(:first-child) {
-				margin-bottom: 40px;
+				display: none;
 			}
 
-			#topnav .login-menu {
+			.log-menu {
-				position: absolute;
+				display: none;
-				bottom: 0;
-			}
-
-			#topnav .login-menu>li>a {
-				padding: 10px 20px;
 			}
 		}
 	</style>
@@ -78,14 +96,17 @@
 
 	<header id="topnav" class="defaultscroll sticky active">
 		<div class="container">
-			<a class="logo" href="/">码支付</a>
+			<div class="top-head">
-		</div>
+				<ul class="nav-menu">
-		<div id="navigation" class="active">
+					<li class="mlogo">
-			<ul class="navigation-menu">
+						<a href="/">
-				<li class="active"><a href="/">首页</a></li>
+							<img src="/static/img/logo1.png" alt="logo">
+						</a>
+					</li>
+					<li><a href="/">首页</a></li>
 					<li><a href="/doc.html" target="_blank">开发文档</a></li>
 				</ul>
-			<ul class="login-menu">
+				<ul class="log-menu">
 					<?php if(isset($nickname)){ ?>
 					<li><a href="/Console/index" class="a-head-btn bdr-5 bg-color-white">
 							<?php echo $nickname ?>
@@ -96,6 +117,7 @@
 					<?php } ?>
 				</ul>
 			</div>
+		</div>
 	</header>
 
 	<section class="bg-half bg-light d-table w-100" id="home">
@@ -307,6 +329,26 @@
 			</div>
 		</div>
 	</footer>
+	<script>
+        // 当页面滚动时，检查滚动位置
+        window.onscroll = function () {
+            scrollFunction();
+        };
+
+        // 定义滚动函数
+        function scrollFunction() {
+            // 获取页面滚动的距离
+            var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
+
+            // 如果滚动距离大于指定值（例如100像素），则添加样式
+            if (scrollTop > 80) {
+                document.getElementById("topnav").classList.add("nav-sticky");
+            } else {
+                // 如果滚动距离小于指定值，则移除样式
+                document.getElementById("topnav").classList.remove("nav-sticky");
+            }
+        }
+    </script>
 </body>
 
 </html>

view/user/index.html

@@ -261,7 +261,7 @@
             }
 
         });
-        fetch('https://tenapi.cn/v2/yiyan').then(res => res.text()).then(data => { document.getElementById('yiyan').innerHTML = data || '人无横财不富，马无夜草不肥'; })
+        fetch('https://v1.hitokoto.cn?c=d&c=i&c=k&encode=text').then(res => res.text()).then(data => { document.getElementById('yiyan').innerHTML = data || '人无横财不富，马无夜草不肥'; })
 
 
     </script>