Good-Production
/
template-for-verstka
13
2
Fork 0
Code Pull Requests Releases Wiki Activity

fix 16.11

Browse Source
cosmopet--Memento-mori-dev
Kirill Pet 9 months ago
parent fe7909e9cc
commit c344dbcd43
5 changed files with 82 additions and 69 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 6
      assets/css/gp-style-core.css
  2. 4
      assets/css/gp-style-mobile.css
  3. 16
      assets/css/gp-style-order.css
  4. 59
      assets/js/gp-form.js
  5. 64
      order.html

6
assets/css/gp-style-core.css
Unescape View File

@ -1781,6 +1781,8 @@ button{
background-position: center;
transition: opacity .2s ease-out;
z-index: 10;
}
.modal-form__close--white{
background-image: url(../img/svg/main/white-x.svg);
@ -1856,6 +1858,10 @@ button{
display: flex;
justify-content: space-between;
}
.modal-form-content__line--two-mobile{
display: flex;
justify-content: space-between;
}
.modal-form-content-line__element{
position: relative;
}

4
assets/css/gp-style-mobile.css
Unescape View File

@ -99,6 +99,9 @@
.modal-form-content__line--three .modal-form-content-line__element:nth-child(3){
width: 82px;
}
.modal-form-content__line--two-mobile .modal-form-content-line__element{
width: calc(50% - 12px);
}
.form__input{
padding: 12px 14px;
}
@ -204,6 +207,7 @@
.cabinet-card__content{
padding-right: 19px;
}
/* .cabinet-card__order.active */
/* .cabinet-card__order.active */
/* cabinet */

16
assets/css/gp-style-order.css
Unescape View File

@ -92,6 +92,14 @@
line-height: 133%;
color: var(--text-6);
}
.order-your-products__description span{
font-weight: 700;
}
.order-your-products__description span::before{
margin-left: 3px;
content: 'x ';
}
.order-your-products__right{
display: flex;
}
@ -198,6 +206,8 @@
@media only screen and (max-width: 720px) {
.order__title{
max-width: 181px;
font-size: 20px;
line-height: 120%;
}
@ -219,4 +229,10 @@
width: 100%;
}
.order-your-products__content{
max-width: 164px;
}
.order-your-products__count, .order-your-products__price{
flex-shrink: 0;
}
}

59
assets/js/gp-form.js
Unescape View File

