@charset "UTF-8"; /* 需要放到文件最上面 */ /* 水平间距 */ /* 水平间距 */ /* 以下变量是默认值,如不需要修改可以不用给下面的变量重新赋值 */ /* 水平间距 */ .login-container { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; } .login-container .logo { margin-top: 80rpx; width: 150rpx; height: 150rpx; } .login-container .logo image { width: 100%; height: 100%; } .login-container .code-input-container { display: flex; align-items: center; margin-top: 20rpx; } .login-container .code-input-container .code-input { background: #F7F8FA; width: 306rpx; height: 84rpx; line-height: 84rpx; padding: 0 20rpx; border-radius: 20rpx; box-sizing: border-box; } .login-container .code-input-container .code-input::-webkit-input-placeholder { line-height: 84rpx; } .login-container .code-input-container .code-input::placeholder { line-height: 84rpx; } .login-container .code-input-container .code-canvas-wrapper { flex: 1; } .login-container .code-input-container .code-canvas-wrapper .code-image { width: 100%; height: 84rpx; } .login-container .form { margin-top: 70rpx; display: flex; flex-direction: column; align-items: center; width: 686rpx; margin: 70rpx auto; } .login-container .form .form-item { width: 100%; border-radius: 200rpx; height: 100rpx; background-color: #ffffff; display: flex; margin-bottom: 50rpx; } .login-container .form .form-item:last-of-type { margin-bottom: 0; } .login-container .form .form-input-item { height: 100%; width: 100%; display: flex; align-items: center; box-sizing: border-box; } .login-container .form .form-input-item .form-input-left { display: flex; align-items: center; margin-left: 30rpx; } .login-container .form .form-input-item .form-input-left .form-input-icons text { color: #909399 !important; } .login-container .form .form-input-item .phone-info { margin-left: 20rpx; } .login-container .form .form-input-item .phone-info .phone-info-txt { margin-right: 8rpx; } .login-container .form .form-input-item .phone-info .phone-info-img { width: 24rpx; height: 24rpx; } .login-container .form .form-input-item .form-input-content { flex: 1 1 auto; padding-right: 20rpx; position: relative; } .login-container .form .form-input-item .form-input-content .form-input { width: 100%; padding-left: 20rpx; } .login-container .form .form-input-item .form-input-content .form-input .uni-input-placeholder { color: #C8C9CC; } .login-container .form .code-input-wrapper { display: flex; align-items: center; } .login-container .form .code-input-wrapper .code-input-btn { width: auto; width: 200rpx; height: 64rpx; font-size: 24rpx; padding: 12rpx 40rpx; white-space: nowrap; display: flex; align-items: center; justify-content: center; border-radius: 200rpx; background: #3371FF; color: #fff; } .login-container .form .code-input-wrapper .code-input-btn.disabled { opacity: 0.5; } .login-container .form .code-input-wrapper .code-input-btn::after { display: none; } .login-container .form .form-btn-container { margin-top: 20rpx; width: 100%; } .login-container .form .form-btn { height: 88rpx; border-radius: 200rpx; padding: 24rpx 32rpx; line-height: 40rpx; color: #ffffff; background-color: #3371FF; font-size: 32rpx; } .login-container .form .form-btn.disabled { opacity: 0.5; } .login-container .form .form-btn::after { display: none; } .login-container .form .wx-btn { height: 88rpx; padding: 24rpx 32rpx; border-radius: 200rpx; line-height: 40rpx; font-size: 32rpx; color: #ffffff; background-color: #18bc37; } .login-container .form .wx-btn::after { display: none; }