165 lines
7.4 KiB
PHP
165 lines
7.4 KiB
PHP
<!doctype html>
|
|
<html lang="en" class="h-full">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>@yield('title', 'Dashboard') · Dewemoji</title>
|
|
<link rel="icon" href="/favicon.ico">
|
|
<link rel="preload" href="/assets/fonts/PlusJakartaSans-Regular.ttf" as="font" type="font/ttf" crossorigin>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<script>
|
|
tailwind.config = {
|
|
theme: {
|
|
extend: {
|
|
fontFamily: {
|
|
sans: ['"Plus Jakarta Sans"', 'system-ui', 'sans-serif'],
|
|
display: ['"Plus Jakarta Sans"', 'system-ui', 'sans-serif'],
|
|
},
|
|
colors: {
|
|
ink: '#0b0b10',
|
|
paper: '#f7f6f2',
|
|
dune: '#e7e1d6',
|
|
ocean: '#1d4ed8',
|
|
ember: '#f97316',
|
|
},
|
|
boxShadow: {
|
|
'panel': '0 18px 60px rgba(15, 23, 42, 0.12)',
|
|
}
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style>
|
|
@font-face {
|
|
font-family: "Plus Jakarta Sans";
|
|
src: url("/assets/fonts/PlusJakartaSans-Regular.ttf") format("truetype");
|
|
font-weight: 400;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
@font-face {
|
|
font-family: "Plus Jakarta Sans";
|
|
src: url("/assets/fonts/PlusJakartaSans-Medium.ttf") format("truetype");
|
|
font-weight: 500;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
@font-face {
|
|
font-family: "Plus Jakarta Sans";
|
|
src: url("/assets/fonts/PlusJakartaSans-SemiBold.ttf") format("truetype");
|
|
font-weight: 600;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
@font-face {
|
|
font-family: "Plus Jakarta Sans";
|
|
src: url("/assets/fonts/PlusJakartaSans-Bold.ttf") format("truetype");
|
|
font-weight: 700;
|
|
font-style: normal;
|
|
font-display: swap;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="h-full bg-paper text-slate-900">
|
|
@php
|
|
$user = auth()->user();
|
|
$isAdmin = Gate::allows('admin');
|
|
|
|
$navUser = [
|
|
['label' => 'Overview', 'href' => route('dashboard.overview')],
|
|
['label' => 'Usage', 'href' => route('dashboard.usage')],
|
|
['label' => 'API Keys', 'href' => route('dashboard.api-keys')],
|
|
['label' => 'Billing', 'href' => route('dashboard.billing')],
|
|
['label' => 'Preferences', 'href' => route('dashboard.preferences')],
|
|
];
|
|
$navAdmin = [
|
|
['label' => 'Overview', 'href' => route('dashboard.overview')],
|
|
['label' => 'Users', 'href' => route('dashboard.admin.users')],
|
|
['label' => 'Subscriptions', 'href' => route('dashboard.admin.subscriptions')],
|
|
['label' => 'Pricing', 'href' => route('dashboard.admin.pricing')],
|
|
['label' => 'Webhooks', 'href' => route('dashboard.admin.webhooks')],
|
|
['label' => 'Settings', 'href' => route('dashboard.admin.settings')],
|
|
];
|
|
$nav = $isAdmin ? $navAdmin : $navUser;
|
|
@endphp
|
|
|
|
<div class="min-h-screen bg-gradient-to-br from-[#f8f5ef] via-[#f6f7fb] to-[#e8eefc]">
|
|
<div class="mx-auto flex max-w-7xl flex-col lg:flex-row lg:items-start lg:gap-6">
|
|
<aside class="w-full lg:w-72 lg:shrink-0 lg:self-start">
|
|
<div class="p-6 lg:sticky lg:top-6">
|
|
<div class="rounded-3xl bg-white shadow-panel border border-[#e8e3d7] p-6">
|
|
<div class="flex items-center justify-between">
|
|
<div>
|
|
<div class="text-xs uppercase tracking-[0.2em] text-slate-400">Dewemoji</div>
|
|
<div class="text-2xl font-semibold text-slate-900">Dashboard</div>
|
|
</div>
|
|
<span class="rounded-full bg-ink text-paper text-xs px-3 py-1">
|
|
{{ $isAdmin ? 'Admin' : 'User' }}
|
|
</span>
|
|
</div>
|
|
|
|
<div class="mt-6 rounded-2xl bg-[#0f172a] text-white p-4">
|
|
<div class="text-sm opacity-70">Signed in as</div>
|
|
<div class="mt-1 font-semibold">
|
|
{{ $user?->name ?? 'Guest' }}
|
|
</div>
|
|
<div class="text-xs opacity-60">
|
|
{{ $user?->email ?? 'no-session' }}
|
|
</div>
|
|
</div>
|
|
|
|
<nav class="mt-6">
|
|
<div class="text-xs font-semibold uppercase tracking-[0.25em] text-slate-400">Menu</div>
|
|
<ul class="mt-4 space-y-2">
|
|
@foreach ($nav as $item)
|
|
<li>
|
|
<a href="{{ $item['href'] }}"
|
|
class="flex items-center justify-between rounded-xl border border-transparent px-3 py-2 text-sm font-medium text-slate-700 transition hover:border-[#d9d3c7] hover:bg-[#f5f1ea]">
|
|
<span>{{ $item['label'] }}</span>
|
|
<span class="text-xs text-slate-400">→</span>
|
|
</a>
|
|
</li>
|
|
@endforeach
|
|
</ul>
|
|
</nav>
|
|
|
|
<div class="mt-6 rounded-2xl border border-dashed border-[#d8d2c6] bg-[#faf7f1] p-4 text-sm text-slate-600">
|
|
<div class="font-semibold text-slate-800">Tip</div>
|
|
<div class="mt-1">Menu items are shared layout; only the sidebar changes by role.</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
|
|
<main class="flex-1 min-w-0 p-6 lg:p-10">
|
|
<div class="rounded-[32px] border border-[#e2deca] bg-white/70 shadow-panel backdrop-blur">
|
|
<div class="border-b border-[#ece7db] p-6 lg:p-8">
|
|
<div class="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
|
|
<div>
|
|
<div class="text-xs uppercase tracking-[0.25em] text-slate-400">Workspace</div>
|
|
<h1 class="mt-2 text-3xl font-semibold text-slate-900">
|
|
@yield('page_title', 'Dashboard Overview')
|
|
</h1>
|
|
<p class="mt-2 text-sm text-slate-600">@yield('page_subtitle', 'Everything you need in one calm, focused place.') </p>
|
|
</div>
|
|
<div class="flex gap-2">
|
|
<button class="rounded-full bg-ink px-5 py-2 text-sm font-semibold text-paper">
|
|
Quick action
|
|
</button>
|
|
<button class="rounded-full border border-[#d9d3c7] px-5 py-2 text-sm font-semibold text-slate-700">
|
|
Export
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="p-6 lg:p-8">
|
|
@yield('content')
|
|
</div>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|