@ -173,9 +173,6 @@ function remoteControl(main, button) {
subject = document.querySelector(`.${subjectClass}`),
buttons = Array.from(main.querySelectorAll(button));
console.log(main);
main.addEventListener('click', function (eventMain) {
setTimeout(() => {
let indexActive = buttons.findIndex((button, index) => {
@ -194,18 +191,52 @@ function remoteControl(main, button) {
})
}
// formCheck('.modal-form__content', 'input[type=submit]');
// formCheck('.modal-map__form', 'input[type=submit]');
formCheck('.modal-form__content', 'input[type=submit]');
formCheck('.modal-map__form', 'input[type=submit]');
function formCheck(form, submit) {
let forms = document.querySelectorAll(form);
forms.forEach(form => {
let thisSubmit = form.querySelector(submit);
thisSubmit.onclick = function () {
form.classList.add('check')
}
})
}
inputPhoneNoFlag('.no-flag');
function inputPhoneNoFlag(input){
let inputs = document.querySelectorAll(input);
inputs.forEach(input => {
let code = '+' + input.dataset.code;
input.onfocus = function () {
if (input.value == '') {
input.value = code;
}
}
// function formCheck(form, submit) {
// let forms = document.querySelectorAll(form);
input.addEventListener('input', function(event) {
let text = event.target.value;
let length = text.length;
let newSymbol = event.data;
// forms.forEach(form => {
// let thisSubmit = form.querySelector(submit);
if (isNaN(event.data) || event.data == ' ') {
event.target.value = text.slice(0, -1);
return;
}
// thisSubmit.onclick = function () {
// form.classList.add('check')
// }
if (length == 3 || length == 7 || length == 11) {
if (newSymbol != null) {
event.target.value = text.slice(0, -1) + ' ' + newSymbol;
}
}
// })
// }
})
})
}

64
order.html
Unescape View File

@ -238,7 +238,7 @@
</button>
</div>
<form action="" class="order-contacts__form modal-form__content">
<form action="" class="order-contacts__form">
<div class="modal-form-content__line">
<div class="modal-form-content-line__element">
<label for="firstname" class="label-name">Имя и фамилия</label>
@ -265,54 +265,10 @@
</div>
<div class="modal-form-content__line">
<div class="modal-form-content__line">
<div class="modal-form-content-line__element">
<label for="firstname" class="label-name">Телефон</label>
<div class="form-input__phone">
<div class="form-input-phone__icon" style="background-image: url(assets/img/svg/country/ru.svg);"></div>
<p class="form-input-phone__code">7</p>
<input type="text" placeholder="___ ___ ____" pattern="[0-9]{3}\s[0-9]{3}\s[0-9]{4}" minlength="12" maxlength="12" class="form-input-phone__input" required="">
<div class="form-input__error form-input__error--absolute">Номер введён неверно</div>
<div class="form-input-phone__list">
<input type="text" placeholder="Поиск" class="form-input-phone-list__search">
<div class="form-input-phone-list__content">
<button class="form-input-phone-list__item">
<img src="assets/img/svg/country/ru.svg" alt="" class="form-input-phone-list-item__icon">
<p class="form-input-phone-list-item__name">Россия</p>
<p class="form-input-phone-list-item__code">7</p>
</button>
<button class="form-input-phone-list__item">
<img src="assets/img/svg/country/ar.svg" alt="" class="form-input-phone-list-item__icon">
<p class="form-input-phone-list-item__name">Армения</p>
<p class="form-input-phone-list-item__code">374</p>
</button>
<button class="form-input-phone-list__item">
<img src="assets/img/svg/country/ar.svg" alt="" class="form-input-phone-list-item__icon">
<p class="form-input-phone-list-item__name">Армения</p>
<p class="form-input-phone-list-item__code">374</p>
</button>
<button class="form-input-phone-list__item">
<img src="assets/img/svg/country/ar.svg" alt="" class="form-input-phone-list-item__icon">
<p class="form-input-phone-list-item__name">Армения</p>
<p class="form-input-phone-list-item__code">374</p>
</button>
<button class="form-input-phone-list__item">
<img src="assets/img/svg/country/ar.svg" alt="" class="form-input-phone-list-item__icon">
<p class="form-input-phone-list-item__name">Армения</p>
<p class="form-input-phone-list-item__code">374</p>
</button>
<button class="form-input-phone-list__item">
<img src="assets/img/svg/country/ar.svg" alt="" class="form-input-phone-list-item__icon">
<p class="form-input-phone-list-item__name">Армения</p>
<p class="form-input-phone-list-item__code">374</p>
</button>
</div>
</div>
</div>
<input id="firstname" class="form__input no-flag" type="text" maxlength="15" minlength="15" name="name" pattern="7\s[0-9]{3}\s[0-9]{3}\s[0-9]{4}" placeholder="+7 ___ ___ ____" required="" data-code="7">
<span class="form-input__error form-input__error--absolute">Номер телефона введен неверно</span>
</div>
</div>
@ -422,7 +378,7 @@
<div class="order-contacts-deliver__item">
<div class="modal-form-content-line__element">
<label for="firstname" class="label-name">Комментарий для доставки</label>
<textarea id="firstname" class="form__input form__input--textarea-72 form__input--grey" type="text" name="name" placeholder="Для служьы доставки" required="" ></textarea>
<textarea id="firstname" class="form__input form__input--textarea-72 form__input--grey" type="text" name="name" placeholder="Для службы доставки" required="" ></textarea>
</div>
</div>
</div>
@ -480,7 +436,7 @@
<div class="order-your-products__content">
<p class="order-your-products__name">Сухой корм, для крупных и средних пород </p>
<p class="order-your-products__description">Индейка, 2 кг </p>
<p class="order-your-products__description">Индейка, 2 кг<span>1</span></p>
</div>
</div>
@ -631,12 +587,12 @@
<div class="modal-form modal-form--cdek form__full-mobile modal-form--white modal-form--height-100-phone form-point">
<button class="modal-form__close"></button>
iframe
<div style="position:relative;overflow:hidden;"><a href="https://yandex.ru/maps/213/moscow/?utm_medium=mapframe&amp;utm_source=maps" style="color:#eee;font-size:12px;position:absolute;top:0px;">Москва</a><a href="https://yandex.ru/maps/213/moscow/?ll=37.710230%2C55.812249&amp;mode=whatshere&amp;utm_medium=mapframe&amp;utm_source=maps&amp;whatshere%5Bpoint%5D=37.622787%2C55.774846&amp;whatshere%5Bzoom%5D=6.31&amp;z=12.54" style="color:#eee;font-size:12px;position:absolute;top:14px;">Яндекс&nbsp;Карты — транспорт, навигация, поиск мест</a><iframe src="https://yandex.ru/map-widget/v1/?ll=37.710230%2C55.812249&amp;mode=whatshere&amp;whatshere%5Bpoint%5D=37.622787%2C55.774846&amp;whatshere%5Bzoom%5D=6.31&amp;z=12.54" width="560" height="400" frameborder="1" allowfullscreen="true" style="position:relative;"></iframe></div>
</div>
<div class="modal-form form__full-mobile modal-form--white modal-form--height-100-phone form-address">
<button class="modal-form__close"></button>
<p class="modal-form__title">Изменить мои данные</p>
<p class="modal-form__title">АДРЕС</p>
<form class="modal-form__content " method="post" action="/send-telegram.php">
<div class="modal-form-content-line__element">
@ -645,7 +601,7 @@
<span class="form-input__error form-input__error--absolute">Имя введено неверно</span>
</div>
<div class="modal-form-content__line modal-form-content__line--two">
<div class="modal-form-content__line modal-form-content__line--two-mobile">
<div class="modal-form-content-line__element">
<label for="firstname" class="label-name">Квартира</label>
<input id="firstname" class="form__input" type="text" name="name" placeholder="Квартира" required="">
@ -659,7 +615,7 @@
</div>
</div>
<div class="modal-form-content__line modal-form-content__line--two">
<div class="modal-form-content__line modal-form-content__line--two-mobile">
<div class="modal-form-content-line__element">
<label for="firstname" class="label-name">Подъезд</label>
<input id="firstname" class="form__input" type="text" name="name" placeholder="Подъезд" required="">

Write Preview
Loading…
Cancel
Save