From 3199b681a2a8c4fd383ef01680a30174b2768221 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=90=D0=BB=D0=B5=D0=BA=D1=81=D0=B5=D0=B9?= <ap@zeroday.su>
Date: Thu, 20 Aug 2026 00:15:21 +0300
Subject: [PATCH] =?UTF-8?q?feat(landing):=20=D0=BD=D0=B0=D1=81=D1=82=D0=BE?=
 =?UTF-8?q?=D1=8F=D1=89=D0=B8=D0=B5=20=D0=BB=D0=BE=D0=B3=D0=BE=D1=82=D0=B8?=
 =?UTF-8?q?=D0=BF=D1=8B=20=D0=BF=D1=80=D0=BE=D0=B4=D1=83=D0=BA=D1=82=D0=BE?=
 =?UTF-8?q?=D0=B2=20=D0=B8=20=D0=BA=D0=B0=D1=80=D1=82=D0=BE=D1=87=D0=BA?=
 =?UTF-8?q?=D0=B8=20=D0=B2=20=D0=B8=D1=85=20=D1=84=D0=B8=D1=80=D0=BC=D0=B5?=
 =?UTF-8?q?=D0=BD=D0=BD=D1=8B=D1=85=20=D1=86=D0=B2=D0=B5=D1=82=D0=B0=D1=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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

- logo_url и brand_color у продукта; логотипы взяты из самих приложений;
- фон и рамка карточки — мягкий градиент фирменного цвета, ссылка тоже;
- в шапке было «1 — ФЛАГМАНСКИЙ ПРОДУКТ», стало «2 — ПРОДУКТА В PRODUCTION».
---
 backend/src/routes/public.ts          |   2 +-
 frontend/public/logos/agroto.png      | Bin 0 -> 3734 bytes
 frontend/public/logos/bonitirovka.png | Bin 0 -> 828 bytes
 frontend/src/api/client.ts            |   2 ++
 frontend/src/pages/Landing.tsx        |  32 ++++++++++++++++++++++----
 5 files changed, 30 insertions(+), 6 deletions(-)
 create mode 100644 frontend/public/logos/agroto.png
 create mode 100644 frontend/public/logos/bonitirovka.png

