diff --git a/wp-content/themes/sevastopol-tort-child/assets/css/home-page.css b/wp-content/themes/sevastopol-tort-child/assets/css/home-page.css index 6adc3cb..5e5d9cd 100644 --- a/wp-content/themes/sevastopol-tort-child/assets/css/home-page.css +++ b/wp-content/themes/sevastopol-tort-child/assets/css/home-page.css @@ -76,11 +76,34 @@ } .home-categories, -.home-steps { +.home-showcase, +.home-steps, +.home-delivery, +.home-portfolio, +.home-reviews, +.home-faq, +.home-final { padding: 70px 0; } -.home-categories__head { +.home-categories__inner, +.home-showcase__inner, +.home-steps__inner, +.home-delivery__inner, +.home-portfolio__inner, +.home-reviews__inner, +.home-faq__inner, +.home-final__inner { + width: min(100% - 40px, var(--container)); + margin: 0 auto; +} + +.home-categories__head, +.home-showcase__head, +.home-delivery__head, +.home-portfolio__head, +.home-reviews__head, +.home-faq__head { display: grid; gap: 18px; } @@ -123,6 +146,44 @@ padding: 10px 16px; } +.home-showcase__grid { + display: grid; + grid-template-columns: repeat(4, minmax(0, 1fr)); + gap: 22px; + margin-top: 30px; +} + +.home-product-card { + overflow: hidden; + border: 1px solid var(--color-line); + border-radius: var(--radius-md); + background: var(--color-surface); + box-shadow: var(--shadow-soft); +} + +.home-product-card__image { + width: 100%; + aspect-ratio: 1; + object-fit: cover; +} + +.home-product-card__content { + display: grid; + gap: 6px; + padding: 18px; +} + +.home-product-card__title { + font-size: var(--fz-md); + font-weight: 800; + line-height: 1.2; +} + +.home-product-card__price { + color: var(--color-accent-dark); + font-weight: 800; +} + .home-steps { background: var(--color-surface-soft); } @@ -169,3 +230,127 @@ color: #ffffff; font-weight: 800; } + +.home-delivery__grid { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 22px; + margin: 30px 0 10px; +} + +.home-portfolio { + background: var(--color-surface-soft); +} + +.home-portfolio__grid { + display: grid; + grid-template-columns: 1.1fr 0.9fr 0.9fr; + grid-auto-rows: 260px; + gap: 18px; + margin: 30px 0 10px; +} + +.home-portfolio__image { + width: 100%; + height: 100%; + border-radius: var(--radius-md); + object-fit: cover; + box-shadow: var(--shadow-soft); +} + +.home-portfolio__image:first-child { + grid-row: span 2; +} + +.home-reviews__grid { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 22px; + margin-top: 30px; +} + +.home-review-card { + display: grid; + gap: 18px; + min-height: 220px; + border: 1px solid var(--color-line); + border-radius: var(--radius-md); + background: var(--color-surface); + padding: 26px; + box-shadow: var(--shadow-soft); +} + +.home-review-card__text { + color: var(--color-muted); +} + +.home-review-card__author { + align-self: end; + font-weight: 800; +} + +.home-faq { + background: var(--color-surface-soft); +} + +.home-faq__list { + display: grid; + gap: 14px; + max-width: 860px; + margin-top: 30px; +} + +.home-faq__item { + border: 1px solid var(--color-line); + border-radius: var(--radius-md); + background: var(--color-surface); + padding: 20px 24px; +} + +.home-faq__question { + cursor: pointer; + font-weight: 800; +} + +.home-faq__answer { + margin-top: 12px; + color: var(--color-muted); +} + +.home-final__inner { + display: flex; + align-items: center; + justify-content: space-between; + gap: 32px; + border-radius: var(--radius-lg); + background: var(--color-text); + color: #ffffff; + padding: 42px; +} + +.home-final__content { + display: grid; + gap: 14px; + max-width: 640px; +} + +.home-final__title { + font-size: var(--fz-xl); + font-weight: 800; + line-height: var(--lh-tight); +} + +.home-final__text { + color: rgba(255, 255, 255, 0.76); +} + +.home-final__actions { + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 16px; +} + +.home-final .button-link { + color: #ffffff; +} diff --git a/wp-content/themes/sevastopol-tort-child/assets/css/layout.css b/wp-content/themes/sevastopol-tort-child/assets/css/layout.css index 5249758..54dfd99 100644 --- a/wp-content/themes/sevastopol-tort-child/assets/css/layout.css +++ b/wp-content/themes/sevastopol-tort-child/assets/css/layout.css @@ -84,6 +84,69 @@ color: var(--color-accent-dark); } +.site-header__menu-item--catalog { + position: relative; +} + +.site-header__menu-button { + display: inline-flex; + align-items: center; + gap: 8px; + min-height: 44px; +} + +.site-header__menu-button::after { + content: ""; + width: 8px; + height: 8px; + border-right: 2px solid currentColor; + border-bottom: 2px solid currentColor; + transform: rotate(45deg) translateY(-2px); +} + +.site-header__catalog { + position: absolute; + top: calc(100% + 14px); + left: 50%; + z-index: 70; + display: grid; + grid-template-columns: repeat(2, minmax(180px, 1fr)); + gap: 6px; + width: 420px; + border: 1px solid var(--color-line); + border-radius: var(--radius-md); + background: var(--color-surface); + padding: 14px; + box-shadow: var(--shadow-soft); + opacity: 0; + pointer-events: none; + transform: translate(-50%, 8px); + transition: opacity 0.2s ease, transform 0.2s ease; +} + +.site-header__menu-item--catalog:hover .site-header__catalog, +.site-header__menu-item--catalog.is-open .site-header__catalog { + opacity: 1; + pointer-events: auto; + transform: translate(-50%, 0); +} + +.site-header__catalog-link { + display: flex; + align-items: center; + min-height: 42px; + border-radius: var(--radius-sm); + color: var(--color-muted); + font-size: var(--fz-sm); + font-weight: 700; + padding: 0 12px; +} + +.site-header__catalog-link:hover { + background: var(--color-surface-soft); + color: var(--color-accent-dark); +} + .site-header__cta { display: inline-flex; align-items: center; diff --git a/wp-content/themes/sevastopol-tort-child/assets/css/responsive.css b/wp-content/themes/sevastopol-tort-child/assets/css/responsive.css index c059bb8..d71e915 100644 --- a/wp-content/themes/sevastopol-tort-child/assets/css/responsive.css +++ b/wp-content/themes/sevastopol-tort-child/assets/css/responsive.css @@ -58,10 +58,27 @@ .service-details__grid, .home-categories__grid, + .home-delivery__grid, + .home-reviews__grid, .site-footer__grid { grid-template-columns: 1fr; } + .home-showcase__grid { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + + .home-portfolio__grid { + grid-template-columns: 1fr; + grid-auto-rows: auto; + } + + .home-portfolio__image, + .home-portfolio__image:first-child { + aspect-ratio: 1; + grid-row: auto; + } + .service-hero__inner, .service-details__inner, .service-process__inner, @@ -86,6 +103,12 @@ aspect-ratio: 1; } + .home-final__inner { + align-items: flex-start; + flex-direction: column; + padding: 28px; + } + .section-title { font-size: 1.7rem; } @@ -123,6 +146,10 @@ justify-content: center; } + .home-showcase__grid { + grid-template-columns: 1fr; + } + .lead-form, .policy-content__block { padding: 20px; diff --git a/wp-content/themes/sevastopol-tort-child/assets/js/site.js b/wp-content/themes/sevastopol-tort-child/assets/js/site.js index 7e5f7fd..ae37dc5 100644 --- a/wp-content/themes/sevastopol-tort-child/assets/js/site.js +++ b/wp-content/themes/sevastopol-tort-child/assets/js/site.js @@ -3,6 +3,8 @@ var menu = document.querySelector('[data-mobile-menu]'); var toggle = document.querySelector('[data-menu-toggle]'); var closeNodes = document.querySelectorAll('[data-menu-close]'); + var catalogItem = document.querySelector('.site-header__menu-item--catalog'); + var catalogButton = document.querySelector('.site-header__menu-button'); var cookieNote = document.querySelector('[data-cookie-note]'); var cookieButton = document.querySelector('[data-cookie-accept]'); @@ -29,6 +31,21 @@ }); } + if (catalogItem && catalogButton) { + catalogButton.addEventListener('click', function (event) { + event.stopPropagation(); + var isOpen = catalogItem.classList.toggle('is-open'); + catalogButton.setAttribute('aria-expanded', isOpen ? 'true' : 'false'); + }); + + document.addEventListener('click', function (event) { + if (!catalogItem.contains(event.target)) { + catalogItem.classList.remove('is-open'); + catalogButton.setAttribute('aria-expanded', 'false'); + } + }); + } + if (cookieNote && cookieButton && window.localStorage) { if (localStorage.getItem('sevTortCookieAccepted') !== 'yes') { cookieNote.hidden = false; diff --git a/wp-content/themes/sevastopol-tort-child/front-page.php b/wp-content/themes/sevastopol-tort-child/front-page.php index 62933ae..41e684c 100644 --- a/wp-content/themes/sevastopol-tort-child/front-page.php +++ b/wp-content/themes/sevastopol-tort-child/front-page.php @@ -40,6 +40,37 @@ get_header(); +
+
+
+ Популярные позиции +

Хиты недели с ценой от 2 300 ₽

+
+
+ 'Бенто с надписью', 'price' => 'от 2 300 ₽', 'image' => 'cake-002.jpg', 'alt' => 'Бенто торт с надписью' ), + array( 'title' => 'Авторский бенто', 'price' => 'от 2 500 ₽', 'image' => 'cake-006.jpg', 'alt' => 'Авторский бенто торт' ), + array( 'title' => 'Нежный декор', 'price' => 'от 2 800 ₽', 'image' => 'cake-010.jpg', 'alt' => 'Торт для мамы' ), + array( 'title' => 'Персональный дизайн', 'price' => 'от 2 900 ₽', 'image' => 'cake-015.jpg', 'alt' => 'Бенто с иллюстрацией' ), + array( 'title' => 'Романтичный формат', 'price' => 'от 2 700 ₽', 'image' => 'cake-020.jpg', 'alt' => 'Красный праздничный торт' ), + array( 'title' => 'Праздничный бенто', 'price' => 'от 2 600 ₽', 'image' => 'cake-025.jpg', 'alt' => 'Праздничный торт' ), + array( 'title' => 'Минимализм', 'price' => 'от 2 400 ₽', 'image' => 'cake-030.jpg', 'alt' => 'Минималистичный торт' ), + array( 'title' => 'Яркий акцент', 'price' => 'от 2 650 ₽', 'image' => 'cake-038.jpg', 'alt' => 'Голубой торт с надписью' ), + ); + ?> + +
+ <?php echo esc_attr( $item['alt'] ); ?> +
+

