浏览代码

登陆页面样式调整

usgeek 7 年之前
父节点
当前提交
7efe35dc6c
共有 2 个文件被更改,包括 140 次插入88 次删除
  1. 83 66
      litemall-wx/pages/auth/accountLogin/accountLogin.wxss
  2. 57 22
      litemall-wx/pages/auth/login/login.wxss

+ 83 - 66
litemall-wx/pages/auth/accountLogin/accountLogin.wxss

@@ -1,86 +1,103 @@
-.form-box{
-    width: 100%;
-    height: auto;
-    overflow: hidden;
-    padding: 0 40rpx;
-    margin-top: 200rpx;
-    background: #fff;
+.form-box {
+  width: 100%;
+  height: auto;
+  overflow: hidden;
+  padding: 0 40rpx;
+  margin-top: 200rpx;
+  background: #fff;
 }
 
-.form-item{
-    position: relative;
-    background: #fff;
-    height: 96rpx;
-    border-bottom: 1px solid #d9d9d9;
+.form-item {
+  position: relative;
+  background: #fff;
+  height: 96rpx;
+  border-bottom: 1px solid #d9d9d9;
 }
 
-.form-item .username, .form-item .password, .form-item .code{
-    position: absolute;
-    top: 26rpx;
-    left: 0;
-    display: block;
-    width: 100%;
-    height: 44rpx;
-    background: #fff;
-    color: #333;
-    font-size: 30rpx;
+.form-item .username, .form-item .password, .form-item .code {
+  position: absolute;
+  top: 26rpx;
+  left: 0;
+  display: block;
+  width: 100%;
+  height: 44rpx;
+  background: #fff;
+  color: #333;
+  font-size: 30rpx;
 }
 
-.form-item-code{
-    margin-top:32rpx;
-    height: auto;
-    overflow: hidden;
-    width: 100%;
+.form-item-code {
+  margin-top: 32rpx;
+  height: auto;
+  overflow: hidden;
+  width: 100%;
 }
 
-.form-item-code .form-item{
-    float: left;
-    width: 350rpx;
+.form-item-code .form-item {
+  float: left;
+  width: 350rpx;
 }
 
-.form-item-code .code-img{
-    float: right;
-    margin-top: 4rpx;
-    height: 88rpx;
-    width: 236rpx;
+.form-item-code .code-img {
+  float: right;
+  margin-top: 4rpx;
+  height: 88rpx;
+  width: 236rpx;
 }
 
-.form-item .clear{
-    position: absolute;
-    top: 26rpx;
-    right: 18rpx;
-    z-index: 2;
-    display: block;
-    background: #fff;
-    height: 44rpx;
-    width: 44rpx;
+.form-item .clear {
+  position: absolute;
+  top: 26rpx;
+  right: 18rpx;
+  z-index: 2;
+  display: block;
+  background: #fff;
+  height: 44rpx;
+  width: 44rpx;
 }
 
-.login-btn{
-    margin: 60rpx 0 40rpx 0;
-    height: 96rpx;
-    line-height: 96rpx;
-    font-size: 30rpx;
-    width: 100%;
-    background: #b4282d;
-    border-radius: 6rpx;
+.login-btn {
+  margin: 60rpx 0 40rpx 0;
+  height: 96rpx;
+  line-height: 96rpx;
+  font-size: 30rpx;
+  border-radius: 6rpx;
+  width: 90%;
+  color: #fff;
+  right: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: flex;
+  bottom: 0;
+  left: 0;
+  padding: 0;
+  margin-left: 5%;
+  text-align: center;
+  /* padding-left: -5rpx; */
+  border-top-left-radius: 50rpx;
+  border-bottom-left-radius: 50rpx;
+  border-top-right-radius: 50rpx;
+  border-bottom-right-radius: 50rpx;
+  letter-spacing: 3rpx;
+  background-image: linear-gradient(to right, #9a9ba1 0%, #9a9ba1 100%);
 }
 
-.form-item-text{
-    height: 35rpx;
-    width: 100%;
+.form-item-text {
+  height: 35rpx;
+  width: 100%;
 }
 
-.form-item-text .register{
-    display: block;
-    height: 34rpx;
-    float: left;
-    font-size: 28rpx;
+.form-item-text .register {
+  display: block;
+  height: 34rpx;
+  float: left;
+  font-size: 28rpx;
 }
 
-.form-item-text .reset{
-    display: block;
-    height: 34rpx;
-    float: right;
-    font-size: 28rpx;
-}
+.form-item-text .reset {
+  display: block;
+  height: 34rpx;
+  float: right;
+  font-size: 28rpx;
+}

+ 57 - 22
litemall-wx/pages/auth/login/login.wxss

@@ -1,26 +1,61 @@
-.login-box{
-    width: 100%;
-    height: auto;
-    overflow: hidden;
-    padding: 0 40rpx;
-    margin-top: 200rpx;
-    background: #fff;
+.login-box {
+  width: 100%;
+  height: auto;
+  overflow: hidden;
+  padding: 0 40rpx;
+  margin-top: 200rpx;
+  background: #fff;
 }
 
-.wx-login-btn{
-    margin: 60rpx 0 40rpx 0;
-    height: 96rpx;
-    line-height: 96rpx;
-    font-size: 30rpx;
-    width: 100%;
-    border-radius: 6rpx;
+.wx-login-btn {
+  margin: 60rpx 0 40rpx 0;
+  height: 96rpx;
+  line-height: 96rpx;
+  font-size: 30rpx;
+  border-radius: 6rpx;
+  width: 90%;
+  color: #fff;
+  right: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: flex;
+  bottom: 0;
+  left: 0;
+  padding: 0;
+  margin-left: 5%;
+  text-align: center;
+  /* padding-left: -5rpx; */
+  border-top-left-radius: 50rpx;
+  border-bottom-left-radius: 50rpx;
+  border-top-right-radius: 50rpx;
+  border-bottom-right-radius: 50rpx;
+  letter-spacing: 3rpx;
 }
 
-.account-login-btn{
-    margin: 60rpx 0 40rpx 0;
-    height: 96rpx;
-    line-height: 96rpx;
-    font-size: 30rpx;
-    width: 100%;
-    border-radius: 6rpx;
-}
+.account-login-btn {
+  width: 90%;
+  margin: 0 auto;
+  color: #fff;
+  font-size: 30rpx;
+  height: 96rpx;
+  line-height: 96rpx;
+  right: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: flex;
+  bottom: 0;
+  left: 0;
+  border-radius: 0;
+  padding: 0;
+  margin-left: 5%;
+  text-align: center;
+  /* padding-left: -5rpx; */
+  border-top-left-radius: 50rpx;
+  border-bottom-left-radius: 50rpx;
+  border-top-right-radius: 50rpx;
+  border-bottom-right-radius: 50rpx;
+  letter-spacing: 3rpx;
+  background-image: linear-gradient(to right, #9a9ba1 0%, #9a9ba1 100%);
+}