za-ek/marketing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
f0ffd8986001939de76d07b02e8e7c1f7c051bf0
marketing/src/auto_cart.html
T

536 lines
28 KiB
HTML
Raw Normal View History

promo!
2026-08-21 17:52:45 +03:00
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Автокорзина</title>
promo!
2026-08-21 18:17:08 +03:00
<style nonce="**MY_PRETTY_CSP_NONCE**">
promo!
2026-08-21 17:52:45 +03:00
/* Базовые сбросы */
* { margin: 0; padding: 0; box-sizing: border-box; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
body { background-color: #f5f7f8; display: flex; justify-content: center; align-items: flex-start; padding: 40px 20px; min-height: 100vh; }
.container { display: flex; width: 100%; max-width: 1200px; background: #ffffff; border-radius: 24px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04); overflow: hidden; max-height: 90vh; }
/* --- Колонки --- */
.column { padding: 30px; flex: 1; width: 50%; overflow-y: auto;}
.column + .column { border-left: 1px solid #f0f0f0; }
/* --- Левая колонка (Фиксированная высота) --- */
.col-left { display: flex; flex-direction: column; height: auto; min-height: 550px; }
h1 { font-size: 24px; font-weight: 700; color: #1c1c1c; margin-bottom: 6px; }
.subtitle { font-size: 14px; color: #8b8b8b; margin-bottom: 28px; flex-shrink: 0; }
.cart-summary { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; flex-shrink: 0; }
.summary-title { font-size: 18px; font-weight: 600; color: #1c1c1c; }
.summary-days { color: #6ba531; }
.summary-details { font-size: 14px; color: #8b8b8b; margin-top: 4px; }
.reorder-btn { padding: 8px 16px; background: transparent; border: 1px solid #6ba531; color: #6ba531; border-radius: 8px; cursor: pointer; font-size: 14px; transition: 0.2s; flex-shrink: 0; }
.reorder-btn:hover { background: #6ba531; color: #fff; }
/* Список и скролл */
.cart-scroll-wrapper { flex: 1; overflow-y: auto; overflow-x: hidden; padding-right: 4px; margin-bottom: 10px; position: relative; transition: max-height 0.3s ease; }
.cart-scroll-wrapper::-webkit-scrollbar { width: 6px; }
.cart-scroll-wrapper::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 4px; }
.cart-scroll-wrapper::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 4px; }
.cart-items { list-style: none; }
.cart-item { display: flex; align-items: center; padding: 16px 0; border-bottom: 1px solid #f0f0f0; position: relative; transition: opacity 0.4s, transform 0.4s; }
.cart-item.replacing { opacity: 0.5; pointer-events: none; }
.item-image { width: 72px; height: 65px; border-radius: 8px; background-color: #f8f9fa; display: flex; align-items: center; justify-content: center; font-size: 28px; margin-right: 16px; flex-shrink: 0; position: relative; overflow: hidden; }
/* Лоадер при замене */
.cart-item.replacing .item-image::after {
content: '';
position: absolute;
width: 30px; height: 30px;
border: 3px solid #e1e1e1;
border-top: 3px solid #6ba531;
border-radius: 50%;
animation: spin 0.8s linear infinite;
}
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.item-details { flex: 1; }
.item-name { font-size: 15px; color: #1c1c1c; margin-bottom: 4px; }
.item-price { font-size: 14px; color: #8b8b8b; }
/* Меню (Три точки) */
.menu-btn-wrapper { position: relative; }
.menu-btn { background: none; border: none; color: #b0b0b0; cursor: pointer; padding: 4px 8px; font-size: 20px; letter-spacing: 2px; border-radius: 4px; transition: 0.2s; }
.menu-btn:hover { background: #f3f4f6; color: #1c1c1c; }
.menu-dropdown { position: absolute; right: 0; top: 100%; background: #ffffff; border: 1px solid #eee; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.08); min-width: 150px; padding: 6px 0; display: none; z-index: 10; margin-top: 4px; }
.menu-dropdown.active { display: block; }
.menu-dropdown ul { list-style: none; }
.menu-dropdown li { padding: 10px 16px; font-size: 14px; color: #1c1c1c; cursor: pointer; transition: 0.2s; }
.menu-dropdown li:hover { background: #f3f4f6; }
.show-more { display: flex; align-items: center; justify-content: center; padding: 20px 0 10px; color: #6ba531; font-size: 14px; cursor: pointer; font-weight: 500; transition: 0.2s; flex-shrink: 0; gap: 4px;}
.show-more:hover { opacity: 0.8; }
.show-more svg { margin-left: 6px; width: 14px; height: 14px; stroke: #6ba531; }
.show-more.hidden { display: none; }
.cart-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 20px; border-top: 1px solid #f0f0f0; flex-shrink: 0; }
.total-wrap { display: flex; flex-direction: column; align-items: flex-start; }
.total-label { font-size: 14px; color: #8b8b8b; }
#total-price { font-size: 22px; font-weight: 700; color: #1c1c1c; }
.checkout-btn { background-color: #6ba531; color: #ffffff; border: none; padding: 14px 32px; border-radius: 12px; font-size: 16px; font-weight: 600; cursor: pointer; transition: background 0.2s; }
.checkout-btn:hover { background-color: #5b8f29; }
/* --- Правая колонка (Аккордеон) --- */
.settings-panel { border: 1px solid #ebebeb; border-radius: 16px;}
.accordion-item { border-bottom: 1px solid #ebebeb; }
.accordion-item:last-child { border-bottom: none; }
.accordion-header { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; cursor: pointer; user-select: none; }
.header-left { display: flex; align-items: center; }
.icon-circle { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 16px; margin-right: 12px; flex-shrink: 0; }
.bg-green-light { background-color: #e9f6d9; color: #6ba531; }
.bg-gray-light { background-color: #f3f4f6; color: #8b8b8b; }
.header-title { font-size: 15px; font-weight: 500; color: #1c1c1c; }
.setting-desc { font-size: 14px; color: #8b8b8b; margin-top: 2px; }
.arrow-icon { color: #8b8b8b; transition: transform 0.3s ease; }
.arrow-icon svg { width: 16px; height: 16px; stroke: #8b8b8b; stroke-width: 2; }
.accordion-content { max-height: 0; overflow: hidden; transition: max-height 0.4s ease, padding 0.3s ease; padding: 0 24px; }
.accordion-item.open .accordion-content { max-height: 500px; padding: 0 24px 20px; }
.accordion-item.open .arrow-icon { transform: rotate(180deg); }
/* Дни */
.days-options { display: flex; gap: 12px; }
.day-btn { flex: 1; padding: 10px 0; border: 1px solid #e1e1e1; border-radius: 8px; background: #ffffff; font-size: 14px; color: #1c1c1c; cursor: pointer; transition: 0.2s; }
.day-btn:hover { border-color: #6ba531; }
.day-btn.active { background: #e9f6d9; border-color: #e9f6d9; font-weight: 500; }
/* Семья (Кто будет есть?) */
.family-list { display: flex; flex-direction: column; gap: 12px; }
.family-member { display: flex; align-items: center; padding: 12px 16px; border: 1px solid #ebebeb; border-radius: 12px; background: #fff; transition: 0.2s; cursor: pointer; }
.family-member:hover { border-color: #c0c0c0; box-shadow: 0 2px 8px rgba(0,0,0,0.02); }
.family-member .avatar { width: 44px; height: 44px; border-radius: 50%; background: #f8f9fa; display: flex; align-items: center; justify-content: center; font-size: 24px; margin-right: 14px; }
.family-member .info { flex: 1; display: flex; flex-direction: column; pointer-events: none; }
.family-member .info .name { font-size: 16px; font-weight: 600; color: #1c1c1c; }
.family-member .info .age { font-size: 14px; color: #8b8b8b; }
.family-member .delete-member { color: #d1d5db; cursor: pointer; font-size: 18px; padding: 0 8px; transition: 0.2s; }
.family-member .delete-member:hover { color: #e53935; }
.add-member-btn { display: flex; align-items: center; justify-content: center; margin-top: 16px; color: #6ba531; font-size: 15px; font-weight: 500; cursor: pointer; transition: 0.2s; }
.add-member-btn:hover { opacity: 0.8; }
.add-member-btn span { font-size: 20px; margin-left: 8px; font-weight: 300; }
/* ----- БЛОК: Категории в предпочтениях ----- */
.category-selector-block .category-header h3 { font-size: 16px; color: #1c1c1c; margin-bottom: 4px; }
.category-selector-block .category-header p { font-size: 14px; color: #8b8b8b; margin-bottom: 16px; }
.categories-wrapper { display: flex; flex-wrap: wrap; gap: 8px; }
.category-btn {
padding: 8px 16px;
border: none;
border-radius: 8px;
font-size: 14px;
cursor: pointer;
transition: 0.2s;
}
.category-btn.active {
background-color: #134233; /* Темно-зеленый как на скриншоте */
color: #ffffff;
}
.category-btn.inactive {
background-color: #f2f9ef; /* Светло-зеленый */
color: #1c1c1c;
}
.category-btn.inactive:hover {
background-color: #e4f0de;
}
.toggle-categories-btn {
width: 38px;
height: 38px;
display: flex;
align-items: center;
justify-content: center;
background-color: #f2f9ef;
border: none;
border-radius: 8px;
cursor: pointer;
transition: 0.2s;
}
.toggle-categories-btn:hover { background-color: #e4f0de; }
.toggle-categories-btn svg { width: 18px; height: 18px; stroke: #1c1c1c; transition: transform 0.3s ease; }
.toggle-categories-btn.collapsed svg { transform: rotate(180deg); }
/* Адрес */
.address-input-wrap { position: relative; }
.address-input-wrap input { width: 100%; padding: 12px 36px 12px 16px; border: 1px solid #e1e1e1; border-radius: 8px; font-size: 14px; color: #1c1c1c; background: #fafafa; outline: none; }
.address-input-wrap .clear-input { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: #b0b0b0; cursor: pointer; font-size: 18px; }
/* --- Модальное окно (Добавить/Редактировать человека) --- */
.modal-overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.4); backdrop-filter: blur(2px); display: none; align-items: center; justify-content: center; z-index: 1000; padding: 20px; }
.modal-content { background: #ffffff; border-radius: 24px; width: 100%; max-width: 440px; padding: 24px; box-shadow: 0 8px 30px rgba(0,0,0,0.2); max-height: 95vh; overflow-y: auto;}
.modal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.modal-header h2 { font-size: 20px; font-weight: 600; color: #1c1c1c; }
.modal-header .close-modal { font-size: 24px; color: #b0b0b0; cursor: pointer; line-height: 1; }
.modal-header .close-modal:hover { color: #1c1c1c; }
.categories-grid {gap: 4px;display: flex;flex-wrap: wrap;}
.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-size: 14px; color: #1c1c1c; margin-bottom: 6px; }
.form-group input { width: 100%; padding: 10px 12px; border: 1px solid #e1e1e1; border-radius: 8px; font-size: 14px; outline: none; transition: 0.2s; }
.form-group input:focus { border-color: #6ba531; }
.form-row { display: flex; gap: 16px; margin-bottom: 16px; }
.form-row .form-group { flex: 1; margin-bottom: 0; }
.hint { display: block; font-size: 12px; color: #8b8b8b; margin-top: 4px; }
.gender-toggles { display: flex; gap: 8px; margin-bottom: 16px; }
.gender-btn { flex: 1; padding: 10px; border: 1px solid #e1e1e1; border-radius: 8px; background: #ffffff; font-size: 14px; cursor: pointer; transition: 0.2s; }
.gender-btn.active { background: #e9f6d9; border-color: #e9f6d9; font-weight: 500; }
/* Внутренние стили для модального окна (Запрещенные / Любимые) */
.modal-prefs-grid { display: flex; gap: 16px; margin-bottom: 20px; border-top: 1px solid #f0f0f0; padding-top: 16px; }
.modal-prefs-grid .pref-col { flex: 1; position: relative; }
.modal-prefs-grid .pref-col-title { display: block; font-size: 14px; font-weight: 600; color: #1c1c1c; margin-bottom: 6px; }
.modal-prefs-grid .pref-input { width: 100%; padding: 8px 10px; border: 1px solid #e1e1e1; border-radius: 8px; font-size: 14px; outline: none; margin-bottom: 6px; }
.modal-prefs-grid .pref-input:focus { border-color: #6ba531; }
.modal-prefs-grid .autocomplete-list { position: absolute; top: 65px; left: 0; width: 100%; background: #fff; border: 1px solid #e1e1e1; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.06); max-height: 120px; overflow-y: auto; display: none; z-index: 20; }
.modal-prefs-grid .autocomplete-list.active { display: block; }
.modal-prefs-grid .autocomplete-list div { padding: 8px 12px; cursor: pointer; font-size: 14px; transition: 0.2s; }
.modal-prefs-grid .autocomplete-list div:hover { background: #f3f4f6; }
.modal-prefs-grid .tags-wrap { display: flex; flex-wrap: wrap; gap: 6px; }
.modal-prefs-grid .tag { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 6px; font-size: 13px; }
.modal-prefs-grid .tag-red { background-color: #fce4ec; color: #c62828; }
.modal-prefs-grid .tag-green { background-color: #f0f4c3; color: #33691e; }
.modal-prefs-grid .tag-close { margin-left: 6px; cursor: pointer; font-size: 15px; opacity: 0.6; }
.modal-prefs-grid .tag-close:hover { opacity: 1; }
.save-btn { width: 100%; padding: 12px; background: #6ba531; color: #fff; border: none; border-radius: 12px; font-size: 16px; font-weight: 600; cursor: pointer; transition: 0.2s; }
.save-btn:hover { background: #5b8f29; }
@media (max-width: 900px) {
.container { flex-direction: column; }
.column { width: 100%; padding: 20px;}
.column + .column { border-left: none; border-top: 1px solid #f0f0f0; }
.form-row, .modal-prefs-grid { flex-direction: column; gap: 16px; }
.col-left { min-height: 400px; }
}
/* --- Стили для попапа --- */
#cookie-popup {
position: fixed;
bottom: 25px;
left: 50%;
transform: translateX(-50%) translateY(20px);
background: #ffffff;
border-radius: 20px;
border: 1px solid #e9edf0;
box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.05), 0px 4px 10px rgba(0, 0, 0, 0.02);
padding: 15px 24px;
display: flex;
align-items: center;
gap: 20px;
width: 95%;
max-width: 780px;
z-index: 9999;
/* Начальное состояние (скрыто) */
opacity: 0;
visibility: hidden;
transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
/* Класс для показа попапа */
#cookie-popup.show {
opacity: 1;
visibility: visible;
transform: translateX(-50%) translateY(0);
}
/* Класс для скрытия (при нажатии) */
#cookie-popup.hide {
opacity: 0;
visibility: hidden;
transform: translateX(-50%) translateY(30px);
}
/* Иконка печенья */
.cookie-icon-wrapper {
flex-shrink: 0;
width: 64px;
height: 64px;
border-radius: 50%;
background: #fff;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #edf2f7;
box-shadow: inset 0 0 0 1px #ffffff, 0 2px 4px rgba(0,0,0,0.03);
overflow: hidden;
}
.cookie-icon-wrapper img {
width: 85%;
height: 85%;
object-fit: contain;
}
/* Текст */
.cookie-text {
margin: 0;
flex-grow: 1;
color: #1c3a2e; /* Темный зелено-серый цвет текста */
font-size: 15px;
line-height: 1.5;
letter-spacing: 0.01em;
}
.cookie-text .highlight {
color: #69a342; /* Зеленый цвет для слова "куки" */
font-weight: 600;
}
/* Кнопка */
#cookie-accept {
flex-shrink: 0;
background-color: #d6e6d4; /* Светло-оливковый фон */
color: #1c3a2e;
border: none;
padding: 10px 24px;
border-radius: 10px;
font-size: 15px;
font-weight: 600;
cursor: pointer;
transition: background-color 0.2s ease, transform 0.1s ease;
white-space: nowrap;
}
#cookie-accept:hover {
background-color: #c2d6c0;
}
#cookie-accept:active {
transform: scale(0.96);
}
/* Адаптивность для мобильных устройств */
@media (max-width: 600px) {
#cookie-popup {
flex-wrap: wrap;
justify-content: center;
padding: 20px;
bottom: 15px;
text-align: center;
border-radius: 16px;
gap: 12px;
}
.cookie-icon-wrapper {
width: 50px;
height: 50px;
}
.cookie-text {
font-size: 14px;
width: 100%;
order: 2;
}
#cookie-accept {
width: 100%;
justify-content: center;
padding: 12px;
order: 3;
}
}
</style>
</head>
<body>
<div class="container">
<!-- Левая колонка -->
<div class="column col-left" id="app">
<h1>Автокорзина</h1>
<p class="subtitle">Собираем продукты под ваши настройки</p>
<div class="cart-summary">
<div>
<div class="summary-title">Ваша корзина на <span class="summary-days"> - </span></div>
<div class="summary-details" id="summary-details">84 товара &bull; 12 020 ₽</div>
</div>
<button class="reorder-btn">Начать заново</button>
</div>
<div class="cart-scroll-wrapper" id="scroll-wrapper">
<ul class="cart-items" id="cart-list"></ul>
</div>
<div class="show-more" id="show-more-btn">
Показать ещё <span id="remaining-count">-</span> товаров
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>
</div>
<div class="cart-footer">
<div class="total-wrap">
<div style="display: flex; align-items: center;">
<div class="icon-circle bg-green-light" style="margin-right: 12px; width: 40px; height: 40px; font-size: 18px;">🛍️</div>
<div>
<span class="total-label">Итого</span>
<div id="total-price"> - </div>
</div>
</div>
</div>
<button class="checkout-btn">Оформить заказ</button>
</div>
</div>
<!-- Правая колонка -->
<div class="column">
<h1>Настройте корзину под себя</h1>
<p class="subtitle">Чем больше вы расскажете, тем точнее будет подбор</p>
<div class="settings-panel" id="settings-panel">
<div class="accordion-item open">
<div class="accordion-header">
<div class="header-left">
<div class="icon-circle bg-green-light">📅</div>
<span class="header-title">На сколько дней собираем корзину?</span>
</div>
<div class="arrow-icon">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>
</div>
</div>
<div class="accordion-content">
<div class="days-options">
<button class="day-btn" data-days="1">1</button>
<button class="day-btn" data-days="3">3</button>
<button class="day-btn" data-days="7">7</button>
</div>
</div>
</div>
<div class="accordion-item">
<div class="accordion-header">
<div class="header-left">
<div class="icon-circle bg-green-light">👤</div>
<div>
<div class="header-title">Кто будет есть?</div>
<div class="setting-desc" id="family-desc">2 человека</div>
</div>
</div>
<div class="arrow-icon">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>
</div>
</div>
<div class="accordion-content">
<div class="family-list" id="family-list">
<!-- Семья рендерится через JS -->
</div>
<div class="add-member-btn" id="addMemberBtn">
Добавить человека <span>+</span>
</div>
</div>
</div>
<!-- Вкладка Предпочтения (Категории) -->
<div class="accordion-item" id="prefs-accordion">
<div class="accordion-header">
<div class="header-left">
<div class="icon-circle bg-gray-light">❤️</div>
<div>
<div class="header-title">Предпочтения</div>
<div class="setting-desc" id="prefs-desc">Категории продуктов</div>
</div>
</div>
<div class="arrow-icon">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>
</div>
</div>
<div class="accordion-content">
<div class="category-selector-block">
<div class="category-header">
<p>Выберите группы продуктов, которые хотите видеть в корзине</p>
</div>
<div class="categories-wrapper">
<div class="categories-grid" id="categories-grid"></div>
<button class="toggle-categories-btn" id="expand-categories">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="18 15 12 9 6 15"></polyline></svg>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Модальное окно добавления/редактирования человека с НОВЫМИ ПОЛЯМИ -->
<div class="modal-overlay" id="personModal">
<div class="modal-content">
<div class="modal-header">
<h2 id="modalTitle">Добавить человека</h2>
<span class="close-modal" id="closeModalBtn">×</span>
</div>
<div class="modal-body">
<div class="form-group">
<label>Имя</label>
<input type="text" id="inputName" placeholder="Имя">
</div>
<div class="form-group">
<label>Пол</label>
<div class="gender-toggles" id="genderToggles">
<button class="gender-btn" data-gender="f">Женский</button>
<button class="gender-btn active" data-gender="m">Мужской</button>
</div>
</div>
<div class="form-row">
<div class="form-group">
<label>Возраст</label>
<input type="number" id="inputAge" value="30">
<span class="hint">от 7 лет</span>
</div>
<div class="form-group">
<label>Вес</label>
<input type="number" id="inputWeight" value="87">
</div>
<div class="form-group">
<label>Рост</label>
<input type="number" id="inputHeight" value="177">
</div>
</div>
<!-- ВОЗВРАЩЁННЫЕ ПОЛЯ: Запрещённые и Любимые -->
<div class="modal-prefs-grid">
<div class="pref-col">
<span class="pref-col-title">Запрещённые</span>
<input class="pref-input" type="text" placeholder="Например: лук" data-type="avoid">
<div class="autocomplete-list" data-type="avoid"></div>
<div class="tags-wrap" data-target="avoid"></div>
</div>
<div class="pref-col">
<span class="pref-col-title">Любимые</span>
<input class="pref-input" type="text" data-type="favorite">
<div class="autocomplete-list" data-type="favorite"></div>
<div class="tags-wrap" data-target="favorite"></div>
</div>
</div>
<button class="save-btn" id="savePersonBtn">Сохранить</button>
</div>
</div>
</div>
<div id="cookie-popup">
<div class="cookie-icon-wrapper">
<!-- Замените src на свою картинку печенья -->
<img src="https://cdn-icons-png.flaticon.com/512/642/642573.png" alt="Cookie icon">
</div>
<p class="cookie-text">
Мы используем <a class="highlight" href="/cookies_and_recommendations.html#c" target="_blank">куки</a> и <a class="highlight" href="/cookies_and_recommendations.html#r" target="_blank">рекомендательные технологии</a>, это помогает
улучшать сервис и запоминать ваши настройки
</p>
<button id="cookie-accept">Хорошо</button>
</div>
promo!
2026-08-21 18:17:08 +03:00
<script nonce="**MY_PRETTY_CSP_NONCE**" src="autocart.js"></script>
promo!
2026-08-21 17:52:45 +03:00
</body>
</html>
Reference in New Issue Copy Permalink