From c01ca837f29cfe686ea1fd1afe67184bd4ca3faa Mon Sep 17 00:00:00 2001 From: bisco Date: Wed, 25 Mar 2026 20:52:45 +0100 Subject: [PATCH] Refine RSVP form and confirmation modal presentation --- index.html | 11 ++++++----- style.css | 30 ++++++++++++++++-------------- 2 files changed, 22 insertions(+), 19 deletions(-) diff --git a/index.html b/index.html index 8696566..d03f335 100644 --- a/index.html +++ b/index.html @@ -143,15 +143,16 @@ novalidate > + +
+ + +
+

-
- - -
-
Confermi la tua presenza?
diff --git a/style.css b/style.css index 7631e93..5c5d720 100644 --- a/style.css +++ b/style.css @@ -859,7 +859,7 @@ body.modal-open { .success-modal__backdrop { position: absolute; inset: 0; - background: rgba(7, 14, 24, 0.52); + background: rgba(7, 14, 24, 0.64); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); } @@ -867,12 +867,11 @@ body.modal-open { .success-modal__dialog { position: relative; z-index: 1; - width: min(100%, 620px); + width: min(100%, 640px); } .success-tag { - display: grid; - grid-template-columns: 14px 1fr; + display: block; background: rgba(255, 255, 255, 0.95); border: 1px solid rgba(255, 255, 255, 0.9); border-radius: 30px; @@ -881,11 +880,12 @@ body.modal-open { } .success-tag__line { - background: linear-gradient(180deg, rgba(30,87,138,0.92), rgba(30,87,138,0.36)); + display: none; } .success-tag__content { - padding: 1.7rem 1.5rem 1.5rem 1.35rem; + padding: 2rem 2rem 1.7rem; + text-align: center; } .success-tag__kicker { @@ -898,31 +898,33 @@ body.modal-open { } .success-tag__title { - margin: 0; - font-size: clamp(1.7rem, 4vw, 2.4rem); - line-height: 1; + margin: 0 auto; + max-width: 18ch; + font-size: clamp(1.85rem, 4.1vw, 2.45rem); + line-height: 1.14; letter-spacing: -0.03em; + text-wrap: balance; } .success-tag__text { - margin: 0.8rem 0 1.25rem; + margin: 0.85rem auto 1.35rem; + max-width: 40ch; color: var(--ink-soft); - line-height: 1.7; + line-height: 1.72; } .success-tag__button { width: auto; - min-width: 132px; + min-width: 148px; } @media (max-width: 640px) { .success-tag { - grid-template-columns: 10px 1fr; border-radius: 24px; } .success-tag__content { - padding: 1.3rem 1.1rem 1.15rem 1rem; + padding: 1.35rem 1.2rem 1.2rem; } .success-tag__button {