Stretch mobile WhatsApp CTA

This commit is contained in:
2026-05-16 22:59:11 +01:00
parent c6b649ef33
commit ec9bc7552f
2 changed files with 4 additions and 3 deletions

View File

@@ -16,6 +16,7 @@ All notable changes to the New Optic website will be documented in this file.
- Tightened mobile sizing for the WhatsApp nav pill and hero trust badge.
- Balanced mobile navbar controls so the language switcher, WhatsApp CTA, and menu do not bunch up on the right.
- Reduced the mobile gap between the reputation section and contact panel.
- Let the mobile WhatsApp nav CTA stretch into available navbar space.
## [1.0.0] - 2026-05-16

View File

@@ -48,9 +48,9 @@ export default function Navbar({ locale, onLocaleChange, t, whatsappUrl }: { loc
</PhysicsButton>
</div>
<div className="relative z-[3] flex min-w-0 flex-1 items-center justify-between gap-1 max-[374px]:gap-0.5 sm:gap-2 md:hidden">
<LanguageSwitcher locale={locale} onLocaleChange={onLocaleChange} className="min-w-[108px] max-w-[132px] flex-1 bg-white/80 backdrop-blur-none max-[374px]:min-w-[96px] max-[374px]:max-w-[108px] max-[374px]:p-0.5" buttonClassName="flex-1 px-0.5 max-[374px]:px-0 max-[374px]:py-1.5 sm:px-3" />
<PhysicsButton href={whatsappUrl} external className={`${navCtaClassName} shrink-0 px-2.5 py-2 text-[11px] max-[374px]:px-1.5 max-[374px]:py-1.5 max-[374px]:text-[9px] sm:px-5 sm:py-2.5 sm:text-sm`}>
<div className="relative z-[3] flex min-w-0 flex-1 items-center gap-1.5 max-[374px]:gap-0.5 sm:gap-2 md:hidden">
<LanguageSwitcher locale={locale} onLocaleChange={onLocaleChange} className="w-[132px] shrink-0 bg-white/80 backdrop-blur-none max-[374px]:w-[106px] max-[374px]:p-0.5" buttonClassName="flex-1 px-0.5 max-[374px]:px-0 max-[374px]:py-1.5 sm:px-3" />
<PhysicsButton href={whatsappUrl} external className={`${navCtaClassName} min-w-0 flex-1 px-2.5 py-2 text-[11px] max-[374px]:px-1.5 max-[374px]:py-1.5 max-[374px]:text-[9px] sm:px-5 sm:py-2.5 sm:text-sm`}>
{t.nav.cta}
</PhysicsButton>
<motion.button