Parcourir la source

update login style

dayu il y a 2 ans
Parent
commit
0af20bed8f
3 fichiers modifiés avec 45 ajouts et 7 suppressions
  1. 2 0
      sleep/common/App.scss
  2. 4 1
      sleep/pages/home/index.vue
  3. 39 6
      sleep/pages/login/index.vue

+ 2 - 0
sleep/common/App.scss

@@ -27,6 +27,7 @@
 
 html {
   font-size: 16px;
+  height: 100%;
 }
 
 body {
@@ -36,6 +37,7 @@ body {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   background-color: #000000;
+  height: 100%;
 }
 
 view,

+ 4 - 1
sleep/pages/home/index.vue

@@ -444,8 +444,11 @@ export default {
 	methods: {
 		handleShareClick() {
 			uni.navigateTo({
-				url: '/pages/shareUser/shareUser'
+				url: '/pages/login/index'
 			})
+			// uni.navigateTo({
+			// 	url: '/pages/shareUser/shareUser'
+			// })
 		},
     API_getDeviceList() {
       const _this = this

+ 39 - 6
sleep/pages/login/index.vue

@@ -1,9 +1,14 @@
 <template>
 	<view class="login-container">
-		<!-- <image src="../../static/loginBg.png" class="background-img"></image> -->
+		<image src="http://wdklmall.oss-cn-shenzhen.aliyuncs.com/mallgoods/goods/C34A0AB308944EF9A3BB4135827924DF.png" class="background-img"></image>
 		<view class="absolve-wrapper">
 			<!-- <view class="logo"><image src="../../static/logo.png" class="logo-img"></image></view> -->
-			<view class="text-title">我有故事和歌,你听吗?</view>
+			
+			<view class="flex-col items-center group_3 space-y-20">
+			  <text class="text_2 text_3">UU睡眠</text>
+			  <text class="font_1 text_2">AI时代,全家人的睡眠健康顾问</text>
+			</view>
+			
 			<view class="login-main">
 				<view class="input-wrapper">
 					<i class="iconfont icon-phone icon"></i>
@@ -15,7 +20,7 @@
 					<input v-else type="password" placeholder="请输入密码" v-model="userFrom.password" />
 					<i class="iconfont eye" :class="isText ? 'icon-openEye' : 'icon-closeEye'" @click="isText = !isText"></i>
 				</view>
-				<button style="background-image: linear-gradient(45deg, #39b54a, #8dc63f);" class="cu-btn round login-button lg cu-load" :class="{ loading: loading }" @click="getUserInfo">登录</button>
+				<button style="background: linear-gradient(90deg, rgba(44, 37, 247, 0.6) 0%, rgba(6, 21, 153, 1) 100%);" class="cu-btn round login-button lg cu-load" :class="{ loading: loading }" @click="getUserInfo">登录</button>
 
         <button v-if="haslogin.loginType === 'auto'" class="cu-btn round login-button lg cu-load" :class="{ loading: loading }" @click="loginByHasLogin">
           微信快捷登录
@@ -63,7 +68,7 @@ export default {
     this.haslogin = Storage.getItem('haslogin')
     if (!this.haslogin) {
       uni.reLaunch({
-        url:'/pages/auth/auth'
+        // url:'/pages/auth/auth'
       })
       return
     }
@@ -169,6 +174,35 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.icon-password {
+	color: #fff;
+}
+.icon-phone {
+	color: #fff;
+}
+.eye {
+	color: #fff;
+}
+.group_3 {
+	padding: 4rem 0;
+	.text_2 {
+		opacity: 0.76;
+	}
+	.text_3 {
+	    color: #ffffff;
+	    font-size: 1.88rem;
+	    font-family: PingFangSC;
+	    line-height: 1.72rem;
+		margin-top: 1rem;
+	}
+	.font_1 {
+	  font-size: 1.13rem;
+	  font-family: PingFangSC;
+	  line-height: 1.06rem;
+	  color: #ffffff;
+	  margin-top: 4rem;
+	}
+}	
 .login-container {
 	width: 100%;
 	height: 100vh;
@@ -231,8 +265,7 @@ export default {
 		.login-button {
 			width: 100%;
 			color: #fff;
-			background-image: linear-gradient(to right, #ffa6b6, #ff7c93);
-			letter-spacing: 2px;
+			background: linear-gradient(90deg, rgba(5, 96, 232, 1) 0%, rgba(100, 158, 245, 1) 100%);			letter-spacing: 2px;
 			height: 45px;
 			margin-top: 75rpx !important;
 		}