From 488bb61c6f2671b55512829b231b4c52bc489d53 Mon Sep 17 00:00:00 2001 From: Kylian Bardini Date: Sat, 25 Jul 2026 15:10:46 +0200 Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20feat(brand):=20monogramme=20@kbr?= =?UTF-8?q?dn1=20sur=20le=20favicon,=20le=20header=20et=20les=20OG?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Le favicon précédent était hors design system : conteneur circulaire alors que --ui-radius vaut 0, dégradé #FFAA00 → #C5690C absent de la palette, et trois ombres portées floutées illisibles à 16 px. Le nouveau mark fait porter deux lectures par les mêmes traits : le cadre ouvert en bas-droite lit comme l'arobase du wordmark, et son montant gauche sert de barre au K, auquel le chevron vient s'accrocher. Le cadre est fait de quatre pleins plutôt que d'un tracé en stroke : satori ne rend pas les strokes de façon fiable, et partager une seule géométrie évite que la version runtime et la version OG divergent. Rendus comparés au pixel près, identiques. - app/components/ui/Logo.vue : , neutre en currentColor - public/favicon.svg : valeurs figées + @media (prefers-color-scheme) - public/favicon.ico : regénéré en 16/32/48/64/128/256 - Header et BlogHeader : les quatre boutons brand, pas les dropdowns - OgImage/*.satori.vue : SVG inline, hors du composant Le .ico fige le neutre en #1a1a1a : correct sur onglet clair, invisible sur onglet sombre. Le SVG est servi en premier, le .ico ne sert que de repli pour les vieux clients et les crawlers. Refs #12 Claude-Session: https://claude.ai/code/session_011tQX9U1mEk7iux8G5R5vVz --- app/components/OgImage/Blog.satori.vue | 17 +++++- app/components/OgImage/Default.satori.vue | 17 +++++- app/components/layout/BlogHeader.vue | 4 +- app/components/layout/Header.vue | 4 +- app/components/ui/Logo.vue | 32 +++++++++++ public/favicon.ico | Bin 4286 -> 9235 bytes public/favicon.svg | 65 ++++------------------ 7 files changed, 78 insertions(+), 61 deletions(-) create mode 100644 app/components/ui/Logo.vue diff --git a/app/components/OgImage/Blog.satori.vue b/app/components/OgImage/Blog.satori.vue index eafc4d4..5446fbd 100644 --- a/app/components/OgImage/Blog.satori.vue +++ b/app/components/OgImage/Blog.satori.vue @@ -147,9 +147,20 @@ withDefaults(defineProps<{ /blog{{ slug ? `/${slug}` : '' }} - - blog@kbrdn1 - +
+ + + + + + + + + + + blog@kbrdn1 + +
diff --git a/app/components/OgImage/Default.satori.vue b/app/components/OgImage/Default.satori.vue index 8fcb4cd..f98ab57 100644 --- a/app/components/OgImage/Default.satori.vue +++ b/app/components/OgImage/Default.satori.vue @@ -82,9 +82,20 @@ withDefaults(defineProps<{ {{ statusText }} - - @kbrdn1 - +
+ + + + + + + + + + + @kbrdn1 + +
diff --git a/app/components/layout/BlogHeader.vue b/app/components/layout/BlogHeader.vue index 1f1b824..0a692aa 100644 --- a/app/components/layout/BlogHeader.vue +++ b/app/components/layout/BlogHeader.vue @@ -71,6 +71,7 @@ const isMobileMenuOpen = ref(false); @click="showBrandMenu = !showBrandMenu" @keydown.escape="showBrandMenu = false" > + blog@kbrdn1 @@ -159,12 +160,13 @@ const isMobileMenuOpen = ref(false);
+ @kbrdn1 @@ -207,12 +208,13 @@ const isMobileMenuOpen = ref(false);
+withDefaults( + defineProps<{ + size?: number | string; + }>(), + { size: 16 }, +); + + + diff --git a/public/favicon.ico b/public/favicon.ico index 18993ad91cfd43e03b074dd0b5cc3f37ab38e49c..a5292bf3ebc3c0eba1486abc4d5f40cc7011937a 100644 GIT binary patch literal 9235 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

#kMFB+VBjSd zMKgBg=WQPmq!Kaow&a+G?OV|bhFddi73NaQaICe4b71dR*CC-lAJL0pQ|E+Qw32Uf zw%yY*9ihg}`U74-l);fUU&#+nXhw9I$beH88N{qzK~K9R)l6^C#E$ci)cw2AWQo0s z#v-B=o!;a}TO&|UNhmS)Ggnd+_btd^z>#-@jIy#at6ZRy?Rd^Dzna$uAB&YCp!Oxd z`O59OJM}Fygd94Y2`f4U6<#s9Ne7RXVVKJKfUPGx9%6X-TVL=|QSW`y-GbZ-;C88_@%UR$Q^~PAx>352GqbAm@35l&x14aw-G>T^vS)IT3*hHFpi)e@li>o_O9jHIdKPk&dY zU_)VC%|FL3KrW5^thGmzmsQCUW;I8IV&`dR6zZ4c?+8h@{3zhE+vl@zaN&1Oh0TLRFETK zQm-+ShX;fnB~>J-Eu_U$TIQsen!cTz^vfSV%Tt>>!3WNNbyYY@8L+YWjTm@+xxeip158d7PAJvrDc#$2dk9SW zj{98YqkG(Io{VoM0j1}Kx|`pnBz;MN9lp&K7|`e4f(=j8=S>BI`8Pky0IkV~)i*ZZ zrjs-n+FaP>fSvW!Qc~(Q;M(oD`Pmdabf=6Smk~(6nLq{RbGDRRWdxX>jX#B9n+5lI zbAM8%HV)N)645-%7QFYh9Y4*hj81D+N1w>c2N^|4Cxw4afU*GJbAmFDC5NHl-l z^PQ32Ci*iCs?a=ORuXGIBi^>c^*&bOubx*^MZ3O!+ewbMF5z5N-N5WAD(f)eASa+l_2C2gQOF5Sgji|P2%6fiboy3Xo`a@t^z+?s5nI7z6mtVAt!Jknuo=8_P|Srk280@#dU=mc6q@$^Sk2 zKcSnW*PFNrwXESc-&=nn?8;5W@fS@Y#gGq70M?rKpAb2SO8w8m7CcW$3@F`X=A>(C ztlv?^a^;oI^sbVc&FLfiHxnU#L`STE@?zig>h7S)^o29W%1llIjf^z07`Bop>W zi{%FArWZ?{O--e>r(0hYeGAKvQg2A15x+Ukduya~VW8N-&t9`vMCq zOGiREbCw`xmFozJ^aNatJY>w+g ze6a2@u~m#^BZm@8wco9#Crlli0uLb^3E$t2-WIc^#(?t)*@`UpuofJ(Uyh@F>b3Ph z$D^m8Xq~pTkGJ4Q`Q2)te3mgkWYZ^Ijq|hkiP^9`De={bQQ%heZC$QU2UpP(-tbl8 zPWD2abEew;oat@w`uP3J^YpsgT%~jT(Dk%oU}sa$7|n6hBjDj`+I;RX(>)%lm_7N{+B7Mu%H?422lE%MBJH!!YTN2oT7xr>>N-8OF$C&qU^ z>vLsa{$0X%q1fjOe3P1mCv#lN{xQ4_*HCSAZjTb1`}mlc+9rl8$B3OP%VT@mch_~G z7Y+4b{r>9e=M+7vSI;BgB?ryZDY4m>&wcHSn81VH1N~`0gvwH{ z8dv#hG|OK`>1;j7tM#B)Z7zDN?{6=dUal}$e - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + +