feat(public-booking): update logo and improve layout in confirmation page

This commit is contained in:
Jose Selesan
2026-06-05 17:06:24 -03:00
parent fee0be7e1f
commit b48dd4f15d
2 changed files with 7 additions and 7 deletions

View File

@@ -59,13 +59,14 @@ export function ShareWhatsappButton({ confirmation }: ShareWhatsappButtonProps)
<Button
type="button"
variant="outline"
className="h-12 w-full rounded-xl border-slate-200 bg-white text-sm font-semibold text-slate-900 hover:bg-slate-50 sm:text-base"
className="h-12 w-full overflow-hidden rounded-xl border-slate-200 bg-white px-0 text-sm font-semibold text-slate-900 hover:bg-slate-50 sm:px-4 sm:text-base"
asChild
>
<a
href={whatsappUrl}
target="_blank"
rel="noopener noreferrer"
aria-label="Compartir por WhatsApp"
title="Compartir por WhatsApp"
>
<svg
@@ -76,7 +77,7 @@ export function ShareWhatsappButton({ confirmation }: ShareWhatsappButtonProps)
>
<path d={siWhatsapp.path} fill="currentColor" />
</svg>
<span className="sm:hidden">Compartir por WhatsApp</span>
<span className="hidden sm:inline">Compartir por WhatsApp</span>
</a>
</Button>
);

View File

@@ -1,4 +1,4 @@
import PlayzerIcon from '@/assets/playzer-favicon-512-transparent.png';
import PlayzerLogo from '@/assets/playzer-logo-transparent.svg';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import {
@@ -162,9 +162,8 @@ export function PublicBookingConfirmationPage({
{displayData.complexName}
</h1>
</div>
<div className="flex items-center gap-2 text-slate-600">
<img src={PlayzerIcon} alt="Playzer" className="size-8" />
<span className="text-lg font-bold tracking-tight">Playzer</span>
<div className="flex items-center">
<img src={PlayzerLogo} alt="Playzer" className="h-9 w-auto sm:h-10" />
</div>
</div>
@@ -221,7 +220,7 @@ export function PublicBookingConfirmationPage({
cancelación.
</div>
) : (
<div className="grid grid-cols-3 gap-2 sm:gap-3">
<div className="grid grid-cols-[48px_minmax(0,1fr)_minmax(0,1fr)] gap-2 sm:grid-cols-3 sm:gap-3">
<ShareWhatsappButton confirmation={confirmationQuery.data!} />
<Button
type="button"