diff --git a/backend/src/routes/public.ts b/backend/src/routes/public.ts
index 4fb3fe3..e773706 100644
--- a/backend/src/routes/public.ts
+++ b/backend/src/routes/public.ts
@@ -15,7 +15,7 @@ publicRouter.get('/content', async (_req, res) => {
             query<unknown>(
                 `SELECT id, slug, title, subtitle, description,
                         status, audience, icon_key, tags, sort_order, site_url,
-                        title_en, subtitle_en, description_en
+                        title_en, subtitle_en, description_en, logo_url, brand_color
                  FROM products
                  WHERE is_published = true
                  ORDER BY sort_order ASC`
diff --git a/frontend/public/logos/agroto.png b/frontend/public/logos/agroto.png
new file mode 100644
index 0000000000000000000000000000000000000000..ed03682ade100004dbf1eed1dbc97f01111a1c58
GIT binary patch
literal 3734
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
K3@i0<@&5soSF&^f

literal 0
HcmV?d00001

diff --git a/frontend/public/logos/bonitirovka.png b/frontend/public/logos/bonitirovka.png
new file mode 100644
index 0000000000000000000000000000000000000000..20c92021960f453695f1649ffe72620c976f8097
GIT binary patch
literal 828
zcmeAS@N?(olHy`uVBq!ia0vp^2SAvE2}s`E_d9@rftlIU#WAGf*4sP!`Bw^Lj(@Bc
z==fIfS;a$yZTEtcI&7trQvQ8m;WIb1wK;h1j`9P+4?NF)PMY+zC{k?Qm-B1qhkr7=
zz3%O$J(sfUbL&_C-tG44?kPP12PO{&P6bW{MwJGZ2`m#Bgn$BIAx0Ij5KsUlgiTHF
zg}0%b?{0bi{#yS1HSs3;@~h-uPyf37SHoVG3yJpo%;wu|`JFUxon1`#jeLf`3xnII
z)i2*1uiFu*w;=xh?C$TjFW-b~uMA}rDSu#TE$!eRzE<m7z!Z)bRk!(E)AvW|I(#u;
zx!_Y}#LLQf>#j-i>zAu|8MhqBUUz-{waW~vc%Q~hU&?SR?^foQlB>@cqWtXln+Csn
zxvH0G%Y?pNzJ?)N0~^GOz8OE5@i1_4H)p!jX?Bx?ORGPr{{6(rTXcB!_gtffd9}qa
zUoyS8dEaEN_=QLLo7T-?u;gWW5ps;5*<FN@i9?}*0Zc^2#OtNAh5To5IM&$1EZJ!$
z#2c`mFD_`_rduWse$8_jQkiExEj%)(UC4Igi%ypYzfVy*Pg0*x*>0p}$I&WNx9J}D
z>^CQ0Ojy3~@jaitduP4q*2xmvyr%rIeZ9=z?loqDTfHBrJ(u{JqVfESy7+~PHm0w4
zj-LxK`|+XV&;nzJ_GahiGuH#PJ?CW^*G{|kcG=t7%6RT)XAUu52zGY)%35;e;tF6W
ztN5Sex}f|v@1I}r{}+ZU>u&mn$(u4tI{bgS(l1Xd2^_Typ1_y{M{KMDFv9V~E?5~T
zQQ%SoGm30A43mIH1CtiiNvP()k{^<qxf%NzdA3G8n8fD!6qqX*JYD@<);T3K0RV_r
BH~Iho

literal 0
HcmV?d00001

diff --git a/frontend/src/api/client.ts b/frontend/src/api/client.ts
index 0e9c64f..722475c 100644
--- a/frontend/src/api/client.ts
+++ b/frontend/src/api/client.ts
@@ -15,6 +15,8 @@ export interface Product {
     title_en?: string | null;
     subtitle_en?: string | null;
     description_en?: string | null;
+    logo_url?: string | null;
+    brand_color?: string | null;
 }
 
 export interface ApproachItem {
diff --git a/frontend/src/pages/Landing.tsx b/frontend/src/pages/Landing.tsx
index f89b4d8..3bc9981 100644
--- a/frontend/src/pages/Landing.tsx
+++ b/frontend/src/pages/Landing.tsx
@@ -163,7 +163,18 @@ export function Landing() {
                                 ? (STATUS_LABELS_EN[p.status] || STATUS_LABELS_EN.planned)
                                 : statusBadge.text;
                             return (
-                                <div key={p.id} className="bg-gradient-to-br from-slate-50 to-brand-50 border border-slate-200 rounded-3xl p-8 grid md:grid-cols-2 gap-7 items-center">
+                                <div
+                                    key={p.id}
+                                    className="border rounded-3xl p-8 grid md:grid-cols-2 gap-7 items-center transition-shadow hover:shadow-md"
+                                    style={{
+                                        // Карточка в цвете самого продукта: две одинаковые серые
+                                        // плитки не давали понять, что это разные приложения.
+                                        background: p.brand_color
+                                            ? `linear-gradient(135deg, ${p.brand_color}0D 0%, ${p.brand_color}1A 100%)`
+                                            : undefined,
+                                        borderColor: p.brand_color ? `${p.brand_color}33` : undefined,
+                                    }}
+                                >
                                     <div>
                                         <div className="flex gap-2 mb-4">
                                             <span className={`text-xs px-2.5 py-1 rounded font-medium ${statusBadge.cls}`}>{badgeText}</span>
@@ -172,9 +183,19 @@ export function Landing() {
                                             )}
                                         </div>
                                         <div className="flex items-center gap-3 mb-3">
-                                            <div className="w-12 h-12 bg-brand-800 rounded-xl flex items-center justify-center text-white">
-                                                <ProductIcon name={p.icon_key || ''} size={24} />
-                                            </div>
+                                            {p.logo_url ? (
+                                                <img
+                                                    src={p.logo_url}
+                                                    alt={String(pick(p, 'title') || '')}
+                                                    width={48}
+                                                    height={48}
+                                                    className="w-12 h-12 rounded-xl object-contain bg-white border border-slate-200/70 p-1"
+                                                />
+                                            ) : (
+                                                <div className="w-12 h-12 bg-brand-800 rounded-xl flex items-center justify-center text-white">
+                                                    <ProductIcon name={p.icon_key || ''} size={24} />
+                                                </div>
+                                            )}
                                             <div>
                                                 <div className="text-2xl font-medium text-brand-900 tracking-tight">{pick(p, 'title')}</div>
                                                 {pick(p, 'subtitle') && (
@@ -193,7 +214,8 @@ export function Landing() {
                                                 href={p.site_url}
                                                 target="_blank"
                                                 rel="noopener"
-                                                className="inline-flex items-center gap-1.5 mt-5 text-sm font-medium text-brand-900 border-b border-brand-900/30 hover:border-brand-900 transition-colors"
+                                                className="inline-flex items-center gap-1.5 mt-5 text-sm font-medium border-b transition-colors"
+                                                style={{ color: p.brand_color || undefined, borderColor: p.brand_color ? `${p.brand_color}55` : undefined }}
                                             >
                                                 {p.site_url.replace(/^https?:\/\//, '')}
                                                 <ArrowRightIcon width={14} height={14} />