From 2c3f548e831557464be75d1cfb38ec774f71f656 Mon Sep 17 00:00:00 2001 From: Kirill Pet Date: Thu, 14 Nov 2024 19:15:48 +0300 Subject: [PATCH] save order --- assets/css/gp-style-core.css | 31 +- assets/css/gp-style-order.css | 118 ++++++++ assets/js/gp-form.js | 25 +- order.html | 549 ++++++++++++++++++++++++++++++++++ registration.html | 5 +- 5 files changed, 709 insertions(+), 19 deletions(-) create mode 100644 assets/css/gp-style-order.css create mode 100644 order.html diff --git a/assets/css/gp-style-core.css b/assets/css/gp-style-core.css index b4cbd3a..49c9410 100644 --- a/assets/css/gp-style-core.css +++ b/assets/css/gp-style-core.css @@ -304,7 +304,7 @@ button{ .main-menu__item:hover{ opacity: .8; - background: #f2f2f2; + background: var(--background-grey); border-radius: 24px; } .header.white .main-menu__item:hover .main-menu__link{ @@ -919,6 +919,31 @@ button{ display: block; } /* .form-input-radio__ */ + +.form-agreement{ + display: flex; +} +.form-agreement__check{ + display: flex; + align-items: center; +} +.form-agreement__square{ + width: 18px; + aspect-ratio: 1; + + border-radius: 4px; + + border: 2px solid var(--background-black); +} +.form-agreement__label{ + margin-left: 8px; + + font-family: var(--font-family); + font-weight: 400; + font-size: 20px; + line-height: 120%; + color: var(--text-black); +} /* form */ @@ -1125,7 +1150,7 @@ button{ border-radius: 48px; } .to-know{ - width: 100%; + /* width: 100%; */ padding: 12px 24px 7px 24px; @@ -1538,7 +1563,7 @@ button{ display: flex; - border-top: 1px solid #f2f2f2; + border-top: 1px solid var(--background-grey); position: relative; } diff --git a/assets/css/gp-style-order.css b/assets/css/gp-style-order.css new file mode 100644 index 0000000..3a228c7 --- /dev/null +++ b/assets/css/gp-style-order.css @@ -0,0 +1,118 @@ +.order{ + display: flex; +} +.order__title{ + font-family: var(--font-family); + font-weight: 700; + font-size: 24px; + line-height: 117%; + text-transform: uppercase; + color: var(--text-black); +} +.order__contacts{ + width: calc(50% - 0.5px); + + padding: 24px; + + border-right: 1px solid #121212; +} +.order-contacts__header{ + display: flex; + justify-content: space-between; + align-items: center; +} +.order-contacts__form{ + margin-top: 24px; +} +.order-contacts__delivery{ + margin-top: 47.5px; + + padding-top: 9.5px; + + border-top: 1px solid var(--background-grey); +} + +.order__your{ + width: calc(50% - 0.5px); + + padding: 24px 24px 24px 48px; + + background: var(--background-grey); +} +.order-your__products{ + margin-top: 48px; +} +.order-your-products__item{ + margin-top: 16px; + + display: flex; + justify-content: space-between; +} +.order-your-products__left{ + display: flex; +} +.order-your-products__img{ + width: 40px; + aspect-ratio: 1; + + border-radius: 16px; +} +.order-your-products__content{ + margin-left: 16px; +} +.order-your-products__name{ + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-black); +} +.order-your-products__description{ + margin-top: 8px; + + font-family: var(--font-family); + font-weight: 500; + font-size: 12px; + line-height: 133%; + color: var(--text-6); +} +.order-your-products__right{ + display: flex; +} +.order-your-products__count{ + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-6); +} +.order-your-products__count::before{ + content: 'x'; +} +.order-your-products__price{ + margin-left: 16px; + + font-family: var(--font-family); + font-weight: 700; + font-size: 12px; + line-height: 133%; + text-align: right; + color: var(--text-black); +} +.order-your-products__price::after{ + content: 'Р'; +} +.order-your__calculation{ + margin-top: 48px; +} +.order-your__promo{ + display: flex; +} +.order-your-promo__input{ + border-color: var(--background-9); +} +.order-your-promo__button{ + margin-left: 8px; +} +.order-your__ \ No newline at end of file diff --git a/assets/js/gp-form.js b/assets/js/gp-form.js index 348db1f..d5ea968 100644 --- a/assets/js/gp-form.js +++ b/assets/js/gp-form.js @@ -164,9 +164,6 @@ remoteControl('.modal-map__control', '.modal-map-control__item'); function remoteControl(main, button) { let mains = document.querySelectorAll(main); - console.log(mains); - - mains.forEach(main => { let subjectClass = main.dataset.content, subject = document.querySelector(`.${subjectClass}`), @@ -189,18 +186,18 @@ 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); +// function formCheck(form, submit) { +// let forms = document.querySelectorAll(form); - forms.forEach(form => { - let thisSubmit = form.querySelector(submit); +// forms.forEach(form => { +// let thisSubmit = form.querySelector(submit); - thisSubmit.onclick = function () { - form.classList.add('check') - } +// thisSubmit.onclick = function () { +// form.classList.add('check') +// } - }) -} \ No newline at end of file +// }) +// } \ No newline at end of file diff --git a/order.html b/order.html new file mode 100644 index 0000000..416895e --- /dev/null +++ b/order.html @@ -0,0 +1,549 @@ + + + + + + + SEO title + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ + + + + + +
+
+
+ +
+ +
+ +
+
+
+ + + + +
+
+ +
+
+
+
+
+
+
+ Кошкам + +
+
+ Собакам + +
+
+
+ +
+
+ + ГЛАВНАЯ + +
+
+ + ПРОДУКЦИЯ + + Кошкам + + Собакам + +
+
+ + О COSMOPET + +
+
+ + ПРОИЗВОДСТВО + +
+
+ + БЛОГ + +
+
+
+
+ +
+
+
+
+

+ Контакты получателя +

+ + +
+ +
+
+
+ + + Имя введено неверно +
+
+ +
+
+
+ + +
+ text
+ re +
+
+ + Email введен неверно +
+
+ +
+
+ +
+
+

7

+ +
Номер введён неверно
+
+ +
+ + + + + + + + + + + +
+
+
+
+
+ +
+
+
+
+

Запомнить меня

+
+
+
+ +
+
+ + + +
+ +
+
+ 1 +
+
+ 2 +
+
+
+
+ +
+

Ваш заказ

+ +
+
+
+ + +
+

Сухой корм, для крупных и средних пород

+

Индейка, 2 кг

+
+
+ +
+

+ 3 +

+

+ 10290 +

+
+
+ +
+
+ + +
+

Сухой корм, для крупных и средних пород

+

Индейка, 2 кг

+
+
+ +
+

+ 3 +

+

+ 10290 +

+
+
+ +
+
+ + +
+

Сухой корм, для крупных и средних пород

+

Индейка, 2 кг

+
+
+ +
+

+ 3 +

+

+ 10290 +

+
+
+
+ +
+
+ + + +
+
+
+
+
+ + + +
+ +
+ + + + + + \ No newline at end of file diff --git a/registration.html b/registration.html index 126c839..85f5489 100644 --- a/registration.html +++ b/registration.html @@ -11,6 +11,7 @@ + @@ -571,11 +572,11 @@ -
+