修复H5与App密码框及眼睛图标显示不一致问题
This commit is contained in:
parent
75a145ecd2
commit
ac5283d72e
@ -1253,7 +1253,11 @@ export default {
|
|||||||
height: 76rpx;
|
height: 76rpx;
|
||||||
padding: 0 16rpx;
|
padding: 0 16rpx;
|
||||||
font-size: 28rpx;
|
font-size: 28rpx;
|
||||||
|
color: #303133;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
width: 100%;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-input:focus {
|
.form-input:focus {
|
||||||
@ -2181,22 +2185,44 @@ export default {
|
|||||||
/* ========== 密码框 ========== */
|
/* ========== 密码框 ========== */
|
||||||
.password-wrapper {
|
.password-wrapper {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.password-input {
|
.password-input {
|
||||||
padding-right: 80rpx !important;
|
flex: 1;
|
||||||
|
padding-right: 90rpx !important;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* H5浏览器密码框默认眼睛图标隐藏 */
|
||||||
|
.password-input::-webkit-credentials-auto-fill-button,
|
||||||
|
.password-input::-webkit-reveal,
|
||||||
|
.password-input::-ms-reveal {
|
||||||
|
display: none !important;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* H5密码框自动填充背景色覆盖 */
|
||||||
|
.password-input:-webkit-autofill {
|
||||||
|
-webkit-box-shadow: 0 0 0 1000rpx #ffffff inset !important;
|
||||||
|
-webkit-text-fill-color: #303133 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.password-eye {
|
.password-eye {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 0;
|
right: 8rpx;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
transform: translateY(-50%);
|
transform: translateY(-50%);
|
||||||
width: 72rpx;
|
width: 64rpx;
|
||||||
height: 72rpx;
|
height: 64rpx;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
z-index: 10;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ========== 眼睛图标 CSS 实现 ========== */
|
/* ========== 眼睛图标 CSS 实现 ========== */
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user