diff --git a/BRANDBOOK_DRAFT.md b/BRANDBOOK_DRAFT.md new file mode 100644 index 0000000..43e0ac6 --- /dev/null +++ b/BRANDBOOK_DRAFT.md @@ -0,0 +1,101 @@ +# Рыбсток: наработки для брендбука + +## Основа бренда + +Название: Рыбсток. + +Смысл названия: соединение двух идей - рыбная и продуктовая специализация плюс стоковые цены интернет-склада. + +Рабочий слоган: "Качество со склада. Стоковые цены." + +Короткое позиционирование: интернет-склад качественной рыбы, морепродуктов, мяса, сыров, овощей, ягод и бакалеи по стоковым ценам с доставкой по Москве и Московской области. + +## Логотип + +Выбранное направление: жирный графичный wordmark без отдельной рисованной рыбы. + +Принцип: +- "Рыб" - темно-зеленый блок. +- "сток" - красный блок. +- Стык букв "б/с" - фирменный акцент, который цепляет взгляд и визуально связывает две части названия. +- Подчеркивание разделено по цветам: красная линия под первой частью и зеленая линия под второй. +- Слоган расположен под знаком и является частью фирменного образа. + +Рабочий логотип на сайте сейчас встроен inline SVG в `views/layouts/main.php`. + +PNG-версии логотипа: +- `public/assets/images/brand/logo-rybstock-320.png` +- `public/assets/images/brand/logo-rybstock-640.png` +- `public/assets/images/brand/logo-rybstock-1280.png` +- `public/assets/images/brand/logo-rybstock-1920.png` + +## Favicon + +Текущий favicon: монограммный знак на основе выбранного стыка логотипа. + +Подключенные файлы: +- `public/favicon-16x16.png` +- `public/favicon-32x32.png` +- `public/apple-touch-icon.png` +- `public/site.webmanifest` + +Дополнительные варианты: +- `public/assets/images/brand/favicon-rybstock-monogram-*.png` +- `public/assets/images/brand/favicon-rybstock-fish-*.png` + +## Цвета + +Основной зеленый: `#173d2c`. + +Дополнительный зеленый: `#27634a`. + +Акцентный красный: `#c43d31`. + +Теплый белый фон: `#fffefa`. + +Светлый фон интерфейса: `#f4f6ef`. + +Линии и границы: `#dfe5da`. + +Приглушенный текст: `#657469`. + +## Характер визуала + +Стиль: лаконичный, складской, уверенный, современный, без случайной декоративности. + +Нельзя: +- рисованная от руки рыба; +- мультяшные элементы; +- слишком тонкие иконки рядом с жирным логотипом; +- перегруженные градиенты; +- ощущение дешевого оптового прайса. + +Можно: +- плотная типографика; +- аккуратные тени; +- чистые карточки; +- графичные разделители; +- понятные ценовые акценты; +- фото товара без лишней постановочности. + +## Тон коммуникации + +Голос бренда: спокойный, уверенный, заботливый, без давления. + +Ключевые смыслы: +- качество проверено; +- цена выгодная; +- заказ подтверждается человеком; +- оплатить можно при получении; +- клиенту не нужно самому считать выгоду, сайт пересчитывает цены автоматически. + +Пример формулировки: "Добавьте товары в корзину, а сайт сам покажет лучшую цену при выбранном способе оплаты." + +## Что доработать позже + +- Утвердить финальную favicon-иконку: монограмма или рыба-склад. +- Сделать правила использования логотипа на светлом, темном и фотофоне. +- Подобрать основную шрифтовую пару для сайта и печатных материалов. +- Описать стиль товарных фото и баннеров. +- Сформировать набор фирменных иконок категорий. +- Подготовить шаблон прайс-листа и коммерческого предложения в фирменном стиле. diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png new file mode 100644 index 0000000..ce80345 Binary files /dev/null and b/public/apple-touch-icon.png differ diff --git a/public/assets/css/app.css b/public/assets/css/app.css index dfc4dca..3d9b107 100644 --- a/public/assets/css/app.css +++ b/public/assets/css/app.css @@ -52,7 +52,7 @@ body { .site-topbar-inner { width: min(var(--page-max), calc(100% - (var(--page-gap) * 2))); display: grid; - grid-template-columns: minmax(190px, 260px) minmax(360px, 1fr) minmax(260px, 340px); + grid-template-columns: minmax(230px, 340px) minmax(360px, 1fr) minmax(260px, 340px); gap: 24px; align-items: center; margin: 0 auto; @@ -72,9 +72,10 @@ body { text-decoration: none; } -.brand-link img { +.brand-link img, +.brand-link svg { display: block; - width: clamp(178px, 15vw, 238px); + width: clamp(220px, 20vw, 330px); height: auto; } @@ -2853,9 +2854,10 @@ body[data-payment-mode="invoice"] .invoice-benefit-banner { background: var(--paper); } -.footer-logo img { +.footer-logo img, +.footer-logo svg { display: block; - width: 150px; + width: 190px; height: auto; } @@ -3076,7 +3078,8 @@ body[data-payment-mode="invoice"] .invoice-benefit-banner { justify-content: flex-start; } - .brand-link img { + .brand-link img, + .brand-link svg { width: 210px; } diff --git a/public/assets/images/brand/favicon-rybstock-fish-16.png b/public/assets/images/brand/favicon-rybstock-fish-16.png new file mode 100644 index 0000000..4f6b671 Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-fish-16.png differ diff --git a/public/assets/images/brand/favicon-rybstock-fish-180.png b/public/assets/images/brand/favicon-rybstock-fish-180.png new file mode 100644 index 0000000..ed8f88f Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-fish-180.png differ diff --git a/public/assets/images/brand/favicon-rybstock-fish-192.png b/public/assets/images/brand/favicon-rybstock-fish-192.png new file mode 100644 index 0000000..6ceee1f Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-fish-192.png differ diff --git a/public/assets/images/brand/favicon-rybstock-fish-32.png b/public/assets/images/brand/favicon-rybstock-fish-32.png new file mode 100644 index 0000000..cddc360 Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-fish-32.png differ diff --git a/public/assets/images/brand/favicon-rybstock-fish-48.png b/public/assets/images/brand/favicon-rybstock-fish-48.png new file mode 100644 index 0000000..3215f1d Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-fish-48.png differ diff --git a/public/assets/images/brand/favicon-rybstock-fish-512.png b/public/assets/images/brand/favicon-rybstock-fish-512.png new file mode 100644 index 0000000..3d60a14 Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-fish-512.png differ diff --git a/public/assets/images/brand/favicon-rybstock-fish-64.png b/public/assets/images/brand/favicon-rybstock-fish-64.png new file mode 100644 index 0000000..3692b0e Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-fish-64.png differ diff --git a/public/assets/images/brand/favicon-rybstock-fish-source.svg b/public/assets/images/brand/favicon-rybstock-fish-source.svg new file mode 100644 index 0000000..797a1d7 --- /dev/null +++ b/public/assets/images/brand/favicon-rybstock-fish-source.svg @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/public/assets/images/brand/favicon-rybstock-monogram-16.png b/public/assets/images/brand/favicon-rybstock-monogram-16.png new file mode 100644 index 0000000..5e69c4e Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-monogram-16.png differ diff --git a/public/assets/images/brand/favicon-rybstock-monogram-180.png b/public/assets/images/brand/favicon-rybstock-monogram-180.png new file mode 100644 index 0000000..ce80345 Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-monogram-180.png differ diff --git a/public/assets/images/brand/favicon-rybstock-monogram-192.png b/public/assets/images/brand/favicon-rybstock-monogram-192.png new file mode 100644 index 0000000..2606729 Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-monogram-192.png differ diff --git a/public/assets/images/brand/favicon-rybstock-monogram-32.png b/public/assets/images/brand/favicon-rybstock-monogram-32.png new file mode 100644 index 0000000..316ba78 Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-monogram-32.png differ diff --git a/public/assets/images/brand/favicon-rybstock-monogram-48.png b/public/assets/images/brand/favicon-rybstock-monogram-48.png new file mode 100644 index 0000000..a6c0d63 Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-monogram-48.png differ diff --git a/public/assets/images/brand/favicon-rybstock-monogram-512.png b/public/assets/images/brand/favicon-rybstock-monogram-512.png new file mode 100644 index 0000000..1b0469d Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-monogram-512.png differ diff --git a/public/assets/images/brand/favicon-rybstock-monogram-64.png b/public/assets/images/brand/favicon-rybstock-monogram-64.png new file mode 100644 index 0000000..35a81d3 Binary files /dev/null and b/public/assets/images/brand/favicon-rybstock-monogram-64.png differ diff --git a/public/assets/images/brand/favicon-rybstock-monogram-source.svg b/public/assets/images/brand/favicon-rybstock-monogram-source.svg new file mode 100644 index 0000000..224d4a3 --- /dev/null +++ b/public/assets/images/brand/favicon-rybstock-monogram-source.svg @@ -0,0 +1,13 @@ + + + + + Ры + с + + + + + + + \ No newline at end of file diff --git a/public/assets/images/brand/logo-rybstock-1280.png b/public/assets/images/brand/logo-rybstock-1280.png new file mode 100644 index 0000000..a2d3739 Binary files /dev/null and b/public/assets/images/brand/logo-rybstock-1280.png differ diff --git a/public/assets/images/brand/logo-rybstock-1920.png b/public/assets/images/brand/logo-rybstock-1920.png new file mode 100644 index 0000000..8074ebc Binary files /dev/null and b/public/assets/images/brand/logo-rybstock-1920.png differ diff --git a/public/assets/images/brand/logo-rybstock-320.png b/public/assets/images/brand/logo-rybstock-320.png new file mode 100644 index 0000000..a1bc8d4 Binary files /dev/null and b/public/assets/images/brand/logo-rybstock-320.png differ diff --git a/public/assets/images/brand/logo-rybstock-640.png b/public/assets/images/brand/logo-rybstock-640.png new file mode 100644 index 0000000..e18811f Binary files /dev/null and b/public/assets/images/brand/logo-rybstock-640.png differ diff --git a/public/assets/images/brand/logo-rybstock-source.svg b/public/assets/images/brand/logo-rybstock-source.svg new file mode 100644 index 0000000..7f4b9e0 --- /dev/null +++ b/public/assets/images/brand/logo-rybstock-source.svg @@ -0,0 +1,21 @@ + + + + + + Рыбсток + Рыбсток + + + + + + + Качество со склада. Стоковые цены. + + \ No newline at end of file diff --git a/public/assets/images/brand/preview-brand-assets.png b/public/assets/images/brand/preview-brand-assets.png new file mode 100644 index 0000000..877af8a Binary files /dev/null and b/public/assets/images/brand/preview-brand-assets.png differ diff --git a/public/assets/images/logo-rybstock-b-fin-01.svg b/public/assets/images/logo-rybstock-b-fin-01.svg new file mode 100644 index 0000000..50a5134 --- /dev/null +++ b/public/assets/images/logo-rybstock-b-fin-01.svg @@ -0,0 +1,84 @@ + + Рыбсток - варианты стилизации буквы Б + Четыре читаемых варианта логотипа Рыбсток со стилизацией верхней части буквы б под рыбий плавник. + + + + + + + + + 01 / плавник над Б, максимально читаемо + + Рыб + сток + + + + + Качественные продукты по стоковым ценам + + + + + + 02 / плавник как холодный срез + + Рыб + сток + + + + + + Качественные продукты по стоковым ценам + + + + + + 03 / плавник внутри верхней чаши Б + + Рыб + сток + + + + + + Качественные продукты по стоковым ценам + + + + + + 04 / плавник + легкое соприкосновение + + Рыб + сток + + + + + + Качественные продукты по стоковым ценам + + + diff --git a/public/assets/images/logo-rybstock-b-tail-01.svg b/public/assets/images/logo-rybstock-b-tail-01.svg new file mode 100644 index 0000000..8c2e1ce --- /dev/null +++ b/public/assets/images/logo-rybstock-b-tail-01.svg @@ -0,0 +1,125 @@ + + Рыбсток - варианты хвоста в букве б + Четыре варианта логотипа Рыбсток, где верх буквы б стилизован под рыбий хвост. + + + + + + + + + 01 / хвост как аккуратный надрез + + Рыб + сток + Ры + б + + + сток + + + + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 02 / хвост-плавник выше буквы + + Рыб + сток + Ры + б + + + сток + + + + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 03 / хвост как фирменная засечка + + Рыб + сток + Ры + б + + + сток + + + + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 04 / хвост-стрела в сторону стока + + Рыб + сток + Ры + б + + + сток + + + + + + + + + + + Качественные продукты по стоковым ценам + + + diff --git a/public/assets/images/logo-rybstock-bs-contact-01.svg b/public/assets/images/logo-rybstock-bs-contact-01.svg new file mode 100644 index 0000000..698b49f --- /dev/null +++ b/public/assets/images/logo-rybstock-bs-contact-01.svg @@ -0,0 +1,91 @@ + + Рыбсток - варианты соприкосновения Б и С + Четыре варианта типографического логотипа Рыбсток с фирменным акцентом на стыке букв Б и С. + + + + + + + + + 01 / С обнимает хвост Б + + Рыб + сток + + + + + + + Качественные продукты по стоковым ценам + + + + + + 02 / холодный зазор между Б и С + + Рыб + сток + + + + + + Качественные продукты по стоковым ценам + + + + + + 03 / складской паз Б-С + + Рыб + сток + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 04 / ценовой маркер на стыке + + Рыб + сток + + + + + + + + Качественные продукты по стоковым ценам + + + diff --git a/public/assets/images/logo-rybstock-concepts-02.svg b/public/assets/images/logo-rybstock-concepts-02.svg new file mode 100644 index 0000000..01dbc58 --- /dev/null +++ b/public/assets/images/logo-rybstock-concepts-02.svg @@ -0,0 +1,91 @@ + + Новые концепты логотипа Рыбсток + Четыре альтернативных графичных направления логотипа Рыбсток. + + + + + + + + + 01 / монограмма: Р + складская полка + + + + + + + + РЫБ + СТОК + Качественные продукты по стоковым ценам + + + + + + 02 / промышленная маркировка склада + + + РЫБ + СТОК + + + + + Качественные продукты по стоковым ценам + + + + + + 03 / премиальная печать без рисованности + + + + + + + + РЫБ + СТОК + Качественные продукты по стоковым ценам + + + + + + 04 / минимальный знак “склад-хвост” + + РЫБ + СТОК + + + + + + + + + + + Качественные продукты по стоковым ценам + + + diff --git a/public/assets/images/logo-rybstock-concepts.svg b/public/assets/images/logo-rybstock-concepts.svg new file mode 100644 index 0000000..e320f48 --- /dev/null +++ b/public/assets/images/logo-rybstock-concepts.svg @@ -0,0 +1,101 @@ + + Концепты логотипа Рыбсток + Четыре векторных варианта логотипа Рыбсток с графичными знаками рыбы и склада. + + + + + + + + + 01 / складской знак слева + + + + + + + + + + РЫБ + СТОК + + + Качественные продукты по стоковым ценам + + + + + + 02 / знак как складская наклейка + + РЫБ + СТОК + + + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 03 / знак-иконка для фавикона + + + + + + + + + + РЫБ + СТОК + Качественные продукты по стоковым ценам + + + + + + 04 / более премиальный, знак справа + + РЫБ + СТОК + + + + + + + + + + + Качественные продукты по стоковым ценам + + + diff --git a/public/assets/images/logo-rybstock-final.svg b/public/assets/images/logo-rybstock-final.svg new file mode 100644 index 0000000..d297508 --- /dev/null +++ b/public/assets/images/logo-rybstock-final.svg @@ -0,0 +1,41 @@ + + Рыбсток + Качество со склада. Стоковые цены. + + + + + + Рыб + сток + Рыб + сток + + + + + + + + + + + + + + + Качество со склада. Стоковые цены. + + diff --git a/public/assets/images/logo-rybstock-knot-01.svg b/public/assets/images/logo-rybstock-knot-01.svg new file mode 100644 index 0000000..9880266 --- /dev/null +++ b/public/assets/images/logo-rybstock-knot-01.svg @@ -0,0 +1,90 @@ + + Рыбсток - варианты фирменного стыка + Четыре варианта логотипа Рыбсток с выразительным стыком букв б и с. + + + + + + + + + 01 / ближе к выбранному, чище + + Рыб + сток + + + + + + + Качественные продукты по стоковым ценам + + + + + + 02 / красный стык как хвост рыбы + + Рыб + сток + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 03 / стык как ценовая метка + + Рыб + сток + + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 04 / холодный, более премиальный узел + + Рыб + сток + + + + + + + + Качественные продукты по стоковым ценам + + + diff --git a/public/assets/images/logo-rybstock-knot-shadow-01.svg b/public/assets/images/logo-rybstock-knot-shadow-01.svg new file mode 100644 index 0000000..fdfae02 --- /dev/null +++ b/public/assets/images/logo-rybstock-knot-shadow-01.svg @@ -0,0 +1,109 @@ + + Рыбсток - теневые варианты логотипа + Четыре теневых варианта логотипа Рыбсток с выразительным стыком букв б и с. + + + + + + + + + + + + + + + 01 / ледяная тень + + Рыб + сток + + Рыб + сток + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 02 / складская глубина + + Рыб + сток + Рыб + сток + + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 03 / фирменный красно-зеленый сдвиг + + Рыб + сток + Рыб + сток + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 04 / мягкая премиальная тень + + Рыб + сток + + + + + + + + + Качественные продукты по стоковым ценам + + + diff --git a/public/assets/images/logo-rybstock-knot-shadow-clean-01.svg b/public/assets/images/logo-rybstock-knot-shadow-clean-01.svg new file mode 100644 index 0000000..4871ac5 --- /dev/null +++ b/public/assets/images/logo-rybstock-knot-shadow-clean-01.svg @@ -0,0 +1,37 @@ + + Рыбсток - логотип без зеленых перемычек + Теневой вариант логотипа Рыбсток с очищенным стыком букв б и с. + + + + + + + + Рыб + сток + Рыб + сток + + + + + + + + + Качественные продукты по стоковым ценам + + diff --git a/public/assets/images/logo-rybstock-knot-strokes-01.svg b/public/assets/images/logo-rybstock-knot-strokes-01.svg new file mode 100644 index 0000000..cb4086a --- /dev/null +++ b/public/assets/images/logo-rybstock-knot-strokes-01.svg @@ -0,0 +1,111 @@ + + Рыбсток - варианты черт в стыке логотипа + Четыре варианта логотипа Рыбсток с разными графическими чертами в стыке букв б и с. + + + + + + + + + 01 / короткие складские пазы + + Рыб + сток + Рыб + сток + + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 02 / ледяные прорези + + Рыб + сток + Рыб + сток + + + + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 03 / ценовые штрихи + + Рыб + сток + Рыб + сток + + + + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 04 / мягкие волокна склада + + Рыб + сток + Рыб + сток + + + + + + + + + + + Качественные продукты по стоковым ценам + + + diff --git a/public/assets/images/logo-rybstock-refined-01.svg b/public/assets/images/logo-rybstock-refined-01.svg new file mode 100644 index 0000000..11b5cae --- /dev/null +++ b/public/assets/images/logo-rybstock-refined-01.svg @@ -0,0 +1,50 @@ + + Рыбсток - доработка логотипа + Графичный логотип Рыбсток: рыба, склад, заморозка и стоковые цены. + + + + + + + + + + + + + + + + + + + + + + + РЫБ + СТОК + + РЫБ + СТОК + + + + + + + Качественные продукты по стоковым ценам + + diff --git a/public/assets/images/logo-rybstock-shadow-01.svg b/public/assets/images/logo-rybstock-shadow-01.svg new file mode 100644 index 0000000..6d99683 --- /dev/null +++ b/public/assets/images/logo-rybstock-shadow-01.svg @@ -0,0 +1,101 @@ + + Рыбсток - теневые варианты логотипа + Четыре варианта логотипа Рыбсток с теневым фирменным слоем. + + + + + + + + + 01 / ледяной теневой слой + + Рыб + сток + Рыб + сток + + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 02 / складская глубина + + Рыб + сток + Рыб + сток + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 03 / цветовой сдвиг, современно + + Рыб + сток + Рыб + сток + + + + + + + + Качественные продукты по стоковым ценам + + + + + + 04 / мягкая премиальная тень + + + Рыб + сток + + + + + + + Качественные продукты по стоковым ценам + + + diff --git a/public/assets/images/logo-rybstock-slogan-01.svg b/public/assets/images/logo-rybstock-slogan-01.svg new file mode 100644 index 0000000..40eeafa --- /dev/null +++ b/public/assets/images/logo-rybstock-slogan-01.svg @@ -0,0 +1,85 @@ + + Рыбсток - варианты слогана + Четыре варианта слогана и типографики для выбранного логотипа Рыбсток. + + + + + + + + Рыб + сток + Рыб + сток + + + + + + + + + + + + + + + 01 / самый прямой и сильный + + + Качество со склада. Стоковые цены. + + + + + + 02 / премиальнее, с паузой + + + Качественные продукты + ПО СТОКОВЫМ ЦЕНАМ + + + + + + 03 / знак как ценовая система + + + + ОТБОРНОЕ КАЧЕСТВО + СТОКОВЫЕ ЦЕНЫ + + + + + + 04 / мягче и человечнее + + + Продукты для своих + по стоковым ценам + + + diff --git a/public/assets/images/logo-rybstock-wordmark-01.svg b/public/assets/images/logo-rybstock-wordmark-01.svg new file mode 100644 index 0000000..f1cfbe2 --- /dev/null +++ b/public/assets/images/logo-rybstock-wordmark-01.svg @@ -0,0 +1,75 @@ + + Типографические варианты логотипа Рыбсток + Четыре чистых wordmark-варианта Рыбсток без иконок и наложений. + + + + + + + + + 01 / уверенный складской wordmark + + Рыб + сток + + + Качественные продукты по стоковым ценам + + + + + + 02 / более дорогой, спокойный + + Рыб + сток + + + Качественные продукты по стоковым ценам + + + + + + 03 / холодный, технологичный + + Рыбсток + Рыб + сток + + + Качественные продукты по стоковым ценам + + + + + + 04 / современный маркет, мягче + + + Рыб + сток + + Качественные продукты по стоковым ценам + + + diff --git a/public/assets/images/logo-rybstock.svg b/public/assets/images/logo-rybstock.svg index a869f5a..d297508 100644 --- a/public/assets/images/logo-rybstock.svg +++ b/public/assets/images/logo-rybstock.svg @@ -1,20 +1,41 @@ - + Рыбсток - РЫБСТОК - качественные продукты по стоковым ценам + Качество со склада. Стоковые цены. - - РЫБ - СТОК - - - Качественные продукты по стоковым ценам + + + Рыб + сток + Рыб + сток + + + + + + + + + + + + + + + Качество со склада. Стоковые цены. diff --git a/public/favicon-16x16.png b/public/favicon-16x16.png new file mode 100644 index 0000000..5e69c4e Binary files /dev/null and b/public/favicon-16x16.png differ diff --git a/public/favicon-32x32.png b/public/favicon-32x32.png new file mode 100644 index 0000000..316ba78 Binary files /dev/null and b/public/favicon-32x32.png differ diff --git a/public/logo-concepts.html b/public/logo-concepts.html new file mode 100644 index 0000000..0a31b3b --- /dev/null +++ b/public/logo-concepts.html @@ -0,0 +1,55 @@ + + + + + + Концепты логотипа Рыбсток + + + +
+

