Align Branches and Team settings UI with Care layout.
Deploy Ladill Frontdesk / deploy (push) Successful in 1m5s

Use the shared settings page and card pattern for branch, team,
buildings, and desks screens, with Settings breadcrumbs and a
Branches & team hub card on the organization settings page.
This commit is contained in:
isaacclad
2026-07-16 08:25:44 +00:00
parent fc072e71be
commit 4ce45f4989
9 changed files with 361 additions and 276 deletions
@@ -3,7 +3,7 @@
$settings = $organization->settings ?? [];
@endphp
<x-settings.page description="Configure branding, reception workflows, host alerts, and integrations for {{ $organization->name }}.">
<x-settings.page title="Organization settings" description="Configure branding, reception workflows, host alerts, and access for {{ $organization->name }}.">
@if ($canManage)
<x-settings.card title="Plan & usage" description="Subscription limits and notification billing for {{ $organization->name }}.">
<div class="flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between">
@@ -48,42 +48,40 @@
@endif
@if ($canViewBranches || $canViewTeam)
<div class="grid gap-4 sm:grid-cols-2">
@if ($canViewBranches)
<a href="{{ route('frontdesk.branches.index') }}"
class="group rounded-2xl border border-slate-200 bg-white p-5 shadow-sm transition hover:border-indigo-200 hover:shadow-md">
<div class="flex items-start justify-between gap-3">
<div>
<p class="text-sm font-semibold text-slate-900 group-hover:text-indigo-700">Branches</p>
<p class="mt-1 text-sm text-slate-500">Locations, buildings, and reception desks.</p>
</div>
@if (! $hasBranchesFeature)
<span class="shrink-0 rounded-full bg-amber-50 px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide text-amber-700">Pro</span>
@endif
</div>
<p class="mt-4 text-xs font-medium text-indigo-600">
{{ $hasBranchesFeature ? 'Manage branches →' : 'Upgrade to unlock →' }}
</p>
</a>
@endif
@if ($canViewTeam)
<a href="{{ route('frontdesk.members.index') }}"
class="group rounded-2xl border border-slate-200 bg-white p-5 shadow-sm transition hover:border-indigo-200 hover:shadow-md">
<div class="flex items-start justify-between gap-3">
<div>
<p class="text-sm font-semibold text-slate-900 group-hover:text-indigo-700">Team</p>
<p class="mt-1 text-sm text-slate-500">Invite colleagues and assign Frontdesk roles.</p>
</div>
@if (! $hasTeamFeature)
<span class="shrink-0 rounded-full bg-amber-50 px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide text-amber-700">Pro</span>
@endif
</div>
<p class="mt-4 text-xs font-medium text-indigo-600">
{{ $hasTeamFeature ? 'Manage team →' : 'Upgrade to unlock →' }}
</p>
</a>
@endif
</div>
<x-settings.card title="Branches & team" description="Locations and staff access for this organization. Multi-branch and team require Frontdesk Pro.">
<ul class="space-y-3">
@if ($canViewBranches)
<li>
<a href="{{ route('frontdesk.branches.index') }}"
class="flex items-center justify-between rounded-xl border border-slate-100 bg-slate-50 px-4 py-3 text-sm text-slate-700 hover:text-indigo-700">
<span>
Branches
@if (! $hasBranchesFeature)
<span class="ml-2 rounded-full bg-amber-50 px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide text-amber-700">Pro</span>
@endif
<span class="mt-0.5 block text-xs text-slate-500">Locations, buildings, and reception desks</span>
</span>
<span class="text-slate-400">&rarr;</span>
</a>
</li>
@endif
@if ($canViewTeam)
<li>
<a href="{{ route('frontdesk.members.index') }}"
class="flex items-center justify-between rounded-xl border border-slate-100 bg-slate-50 px-4 py-3 text-sm text-slate-700 hover:text-indigo-700">
<span>
Team
@if (! $hasTeamFeature)
<span class="ml-2 rounded-full bg-amber-50 px-2 py-0.5 text-[10px] font-semibold uppercase tracking-wide text-amber-700">Pro</span>
@endif
<span class="mt-0.5 block text-xs text-slate-500">Invite colleagues and assign Frontdesk roles</span>
</span>
<span class="text-slate-400">&rarr;</span>
</a>
</li>
@endif
</ul>
</x-settings.card>
@endif
<form method="POST" action="{{ route('frontdesk.settings.update') }}" enctype="multipart/form-data" class="space-y-6">