From c3158c81707c0a0dee518fe3afa7290276e2d7a3 Mon Sep 17 00:00:00 2001
From: whycq <you@example.com>
Date: 星期六, 18 三月 2023 23:18:07 +0800
Subject: [PATCH] #

---
 pages/login/login.vue |  206 ++++++++++++++++++++++++++++++++++++++++++++++++--
 1 files changed, 195 insertions(+), 11 deletions(-)

diff --git a/pages/login/login.vue b/pages/login/login.vue
index abcaddd..a84f4af 100644
--- a/pages/login/login.vue
+++ b/pages/login/login.vue
@@ -1,12 +1,14 @@
 <template>
 	<view>
 		<!-- 璁剧疆 -->
-		<label class="settings">
-			<uni-icons type="gear" size="30" color="#707070" @click="settings"></uni-icons>
-		</label>
+		<view class="settings">
+			<view class="settings-btn">
+				<uni-icons type="gear" size="30" color="#707070" @click="settings"></uni-icons>
+			</view>
+		</view>
 		<!-- logo -->
-		<view class="head">
-			<view class="logo">
+		<view class="logo">
+			<view class="logo-box">
 				<image src="../../static/img/logo.png" mode="aspectFit"></image>
 			</view>
 		</view>
@@ -18,7 +20,7 @@
 				</view>
 				<view class="box-text">璐﹀彿:</view>
 				<view class="box-input">
-					<input type="text">
+					<input type="text" placeholder="璇疯緭鍏ヨ处鍙�" placeholder-style="font-size:14px;color:#ccc;">
 				</view>
 				<view class="box-show"></view>
 			</view>
@@ -29,7 +31,7 @@
 				</view>
 				<view class="box-text">瀵嗙爜:</view>
 				<view class="box-input">
-					<input type="text">
+					<input password placeholder="璇疯緭鍏ュ瘑鐮�" placeholder-style="font-size:14px;color:#ccc;" >
 				</view>
 				<view class="box-show">
 					<uni-icons type="eye-filled" size="20" color="#707070"></uni-icons>
@@ -58,9 +60,9 @@
 			<uni-popup ref="inputDialog" type="dialog">
 				<view class="popup">
 					<!-- 鏍囬 -->
-					<view class="title title-font">閰嶇疆</view>
+					<view class="title">閰� 缃�</view>
 					<view class="input">
-						<view class="input-left">ip:</view>
+						<view class="input-left">IP:</view>
 						<view class="input-right"><input type="text"></view>
 					</view>
 					<view class="input">
@@ -78,7 +80,6 @@
 				</view>
 			</uni-popup>
 		</view>
-		
 		
 		<!-- 鐗堟湰鍙� -->
 		<!-- #ifdef APP-PLUS -->
@@ -122,7 +123,190 @@
 		}
 	}
 </script>
-
 <style>
+	/* 璁剧疆鍖哄煙 */
+	.settings {
+		min-height: 100rpx;
+	}
+	.settings-btn {
+		float: right;
+		margin-right: 10rpx;
+	}
+	.logo {
+		height: 25%;
+		width: 100%;
+		display: flex;
+		justify-content: center;
+	}
+	.logo-box {
+		margin: auto 0;
+	}
+	image {
+		height: 300rpx;
+	}
+	/* 杈撳叆妗嗗尯鍩� */
+	.content {
+		min-height: 250rpx;
+		/* background-color: coral; */
+		width: 100%;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		color: #606266;
+	}
+	.box {
+		width: 80%;
+		height: 100rpx;
+		margin-top: 30rpx;
+		background-color: white; 
+		display: flex;
+		font-size: 14px;
+		align-items: center;
+		
+	}
+	.box-icon {
+		width: 80rpx;
+		text-align: center;
+	}
+	.box-text {
+		width: 100rpx;
+		text-align: center;
+	}
+	.box-show {
+		margin-left: auto;
+		/* margin-right: 10rpx; */
+		width: 60rpx;
+		text-align: center;
+	}
+	input {
+		padding-left: 10rpx;
+		font-size: 14px;
+		color: #303133;
+	}
 	
+	.check {
+		width: 78%;
+		display: flex;
+		font-size: 12px;
+		color: #606266;
+		margin-top: 10rpx;
+	}
+	.check-right {
+		margin-left: auto;
+	}
+	.submit {
+		display: flex;
+		justify-content: center;
+		position: fixed;
+		width: 100%;
+		bottom: 100rpx;
+	}
+	.version {
+		position: fixed;
+		width: 100%;
+		bottom: 0;
+		text-align: center;
+		font-size: 12px;
+		color: #909399;
+	}
+	
+	.popup {
+		width: 80vw;
+		min-height: 400rpx;
+		background-color: #FFF;
+		border-radius: 25rpx;
+	}
+	.title {
+		height: 100rpx;
+		line-height: 100rpx;
+		width: 100%;
+		color: #606266;
+		text-align: center;
+		font-size: 18px;
+	}
+	.input {
+		height: 80rpx;
+		line-height: 80rpx;
+		display: flex;
+		align-items: center;
+		font-size: 14px;
+	}
+	.input-left {
+		width: 16vw;
+		padding-right: 20rpx;
+		text-align: right;
+		color: #606266;
+	}
+	.input-right {
+		display: flex;
+		align-items: center;
+		width: 50vw;
+		height: 50rpx;
+		padding: 2px 5px;
+		border: 1px solid #E4E7ED;
+		border-radius: 5rpx;
+	}
+	.input-right input{
+		color: #606266;
+	}
+	.btn {
+		display: flex;
+		height: 90rpx;
+		margin-top: 20rpx;
+		border-top: 1px solid #DCDFE6;
+		justify-content: center;
+		align-items: center;
+	}
+	.btn-left {
+		display: flex;
+		flex: 1;
+		height: 100%;
+		justify-content: center;
+		align-items: center;
+		color: #606266;
+		border-right: 1px solid #DCDFE6;
+	}
+	.btn-right {
+		display: flex;
+		flex: 1;
+		justify-content: center;
+		align-items: center;
+		color: #409EFF;
+	}
+	
+	
+	
+	
+	
+	
+	
+	
+	
+	
+	
+	/* ------ */
+	
+	.shadow-warp {
+		position: relative;
+		box-shadow: 0 0 10upx rgba(0, 0, 0, 0.1);
+	}
+	
+	.shadow-warp:before,
+	.shadow-warp:after {
+		position: absolute;
+		content: "";
+		top: 20upx;
+		bottom: 30upx;
+		left: 20upx;
+		width: 50%;
+		box-shadow: 0 30upx 20upx rgba(0, 0, 0, 0.2);
+		transform: rotate(-3deg);
+		z-index: -1;
+	}
+	
+	.shadow-warp:after {
+		right: 20upx;
+		left: auto;
+		transform: rotate(3deg);
+	}
 </style>
\ No newline at end of file

--
Gitblit v1.9.1