Graham McIntire
dffa46dfde
- Remove default Phoenix branding and create custom layouts - Replace DaisyUI classes with custom Tailwind components throughout - Add authenticated layout with navigation bar for organization pages - Redesign all core components (buttons, forms, tables, alerts) - Make dashboard stat cards clickable to navigate to respective pages - Update alert acknowledge button to only show for equipment down alerts - Add consistent dark mode support across all pages - Implement modern design with zinc color palette and improved spacing
50 lines
2 KiB
Text
50 lines
2 KiB
Text
<Layouts.authenticated flash={@flash} current_organization={@current_organization}>
|
|
<.header>
|
|
{@page_title}
|
|
<:subtitle>Manage your site locations and hierarchy</:subtitle>
|
|
<:actions>
|
|
<.button navigate={~p"/orgs/#{@current_organization.slug}/sites/new"} variant="primary">
|
|
<.icon name="hero-plus" class="h-5 w-5" /> New Site
|
|
</.button>
|
|
</:actions>
|
|
</.header>
|
|
|
|
<%= if @sites == [] do %>
|
|
<div class="text-center py-16">
|
|
<.icon name="hero-building-office" class="mx-auto h-12 w-12 text-zinc-400 dark:text-zinc-600" />
|
|
<h3 class="mt-4 text-lg font-semibold text-zinc-900 dark:text-zinc-100">No sites</h3>
|
|
<p class="mt-2 text-sm text-zinc-600 dark:text-zinc-400">
|
|
Get started by creating your first site.
|
|
</p>
|
|
<div class="mt-6">
|
|
<.button navigate={~p"/orgs/#{@current_organization.slug}/sites/new"} variant="primary">
|
|
<.icon name="hero-plus" class="h-5 w-5" /> New Site
|
|
</.button>
|
|
</div>
|
|
</div>
|
|
<% else %>
|
|
<div class="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
|
|
<div
|
|
:for={site <- @sites}
|
|
class="relative overflow-hidden rounded-lg border border-zinc-200 bg-white p-6 shadow-sm hover:shadow-md transition-shadow dark:border-zinc-800 dark:bg-zinc-900"
|
|
>
|
|
<h3 class="text-xl font-semibold text-zinc-900 dark:text-zinc-100">{site.name}</h3>
|
|
<%= if site.location do %>
|
|
<p class="mt-2 flex items-center gap-1.5 text-sm text-zinc-600 dark:text-zinc-400">
|
|
<.icon name="hero-map-pin" class="h-4 w-4" /> {site.location}
|
|
</p>
|
|
<% end %>
|
|
<%= if site.parent_site do %>
|
|
<p class="mt-2 text-xs text-zinc-500 dark:text-zinc-500">
|
|
Parent: {site.parent_site.name}
|
|
</p>
|
|
<% end %>
|
|
<div class="mt-6">
|
|
<.button navigate={~p"/orgs/#{@current_organization.slug}/sites/#{site.id}"}>
|
|
View
|
|
</.button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
</Layouts.authenticated>
|