+ +
+
+ +
+
+
@@ -55,6 +86,104 @@ get_header(); 'Обсудить торт', 'page' => 'Главная' ) ); ?>
+
+
+
+ Условия +

Доставка и оплата

+
+
+
+ 01 +

Доставка по городу

+

Курьер по Севастополю в согласованный интервал. Упаковка подбирается под формат торта.

+
+
+ 02 +

Самовывоз

+

Можно забрать заказ самостоятельно после подтверждения готовности и времени выдачи.

+
+
+ 03 +

Оплата

+

После согласования заказа подскажем доступный способ оплаты и размер предоплаты.

+
+
+ Подробнее об условиях +
+
+
+
+
+ Реальные работы +

Портфолио тортов

+
+
+ Шоколадный торт с ягодами + Торт с красным декором и ягодами + Торт книга с ягодным декором + Корпоративный торт +
+ Смотреть все работы +
+
+
+
+
+ Отзывы +

Отзывы клиентов

+
+
+
+

Заказывали торт на день рождения, получилось даже лучше референса. Очень аккуратная доставка.

+ Анна, Севастополь +
+
+

Сделали срочный заказ за сутки. Вкус, внешний вид и упаковка - все на высоте.

+ Максим, Инкерман +
+
+

Помогли подобрать начинку для детского праздника. Дети и взрослые в восторге.

+ Ирина, Балаклава +
+
+
+
+
+
+
+ FAQ +

Частые вопросы

+
+
+
+ За сколько дней нужно оформлять заказ? +

Оптимально за 2-4 дня. Срочные заказы возможны при свободном окне производства.

+
+
+ Можно ли сделать торт по фото? +

Да, повторяем референс или адаптируем идею под ваш бюджет и формат.

+
+
+ Есть ли дегустационный набор начинок? +

Да, доступен сет начинок. Подробности и актуальную цену пришлем в мессенджер.

+
+
+
+
+
+
+
+

Обсудим ваш торт за 10 минут

+

Напишите нам в мессенджер или оставьте заявку, чтобы получить 2-3 идеи оформления и ориентир по цене.

+
+ +
+
Заказать торт