personal data form change

This commit is contained in:
Meylis Gazakow 2022-04-05 14:48:23 +03:00
parent 6d64468dba
commit 771a2f13d0
3 changed files with 102 additions and 6 deletions

View File

@ -685,6 +685,7 @@ li {
padding: 10px 30px;
border-radius: 5px;
color: #fff;
margin-left: 10px;
}
.post_icon {
@ -2919,7 +2920,6 @@ li {
.post_form {
display: flex;
align-items: center;
flex-wrap: wrap;
-ms-flex-wrap: wrap;
-o-flex-wrap: wrap;
@ -2963,6 +2963,19 @@ li {
line-height: 1.3;
}
.error_txt {
font-size: 13px;
font-weight: 400;
line-height: 1.4;
color: red;
margin-top: 5px;
display: inline-block;
}
.verify_input input {
padding-right: 60px;
}
.post_input input[type="password"]::placeholder {
padding-top: 10px;
}
@ -3000,6 +3013,34 @@ li {
color: red;
}
.verify {
position: absolute;
top: 55px;
right: 30px;
width: 20px;
height: 20px;
cursor: pointer;
pointer-events: none;
}
.verify svg rect {
fill: #003197;
}
.verify svg {
width: 100%;
height: 100%;
object-fit: contain;
-o-object-fit: contain;
}
.verify.disabled {
pointer-events: unset;
}
.verify.disabled svg path {
stroke: #ABA17D;
}
.post_comment {
width: calc(100% - 40px);
@ -3132,9 +3173,8 @@ li {
height: 20px;
position: absolute;
top: 70%;
top: 57px;
right: 30px;
transform: translateY(-50%);
cursor: pointer;
}
@ -6386,6 +6426,17 @@ input::-webkit-calendar-picker-indicator {
height: 16px;
}
/* forms ================= */
.verify {
right: 20px;
top: 45px;
}
.eye {
top: 45px;
right: 20px;
}
}
@media(max-width: 600px) {

View File

@ -0,0 +1,5 @@
<svg width="30" height="30" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="30" height="30" rx="3" fill="#003197"/>
<path d="M23.8238 16.0404C23.1179 19.5697 20.457 22.8927 16.723 23.6353C14.902 23.9979 13.0129 23.7768 11.3248 23.0034C9.63667 22.23 8.23561 20.9437 7.32108 19.3277C6.40656 17.7117 6.02519 15.8483 6.23128 14.0029C6.43737 12.1575 7.22042 10.4242 8.46893 9.04975C11.0297 6.22921 15.3537 5.45278 18.8829 6.86447" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M11.8242 14.6285L15.3534 18.1578L23.8235 8.98178" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

After

Width:  |  Height:  |  Size: 691 B

View File

@ -283,16 +283,48 @@
<div class="post_input">
<label for="last_name">Фамилия</label>
<input type="text" placeholder="Аманов" id="last_name" name="last_name">
<span class="error_txt">
Smth went wrong
</span>
</div>
<div class="post_input">
<div class="post_input verify_input">
<label for="blue_mail">Электронный адрес</label>
<input type="email" placeholder="amanamanow@gmail.com" id="blue_mail" name="blue_mail">
<a href="#" class="verify verify_mail">
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M18.8238 11.0404C18.1179 14.5697 15.457 17.8927 11.723 18.6353C9.90196 18.9979 8.01288 18.7768 6.32477 18.0034C4.63667 17.23 3.23561 15.9437 2.32108 14.3277C1.40656 12.7117 1.02519 10.8483 1.23128 9.00289C1.43737 7.15752 2.22042 5.42421 3.46893 4.04975C6.02973 1.22921 10.3537 0.452783 13.8829 1.86447"
stroke="#003197" stroke-width="1.5" stroke-linecap="round"
stroke-linejoin="round" />
<path d="M6.82422 9.62852L10.3534 13.1578L18.8235 3.98178" stroke="#003197"
stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
</svg>
</a>
<span class="error_txt">
Smth went wrong
</span>
</div>
<div class="post_input">
<div class="post_input verify_input">
<label for="phone_num">Номер телефона</label>
<input type="text" placeholder="+993 65656565" id="phone_num" name="phone_num">
<a href="#" class="verify disabled verify_phone">
<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M18.8238 11.0404C18.1179 14.5697 15.457 17.8927 11.723 18.6353C9.90196 18.9979 8.01288 18.7768 6.32477 18.0034C4.63667 17.23 3.23561 15.9437 2.32108 14.3277C1.40656 12.7117 1.02519 10.8483 1.23128 9.00289C1.43737 7.15752 2.22042 5.42421 3.46893 4.04975C6.02973 1.22921 10.3537 0.452783 13.8829 1.86447"
stroke="#003197" stroke-width="1.5" stroke-linecap="round"
stroke-linejoin="round" />
<path d="M6.82422 9.62852L10.3534 13.1578L18.8235 3.98178" stroke="#003197"
stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
</svg>
</a>
</div>
<div class="post_input">
@ -311,6 +343,10 @@
<img class="eye_off" src="images/svg/eye-off.svg" alt="eye">
<img class="eye_on" src="images/svg/eye.svg" alt="eye">
</div>
<span class="error_txt">
Smth went wrong
</span>
</div>
<div class="post_input">
@ -321,6 +357,10 @@
<div class="post_input">
<label for="log-in">Номер легализация</label>
<input type="text" placeholder="Aman Amanow" id="log-in" name="log-in">
<span class="error_txt">
Smth went wrong Smth went wrong
</span>
</div>
<div class="post_input">
@ -410,4 +450,4 @@
</body>
</html>
</html>