Концепты логотипа Рыбсток

+

Берем выбранный знак и подбираем к нему слоган: сохраняем смысл про качество и стоковые цены, но пробуем более фирменную подачу.

+
+ Варианты слогана логотипа Рыбсток +
+
+ + diff --git a/public/site.webmanifest b/public/site.webmanifest new file mode 100644 index 0000000..18a8f1b --- /dev/null +++ b/public/site.webmanifest @@ -0,0 +1,20 @@ +{ + "name": "Рыбсток", + "short_name": "Рыбсток", + "description": "Качество со склада. Стоковые цены.", + "icons": [ + { + "src": "/assets/images/brand/favicon-rybstock-monogram-192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "/assets/images/brand/favicon-rybstock-monogram-512.png", + "sizes": "512x512", + "type": "image/png" + } + ], + "theme_color": "#173d2c", + "background_color": "#fffefa", + "display": "standalone" +} diff --git a/scripts/generate-brand-assets.js b/scripts/generate-brand-assets.js new file mode 100644 index 0000000..1629aff --- /dev/null +++ b/scripts/generate-brand-assets.js @@ -0,0 +1,107 @@ +const fs = require('fs'); +const path = require('path'); +const { chromium } = require('playwright'); + +const outDir = path.join('public', 'assets', 'images', 'brand'); +fs.mkdirSync(outDir, { recursive: true }); + +const fullLogoSvg = ` + + + + + + Рыбсток + Рыбсток + + + + + + + Качество со склада. Стоковые цены. + +`; + +const iconMonogramSvg = ` + + + + + Ры + с + + + + + + +`; + +const iconFishSvg = ` + + + + + + + + +`; + +async function pngFromSvg(page, svg, file, width, height = null) { + const targetHeight = height ?? Math.round((width / 650) * 220); + await page.setViewportSize({ width, height: targetHeight }); + await page.setContent(` + + + + + + + ${svg} + + `); + + await page.locator('svg').screenshot({ path: file, omitBackground: true }); +} + +async function main() { + fs.writeFileSync(path.join(outDir, 'logo-rybstock-source.svg'), fullLogoSvg.trim(), 'utf8'); + fs.writeFileSync(path.join(outDir, 'favicon-rybstock-monogram-source.svg'), iconMonogramSvg.trim(), 'utf8'); + fs.writeFileSync(path.join(outDir, 'favicon-rybstock-fish-source.svg'), iconFishSvg.trim(), 'utf8'); + + const edgePath = 'C:\\Program Files (x86)\\Microsoft\\Edge\\Application\\msedge.exe'; + const browser = await chromium.launch(fs.existsSync(edgePath) ? { executablePath: edgePath } : {}); + const page = await browser.newPage({ deviceScaleFactor: 1 }); + + try { + for (const width of [320, 640, 1280, 1920]) { + await pngFromSvg(page, fullLogoSvg, path.join(outDir, `logo-rybstock-${width}.png`), width); + } + + for (const width of [16, 32, 48, 64, 180, 192, 512]) { + await pngFromSvg(page, iconMonogramSvg, path.join(outDir, `favicon-rybstock-monogram-${width}.png`), width, width); + await pngFromSvg(page, iconFishSvg, path.join(outDir, `favicon-rybstock-fish-${width}.png`), width, width); + } + + await pngFromSvg(page, iconMonogramSvg, path.join('public', 'favicon-16x16.png'), 16, 16); + await pngFromSvg(page, iconMonogramSvg, path.join('public', 'favicon-32x32.png'), 32, 32); + await pngFromSvg(page, iconMonogramSvg, path.join('public', 'apple-touch-icon.png'), 180, 180); + } finally { + await browser.close(); + } +} + +main().catch((error) => { + console.error(error); + process.exit(1); +}); diff --git a/views/layouts/main.php b/views/layouts/main.php index 8d99ba0..9c95c0a 100644 --- a/views/layouts/main.php +++ b/views/layouts/main.php @@ -9,6 +9,60 @@ declare(strict_types=1); /** @var array $breadcrumbs */ /** @var bool $showBackButton */ $megaCategories = []; +$brandLogoSvg = <<<'SVG' + + Рыбсток + Качество со склада. Стоковые цены. + + + + + Рыб + сток + Рыб + сток + + + + + + + + + + + Качество со склада. Стоковые цены. + + +SVG; +$faviconSvg = <<<'SVG' + + + + + Ры + с + + + + + + + +SVG; +$faviconHref = 'data:image/svg+xml,' . rawurlencode($faviconSvg); try { $megaCategories = (new \App\Repositories\CategoryRepository())->tree(); @@ -28,18 +82,15 @@ try { + +