Mobile : zone tactile du wordmark .brand étendue à 44 px effectifs (::after, pointer coarse)

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Simon-Pierre Boucher committed 2 mo ago (Aug 19, 2026) parent efeca9e Browse files

2 changed files +10 −2

modified frontend/dist/index.html +9 −2

				`@@ -95,7 +95,10 @@`
95		95
96	/* ---- Socle ---- */	96	/* ---- Socle ---- */
97	* { box-sizing: border-box; }	97	* { box-sizing: border-box; }
98	−html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }	98	+/* overflow-x: clip sur html ET body — sur WebKit iOS, clip posé sur body seul
		99	+ ne bloque PAS le défilement latéral du viewport (quirk de propagation) ;
		100	+ clip (≠ hidden) ne casse pas position:sticky. */
		101	+html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; overflow-x: clip; }
99	body {	102	body {
100	margin: 0;	103	margin: 0;
101	background: var(--paper);	104	background: var(--paper);
				`@@ -445,7 +448,10 @@ html.ka-scroll-lock, html.ka-scroll-lock body { overflow: hidden !important; ove`
445		448
446	/* ---- Socle ---- */	449	/* ---- Socle ---- */
447	* { box-sizing: border-box; }	450	* { box-sizing: border-box; }
448	−html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }	451	+/* overflow-x: clip sur html ET body — sur WebKit iOS, clip posé sur body seul
		452	+ ne bloque PAS le défilement latéral du viewport (quirk de propagation) ;
		453	+ clip (≠ hidden) ne casse pas position:sticky. */
		454	+html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; overflow-x: clip; }
449	body {	455	body {
450	margin: 0;	456	margin: 0;
451	background: var(--paper);	457	background: var(--paper);
				`@@ -704,6 +710,7 @@ a{text-decoration:none} button{font-family:inherit;cursor:pointer}`
704	.brand{font-family:var(--font-display);font-weight:700;font-size:23px;letter-spacing:-.03em;	710	.brand{font-family:var(--font-display);font-weight:700;font-size:23px;letter-spacing:-.03em;
705	display:flex;align-items:center;line-height:1;color:var(--ink)}	711	display:flex;align-items:center;line-height:1;color:var(--ink)}
706	.brand svg{margin-right:11px;flex:none}	712	.brand svg{margin-right:11px;flex:none}
		713	+@media(pointer:coarse){.brand{position:relative}.brand::after{content:"";position:absolute;inset:-8px}}
707	.brand .ka{background:var(--accent);color:var(--on-accent);border-radius:6px;padding:0 6px 1px;margin-left:2px;transform:rotate(-1deg)}	714	.brand .ka{background:var(--accent);color:var(--on-accent);border-radius:6px;padding:0 6px 1px;margin-left:2px;transform:rotate(-1deg)}
708	.brand-tag{font-family:var(--font-mono);font-size:10px;font-weight:500;color:var(--ink-3);	715	.brand-tag{font-family:var(--font-mono);font-size:10px;font-weight:500;color:var(--ink-3);
709	line-height:1.5;text-transform:uppercase;letter-spacing:.08em}	716	line-height:1.5;text-transform:uppercase;letter-spacing:.08em}

modified frontend/src/index.template.html +1 −0

				`@@ -72,6 +72,7 @@ a{text-decoration:none} button{font-family:inherit;cursor:pointer}`
72	.brand{font-family:var(--font-display);font-weight:700;font-size:23px;letter-spacing:-.03em;	72	.brand{font-family:var(--font-display);font-weight:700;font-size:23px;letter-spacing:-.03em;
73	display:flex;align-items:center;line-height:1;color:var(--ink)}	73	display:flex;align-items:center;line-height:1;color:var(--ink)}
74	.brand svg{margin-right:11px;flex:none}	74	.brand svg{margin-right:11px;flex:none}
		75	+@media(pointer:coarse){.brand{position:relative}.brand::after{content:"";position:absolute;inset:-8px}}
75	.brand .ka{background:var(--accent);color:var(--on-accent);border-radius:6px;padding:0 6px 1px;margin-left:2px;transform:rotate(-1deg)}	76	.brand .ka{background:var(--accent);color:var(--on-accent);border-radius:6px;padding:0 6px 1px;margin-left:2px;transform:rotate(-1deg)}
76	.brand-tag{font-family:var(--font-mono);font-size:10px;font-weight:500;color:var(--ink-3);	77	.brand-tag{font-family:var(--font-mono);font-size:10px;font-weight:500;color:var(--ink-3);
77	line-height:1.5;text-transform:uppercase;letter-spacing:.08em}	78	line-height:1.5;text-transform:uppercase;letter-spacing:.08em}
78		79

spb/crea-ka

Mobile : zone tactile du wordmark .brand étendue à 44 px effectifs (::after, pointer coarse)

Theme