fix(vitrine): pages PC plus larges, texte un peu plus petit.
Déploiement Hugo Staging / deploy-staging (push) Waiting to run

This commit is contained in:
deploy
2026-10-08 12:41:46 +02:00
parent d599f2e3a0
commit 371520e1b7
+44 -15
View File
@@ -25,7 +25,7 @@
--font-body: "Source Serif 4", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif; --font-body: "Source Serif 4", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
--font-ui: "Segoe UI", "Helvetica Neue", sans-serif; --font-ui: "Segoe UI", "Helvetica Neue", sans-serif;
--header-h: 3.75rem; --header-h: 3.75rem;
--max: 72rem; --max: 78rem;
--ease: cubic-bezier(0.22, 1, 0.36, 1); --ease: cubic-bezier(0.22, 1, 0.36, 1);
} }
@@ -46,8 +46,8 @@ html { scroll-behavior: smooth; }
body { body {
margin: 0; margin: 0;
font-family: var(--font-ui); font-family: var(--font-ui);
font-size: clamp(1rem, 0.95rem + 0.25vw, 1.1rem); font-size: 1rem;
line-height: 1.6; line-height: 1.55;
color: var(--ink); color: var(--ink);
background-color: var(--paper); background-color: var(--paper);
background-image: url("/images/app/paper2.jpg"); background-image: url("/images/app/paper2.jpg");
@@ -56,6 +56,12 @@ body {
background-position: center; background-position: center;
min-height: 100vh; min-height: 100vh;
} }
@media (min-width: 64rem) {
body {
font-size: 0.95rem;
line-height: 1.5;
}
}
:focus-visible { :focus-visible {
outline: 3px solid var(--mint); outline: 3px solid var(--mint);
@@ -161,32 +167,51 @@ body {
.site-main { min-height: 60vh; } .site-main { min-height: 60vh; }
.page-shell { .page-shell {
max-width: min(52rem, 92vw); max-width: min(56rem, 94vw);
margin: 0 auto; margin: 0 auto;
padding: 2.5rem 1.5rem 4rem; padding: 2rem 1.25rem 3.5rem;
} }
@media (min-width: 64rem) { @media (min-width: 64rem) {
.page-shell { .page-shell {
max-width: min(58rem, 88vw); max-width: min(68rem, 90vw);
padding: 3rem 2rem 5rem; padding: 2.5rem 2rem 4rem;
}
}
@media (min-width: 90rem) {
.page-shell {
max-width: min(74rem, 86vw);
} }
} }
.page-shell .content { .page-shell .content {
background: var(--surface); background: var(--surface);
padding: clamp(1.5rem, 3vw, 2.5rem); padding: clamp(1.25rem, 2.5vw, 2rem) clamp(1.25rem, 3vw, 2.75rem);
border-radius: 1.25rem; border-radius: 1.25rem;
box-shadow: 0 8px 32px rgba(42, 38, 34, 0.06); box-shadow: 0 8px 32px rgba(42, 38, 34, 0.06);
} }
.page-shell .content p,
.page-shell .content li {
font-size: 0.98rem;
}
@media (min-width: 64rem) {
.page-shell .content p,
.page-shell .content li {
font-size: 0.92rem;
max-width: 62rem;
}
}
.page-shell h1 { .page-shell h1 {
font-family: var(--font-brand); font-family: var(--font-brand);
font-size: clamp(1.75rem, 1.4rem + 1.5vw, 2.4rem); font-size: clamp(1.55rem, 1.3rem + 1vw, 2rem);
line-height: 1.2; line-height: 1.2;
margin-top: 0; margin-top: 0;
} }
.page-shell h2 { .page-shell h2 {
font-family: var(--font-brand); font-family: var(--font-brand);
font-size: 1.35rem; font-size: 1.2rem;
margin-top: 2rem; margin-top: 1.75rem;
}
@media (min-width: 64rem) {
.page-shell h2 { font-size: 1.15rem; }
} }
.page-shell a { color: var(--link); } .page-shell a { color: var(--link); }
.note-validation { .note-validation {
@@ -351,14 +376,18 @@ body {
.section__inner--narrow { max-width: 40rem; text-align: center; } .section__inner--narrow { max-width: 40rem; text-align: center; }
.section h2 { .section h2 {
font-family: var(--font-brand); font-family: var(--font-brand);
font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem); font-size: clamp(1.35rem, 1.15rem + 0.7vw, 1.75rem);
margin: 0 0 0.75rem; margin: 0 0 0.65rem;
line-height: 1.25; line-height: 1.25;
} }
.section__lead { .section__lead {
color: var(--ink-soft); color: var(--ink-soft);
margin: 0 0 2rem; margin: 0 0 1.75rem;
max-width: 36rem; max-width: 42rem;
font-size: 0.98rem;
}
@media (min-width: 64rem) {
.section__lead { font-size: 0.92rem; max-width: 48rem; }
} }
.section__inner--narrow .section__lead, .section__inner--narrow .section__lead,
.section__inner--narrow > p { margin-left: auto; margin-right: auto; } .section__inner--narrow > p { margin-left: auto; margin-right: auto; }