diff --git a/assets/img/livre-blanc.png b/assets/img/livre-blanc.png new file mode 100644 index 0000000..2dded94 Binary files /dev/null and b/assets/img/livre-blanc.png differ diff --git a/site/templates/expertise.json.php b/site/templates/expertise.json.php index 105e16b..a2f9daf 100644 --- a/site/templates/expertise.json.php +++ b/site/templates/expertise.json.php @@ -1,7 +1,7 @@ $page->writer()->value(), + 'pageTitle' => $page->writer()->inline()->value(), 'backgroundVideo' => $page->backgroundVideo()->toFile()?->url(), 'backgroundVideoReverse' => $page->backgroundVideoReverse()->toFile()?->url(), 'items' => $page->body()->toBlocks()->filter(fn($b) => $b->type() === 'text')->map(fn($block) => [ diff --git a/src/styles/form.css b/src/styles/form.css new file mode 100644 index 0000000..bf977bb --- /dev/null +++ b/src/styles/form.css @@ -0,0 +1,17 @@ +.input { + background: rgba(255, 255, 255, 0.08); + border: 1px solid rgba(255, 255, 255, 0.25); + border-radius: 0.3rem; + color: #fff; + font-family: "Danzza", sans-serif; + font-size: var(--font-size-paragraph); + padding: 0.875rem 1rem; + width: 100%; + transition: border-color 0.2s; +} + +@media screen and (max-width: 700px) { + .input { + padding: 0.6rem 1rem; + } +} diff --git a/src/styles/index.css b/src/styles/index.css index 0db6dc0..9b1db34 100644 --- a/src/styles/index.css +++ b/src/styles/index.css @@ -1,9 +1,10 @@ /* Main styles entry point */ -@import './variables.css'; -@import './reset.css'; -@import './fonts.css'; -@import './layout.css'; -@import './collection.css'; -@import './buttons.css'; -@import './cursor.css'; -@import './utils.css'; +@import "./variables.css"; +@import "./reset.css"; +@import "./fonts.css"; +@import "./layout.css"; +@import "./collection.css"; +@import "./buttons.css"; +@import "./cursor.css"; +@import "./form.css"; +@import "./utils.css"; diff --git a/src/views/Expertise.svelte b/src/views/Expertise.svelte index cc5c33d..d902d0a 100644 --- a/src/views/Expertise.svelte +++ b/src/views/Expertise.svelte @@ -258,7 +258,7 @@ -

+

{@html data?.pageTitle ?? ''}

diff --git a/src/views/WhitePaper.svelte b/src/views/WhitePaper.svelte index 769aa8a..aefd2b3 100644 --- a/src/views/WhitePaper.svelte +++ b/src/views/WhitePaper.svelte @@ -51,7 +51,7 @@ } -
+

{t('white_paper_label')}

@@ -79,7 +79,6 @@
- {#if status === 'success'}
@@ -226,17 +225,6 @@ gap: 0.75rem; } - .input { - background: rgba(255, 255, 255, 0.08); - border: 1px solid rgba(255, 255, 255, 0.25); - color: #fff; - font-family: "Danzza", sans-serif; - font-size: var(--font-size-paragraph); - padding: 0.875rem 1rem; - width: 100%; - transition: border-color 0.2s; - } - .input:focus { outline: none; border-color: var(--color-primary); @@ -341,15 +329,18 @@ /* ── Mobile ── */ @media (max-width: 700px) { .white-paper { - display: block; - height: 100vh; - overflow: hidden; - padding: 6rem 0; position: relative; + height: 100vh; + padding: 0; + + display: flex; + flex-direction: column; + justify-content: center; } .catch-area { width: auto; + margin-bottom: 10rem; } .label { @@ -392,20 +383,29 @@ pointer-events: none; } - /* Form overlay */ + /* Quand le formulaire est affiché : masque le contenu principal */ + .show-form .catch-area, + .show-form .cover { + display: none; + } + + /* Formulaire in-flow dans la slide (pas d'overlay fixe) */ .form-area { display: none; - position: fixed; - inset: 0; - z-index: 100; - background: #0b0b18; - flex-direction: column; - padding: 1.5rem 1.25rem; - overflow-y: auto; } .form-area.is-visible { + margin: 0; display: flex; + flex-direction: column; + width: 100%; + height: fit-content; + padding: 1.5rem; + overflow-y: auto; + } + + .form-intro { + font-size: var(--font-size-paragraph-mobile); } .form-close { @@ -413,21 +413,25 @@ align-self: flex-end; background: none; border: none; - color: #fff; + color: rgba(255,255,255,0.5); font-size: 1.25rem; cursor: pointer; - padding: 0.25rem 0.5rem; - margin-bottom: 1rem; + padding: 0.5rem; + margin-bottom: 0.5rem; } .form-card { - background: none; padding: 0; flex: 1; } + .consent span { + font-size: var(--font-size-paragraph-small-mobile); + } + .submit { - margin-top: auto; + margin-top: 1.5rem; + width: 100%; } }