Files
ladill-events/resources/views/qr-codes/badges.blade.php
T
isaaccladandCursor 2c1c3cdd3e
Deploy Ladill Events / deploy (push) Successful in 30s
Enforce Events favicon everywhere and fix deploy pipeline failures.
Add favicon partial to all standalone pages, regenerate the Events icon asset, and stop marking deploys failed when the nginx vhost step cannot sudo.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-07 11:56:27 +00:00

86 lines
4.5 KiB
PHP

@php
$c = $qrCode->content();
$evColor = $c['brand_color'] ?? '#4f46e5';
$evName = $c['name'] ?? $qrCode->label;
$hasLogo = !empty($c['logo_path']);
$logoUrl = $hasLogo ? route('qr.public.event.logo', $qrCode->short_code) : null;
$size = $c['badge_size'] ?? '4x3';
// Physical badge dimensions (inches)
[$bw, $bh] = match ($size) {
'4x6' => ['4in', '6in'],
'cr80' => ['3.375in', '2.125in'],
default => ['4in', '3in'],
};
$stack = $size === '4x6'; // tall badge → stack vertically
@endphp
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
@include('partials.favicon')
<title>Badges {{ $evName }}</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #e5e7eb; color: #0f172a; }
.toolbar { position: sticky; top: 0; display: flex; gap: 10px; justify-content: center; padding: 14px; background: #fff; border-bottom: 1px solid #e2e8f0; }
.toolbar button { border: none; border-radius: 10px; padding: 9px 18px; font-size: 13px; font-weight: 700; cursor: pointer; }
.btn-print { background: {{ $evColor }}; color: #fff; }
.btn-close { background: #f1f5f9; color: #475569; }
.sheet { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; padding: 24px; }
.badge {
width: {{ $bw }}; height: {{ $bh }};
background: #fff; border: 1px solid #cbd5e1; border-radius: 10px; overflow: hidden;
display: flex; flex-direction: column;
}
.badge-head { background: {{ $evColor }}; color: #fff; padding: 8px 10px; display: flex; align-items: center; gap: 7px; }
.badge-head img { height: 22px; width: 22px; object-fit: contain; background: #fff; border-radius: 4px; padding: 1px; }
.badge-head .ev { font-size: 11px; font-weight: 800; letter-spacing: .02em; line-height: 1.1; }
.badge-body { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 6px 10px; }
.badge-name { font-size: 22px; font-weight: 900; line-height: 1.05; }
.badge-tier { margin-top: 3px; font-size: 11px; font-weight: 700; color: {{ $evColor }}; text-transform: uppercase; letter-spacing: .05em; }
.badge-fields { margin-top: 4px; font-size: 9.5px; color: #64748b; }
.badge-foot { display: flex; align-items: center; justify-content: space-between; padding: 6px 10px; border-top: 1px solid #e2e8f0; }
.badge-foot code { font-family: ui-monospace, monospace; font-size: 11px; font-weight: 700; letter-spacing: .12em; }
.badge-foot img { height: 44px; width: 44px; }
@media print {
.toolbar { display: none; }
body { background: #fff; }
.sheet { padding: 0; gap: 0; }
.badge { border: none; border-radius: 0; page-break-after: always; break-after: page; }
@page { size: {{ $bw }} {{ $bh }}; margin: 0; }
}
</style>
</head>
<body @if($auto) onload="window.print()" @endif>
<div class="toolbar">
<button class="btn-print" onclick="window.print()">Print {{ count($registrations) }} badge{{ count($registrations) === 1 ? '' : 's' }}</button>
<button class="btn-close" onclick="window.close()">Close</button>
</div>
<div class="sheet">
@forelse($registrations as $reg)
@php $badgeQr = 'https://api.qrserver.com/v1/create-qr-code/?size=120x120&margin=0&data=' . urlencode($reg->badge_code); @endphp
<div class="badge">
<div class="badge-head">
@if($hasLogo)<img src="{{ $logoUrl }}" alt="">@endif
<span class="ev">{{ $evName }}</span>
</div>
<div class="badge-body">
<div class="badge-name">{{ $reg->attendee_name }}</div>
<div class="badge-tier">{{ $reg->tier_name }}</div>
@if(!empty($reg->badge_fields))
<div class="badge-fields">{{ collect($reg->badge_fields)->map(fn($v,$k) => $v)->implode(' · ') }}</div>
@endif
</div>
<div class="badge-foot">
<code>{{ $reg->badge_code }}</code>
<img src="{{ $badgeQr }}" alt="{{ $reg->badge_code }}">
</div>
</div>
@empty
<p style="padding:40px;color:#64748b;">No confirmed attendees to print.</p>
@endforelse
</div>
</body>
</html>