chore: initial project import
Some checks failed
CI - Production Readiness / Verify (push) Has been cancelled
Some checks failed
CI - Production Readiness / Verify (push) Has been cancelled
This commit is contained in:
Wira Basalamah
357
screen_design/zappcare_create_tenant/code.html
Normal file
357
screen_design/zappcare_create_tenant/code.html
Normal file
@ -0,0 +1,357 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html class="light" lang="en"><head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
|
||||
<title>ZappCare Super Admin - Create Tenant</title>
|
||||
<!-- Tailwind CSS -->
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
|
||||
<!-- Google Fonts: Manrope & Inter -->
|
||||
<link href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700;800&family=Inter:wght@400;500;600&display=swap" rel="stylesheet"/>
|
||||
<!-- Material Symbols -->
|
||||
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
|
||||
<script id="tailwind-config">
|
||||
tailwind.config = {
|
||||
darkMode: "class",
|
||||
theme: {
|
||||
extend: {
|
||||
"colors": {
|
||||
"surface-dim": "#d8dadc",
|
||||
"on-secondary-fixed-variant": "#194c64",
|
||||
"tertiary-fixed-dim": "#feb876",
|
||||
"inverse-surface": "#2d3133",
|
||||
"on-primary": "#ffffff",
|
||||
"on-error-container": "#93000a",
|
||||
"on-tertiary-container": "#76450c",
|
||||
"error": "#ba1a1a",
|
||||
"tertiary": "#865219",
|
||||
"on-surface": "#191c1e",
|
||||
"surface-container-highest": "#e0e3e5",
|
||||
"primary": "#0c6780",
|
||||
"background": "#f7f9fc",
|
||||
"on-primary-fixed-variant": "#004d62",
|
||||
"on-primary-fixed": "#001f29",
|
||||
"primary-fixed": "#baeaff",
|
||||
"surface-container-lowest": "#ffffff",
|
||||
"on-primary-container": "#005870",
|
||||
"error-container": "#ffdad6",
|
||||
"on-secondary-fixed": "#001e2d",
|
||||
"secondary": "#35637d",
|
||||
"tertiary-container": "#fbb674",
|
||||
"surface-container": "#eceef0",
|
||||
"on-tertiary": "#ffffff",
|
||||
"secondary-fixed": "#c5e7ff",
|
||||
"on-surface-variant": "#3f484c",
|
||||
"primary-fixed-dim": "#89d0ed",
|
||||
"tertiary-fixed": "#ffdcbf",
|
||||
"on-secondary": "#ffffff",
|
||||
"on-tertiary-fixed": "#2d1600",
|
||||
"inverse-primary": "#89d0ed",
|
||||
"surface-tint": "#0c6780",
|
||||
"secondary-container": "#b2e0fe",
|
||||
"outline": "#6f787d",
|
||||
"inverse-on-surface": "#eff1f3",
|
||||
"surface": "#f7f9fc",
|
||||
"surface-bright": "#f7f9fc",
|
||||
"surface-container-low": "#f2f4f6",
|
||||
"on-secondary-container": "#36647e",
|
||||
"surface-container-high": "#e6e8ea",
|
||||
"on-background": "#191c1e",
|
||||
"outline-variant": "#bfc8cd",
|
||||
"on-tertiary-fixed-variant": "#6a3b01",
|
||||
"on-error": "#ffffff",
|
||||
"secondary-fixed-dim": "#9fccea",
|
||||
"primary-container": "#87ceeb",
|
||||
"surface-variant": "#e0e3e5"
|
||||
},
|
||||
"borderRadius": {
|
||||
"DEFAULT": "0.125rem",
|
||||
"lg": "0.25rem",
|
||||
"xl": "0.5rem",
|
||||
"full": "0.75rem"
|
||||
},
|
||||
"fontFamily": {
|
||||
"headline": ["Manrope"],
|
||||
"body": ["Inter"],
|
||||
"label": ["Inter"]
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
body { font-family: 'Inter', sans-serif; }
|
||||
h1, h2, h3, .brand-font { font-family: 'Manrope', sans-serif; }
|
||||
.material-symbols-outlined {
|
||||
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
|
||||
}
|
||||
.glass-panel {
|
||||
background: rgba(247, 249, 252, 0.85);
|
||||
backdrop-filter: blur(20px);
|
||||
}
|
||||
/* Custom scrollbar for clean UI */
|
||||
::-webkit-scrollbar { width: 6px; }
|
||||
::-webkit-scrollbar-track { background: transparent; }
|
||||
::-webkit-scrollbar-thumb { background: #e0e3e5; border-radius: 10px; }
|
||||
</style>
|
||||
</head>
|
||||
<body class="bg-background text-on-background antialiased selection:bg-primary-container selection:text-on-primary-container">
|
||||
<!-- SideNavBar (from JSON) -->
|
||||
<aside class="h-screen w-64 fixed left-0 top-0 bg-[#f2f4f6] dark:bg-slate-900/85 backdrop-blur-xl flex flex-col p-4 space-y-2 z-50">
|
||||
<div class="flex items-center gap-3 px-2 mb-8 mt-2">
|
||||
<div class="w-8 h-8 rounded-full bg-gradient-to-tr from-primary to-primary-container flex items-center justify-center">
|
||||
<span class="material-symbols-outlined text-on-primary text-lg" data-icon="hub">hub</span>
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<span class="text-xl font-bold text-[#0c6780] dark:text-[#87ceeb] tracking-tight">ZappCare</span>
|
||||
<span class="text-[10px] font-semibold text-slate-500 uppercase tracking-widest">System Admin</span>
|
||||
</div>
|
||||
</div>
|
||||
<nav class="flex-1 space-y-1">
|
||||
<!-- Infrastructure -->
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 dark:text-slate-400 hover:bg-slate-200/50 dark:hover:bg-slate-800/50 transition-all duration-200 rounded-xl font-semibold tracking-tight" href="#">
|
||||
<span class="material-symbols-outlined" data-icon="dns">dns</span>
|
||||
<span>Infrastructure</span>
|
||||
</a>
|
||||
<!-- Monitoring -->
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 dark:text-slate-400 hover:bg-slate-200/50 dark:hover:bg-slate-800/50 transition-all duration-200 rounded-xl font-semibold tracking-tight" href="#">
|
||||
<span class="material-symbols-outlined" data-icon="analytics">analytics</span>
|
||||
<span>Monitoring</span>
|
||||
</a>
|
||||
<!-- Agents -->
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 dark:text-slate-400 hover:bg-slate-200/50 dark:hover:bg-slate-800/50 transition-all duration-200 rounded-xl font-semibold tracking-tight" href="#">
|
||||
<span class="material-symbols-outlined" data-icon="support_agent">support_agent</span>
|
||||
<span>Agents</span>
|
||||
</a>
|
||||
<!-- Tenants (ACTIVE) -->
|
||||
<a class="flex items-center gap-3 px-3 py-2 bg-[#87ceeb] text-[#005870] rounded-xl font-bold transition-all duration-200 scale-95" href="#">
|
||||
<span class="material-symbols-outlined" data-icon="domain">domain</span>
|
||||
<span>Tenants</span>
|
||||
</a>
|
||||
<!-- Health -->
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 dark:text-slate-400 hover:bg-slate-200/50 dark:hover:bg-slate-800/50 transition-all duration-200 rounded-xl font-semibold tracking-tight" href="#">
|
||||
<span class="material-symbols-outlined" data-icon="monitor_heart">monitor_heart</span>
|
||||
<span>Health</span>
|
||||
</a>
|
||||
<!-- Logs -->
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 dark:text-slate-400 hover:bg-slate-200/50 dark:hover:bg-slate-800/50 transition-all duration-200 rounded-xl font-semibold tracking-tight" href="#">
|
||||
<span class="material-symbols-outlined" data-icon="terminal">terminal</span>
|
||||
<span>Logs</span>
|
||||
</a>
|
||||
</nav>
|
||||
<div class="mt-auto pt-4 space-y-1">
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 dark:text-slate-400 hover:bg-slate-200/50 dark:hover:bg-slate-800/50 transition-all duration-200 rounded-xl font-semibold tracking-tight" href="#">
|
||||
<span class="material-symbols-outlined" data-icon="settings">settings</span>
|
||||
<span>Settings</span>
|
||||
</a>
|
||||
<a class="flex items-center gap-3 px-3 py-2 text-slate-600 dark:text-slate-400 hover:bg-slate-200/50 dark:hover:bg-slate-800/50 transition-all duration-200 rounded-xl font-semibold tracking-tight" href="#">
|
||||
<span class="material-symbols-outlined" data-icon="help_outline">help_outline</span>
|
||||
<span>Support</span>
|
||||
</a>
|
||||
<div class="flex items-center gap-3 px-3 py-4 mt-2 border-t border-slate-200/50">
|
||||
<img alt="ZappCare Admin" class="w-10 h-10 rounded-full object-cover shadow-sm" data-alt="Professional portrait of a male corporate administrator with friendly expression in office setting" src="https://lh3.googleusercontent.com/aida-public/AB6AXuD5BqMMcAUPdAUAmAMUvP2epTjvLiZPyaRCC7i1jpQVJynddFiUXqeuhAr8x6O9mfgwZDs1xkpaz87jdpTiGEOZJx4ItUC_zyN1PFhxDb4gAeEujchnlUqHoB7sOrhE4diNHm52EGKc7A9TCZp5gFenNHUQ4kKlJnwsq75321EonX6FrYfOK424SOqGVWcoZC103jQp3AsoEUwr9dmp6aggndPVi3W_0pwTdgMssAsiRjgGnCjjknxeIsNWf-PzIdyWZBc8ldQNELE"/>
|
||||
<div class="flex flex-col overflow-hidden">
|
||||
<span class="text-sm font-bold text-on-surface truncate">Admin User</span>
|
||||
<span class="text-xs text-slate-500 truncate">master@zappcare.com</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<!-- TopNavBar (from JSON) -->
|
||||
<header class="fixed top-0 right-0 left-64 h-16 z-40 bg-[#f7f9fc]/90 dark:bg-slate-950/90 backdrop-blur-md flex items-center justify-between px-8 w-full">
|
||||
<div class="flex items-center gap-6">
|
||||
<div class="relative group">
|
||||
<span class="absolute inset-y-0 left-3 flex items-center text-slate-400">
|
||||
<span class="material-symbols-outlined text-lg" data-icon="search">search</span>
|
||||
</span>
|
||||
<input class="bg-surface-container-low border-none rounded-full py-1.5 pl-10 pr-4 text-sm w-64 focus:ring-2 focus:ring-primary/20 transition-all" placeholder="Search infrastructure..." type="text"/>
|
||||
</div>
|
||||
<nav class="hidden md:flex gap-8">
|
||||
<a class="text-slate-500 hover:text-slate-800 font-medium text-sm transition-opacity" href="#">Dashboard</a>
|
||||
<a class="text-slate-500 hover:text-slate-800 font-medium text-sm transition-opacity" href="#">Metrics</a>
|
||||
<a class="text-slate-500 hover:text-slate-800 font-medium text-sm transition-opacity" href="#">Reports</a>
|
||||
</nav>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<button class="flex items-center gap-2 px-4 py-1.5 bg-surface-container-low hover:bg-surface-container rounded-full text-xs font-bold text-[#0c6780] transition-colors">
|
||||
<span class="w-2 h-2 rounded-full bg-emerald-500 animate-pulse"></span>
|
||||
System Status
|
||||
</button>
|
||||
<button class="p-2 text-slate-500 hover:bg-surface-container-low rounded-full transition-colors">
|
||||
<span class="material-symbols-outlined" data-icon="notifications">notifications</span>
|
||||
</button>
|
||||
<button class="p-2 text-slate-500 hover:bg-surface-container-low rounded-full transition-colors">
|
||||
<span class="material-symbols-outlined" data-icon="account_circle">account_circle</span>
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
<!-- Main Canvas -->
|
||||
<main class="ml-64 pt-16 min-h-screen">
|
||||
<div class="max-w-6xl mx-auto p-12">
|
||||
<!-- Header Section -->
|
||||
<div class="mb-12">
|
||||
<nav class="flex items-center gap-2 text-sm text-slate-400 mb-4">
|
||||
<span>Tenants</span>
|
||||
<span class="material-symbols-outlined text-xs" data-icon="chevron_right">chevron_right</span>
|
||||
<span class="text-on-surface font-medium">New Registration</span>
|
||||
</nav>
|
||||
<h1 class="text-4xl font-extrabold text-on-surface tracking-tight mb-2">Create New Tenant</h1>
|
||||
<p class="text-slate-500 font-medium max-w-2xl">Onboard a new business client to the ZappCare ecosystem. Define their identity, choose their architecture, and set up administrative credentials.</p>
|
||||
</div>
|
||||
<!-- Content Grid: Bento Style -->
|
||||
<form class="grid grid-cols-12 gap-8">
|
||||
<!-- Left Column: Core Identity -->
|
||||
<div class="col-span-12 lg:col-span-7 space-y-8">
|
||||
<!-- General Information Card -->
|
||||
<section class="bg-surface-container-lowest p-8 rounded-full shadow-none">
|
||||
<div class="flex items-center gap-3 mb-8">
|
||||
<div class="w-10 h-10 rounded-xl bg-primary/10 flex items-center justify-center text-primary">
|
||||
<span class="material-symbols-outlined" data-icon="badge">badge</span>
|
||||
</div>
|
||||
<h2 class="text-xl font-bold tracking-tight">Organization Profile</h2>
|
||||
</div>
|
||||
<div class="space-y-6">
|
||||
<!-- Company Name -->
|
||||
<div class="group">
|
||||
<label class="block text-xs font-bold text-slate-400 uppercase tracking-widest mb-2 transition-colors group-focus-within:text-primary">Company Name</label>
|
||||
<input class="w-full bg-surface-container-highest border-none rounded-xl p-4 text-on-surface focus:ring-0 transition-all border-b-2 border-transparent focus:border-primary" placeholder="e.g. Acme Health Corp" type="text"/>
|
||||
</div>
|
||||
<!-- Tenant Slug & Timezone Row -->
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div class="group">
|
||||
<label class="block text-xs font-bold text-slate-400 uppercase tracking-widest mb-2 transition-colors group-focus-within:text-primary">Tenant Name (Slug)</label>
|
||||
<div class="relative">
|
||||
<input class="w-full bg-surface-container-highest border-none rounded-xl p-4 pr-32 text-on-surface focus:ring-0 transition-all border-b-2 border-transparent focus:border-primary" placeholder="acme-health" type="text"/>
|
||||
<span class="absolute right-4 top-1/2 -translate-y-1/2 text-slate-400 font-mono text-xs">.zappcare.com</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group">
|
||||
<label class="block text-xs font-bold text-slate-400 uppercase tracking-widest mb-2 transition-colors group-focus-within:text-primary">Primary Timezone</label>
|
||||
<div class="relative">
|
||||
<select class="w-full bg-surface-container-highest border-none rounded-xl p-4 text-on-surface focus:ring-0 appearance-none transition-all border-b-2 border-transparent focus:border-primary">
|
||||
<option>UTC -05:00 Eastern Time</option>
|
||||
<option>UTC +00:00 Greenwich Mean</option>
|
||||
<option>UTC +01:00 Central European</option>
|
||||
<option>UTC +08:00 Singapore Time</option>
|
||||
</select>
|
||||
<span class="absolute right-4 top-1/2 -translate-y-1/2 text-slate-400 pointer-events-none">
|
||||
<span class="material-symbols-outlined" data-icon="schedule">schedule</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- Administrative Contact -->
|
||||
<section class="bg-surface-container-lowest p-8 rounded-full shadow-none">
|
||||
<div class="flex items-center gap-3 mb-8">
|
||||
<div class="w-10 h-10 rounded-xl bg-secondary/10 flex items-center justify-center text-secondary">
|
||||
<span class="material-symbols-outlined" data-icon="admin_panel_settings">admin_panel_settings</span>
|
||||
</div>
|
||||
<h2 class="text-xl font-bold tracking-tight">Root Administrator</h2>
|
||||
</div>
|
||||
<div class="group">
|
||||
<label class="block text-xs font-bold text-slate-400 uppercase tracking-widest mb-2 transition-colors group-focus-within:text-primary">Initial Admin Email</label>
|
||||
<input class="w-full bg-surface-container-highest border-none rounded-xl p-4 text-on-surface focus:ring-0 transition-all border-b-2 border-transparent focus:border-primary" placeholder="admin@clientdomain.com" type="email"/>
|
||||
<p class="mt-2 text-xs text-slate-400">The first super-user will receive an invitation link to set their password.</p>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
<!-- Right Column: Plan & Submission -->
|
||||
<div class="col-span-12 lg:col-span-5 space-y-8">
|
||||
<!-- Subscription Plan Card -->
|
||||
<section class="bg-surface-container-low p-8 rounded-full border border-white shadow-sm overflow-hidden relative">
|
||||
<div class="absolute -top-6 -right-6 w-32 h-32 bg-primary/5 rounded-full blur-3xl"></div>
|
||||
<div class="flex items-center gap-3 mb-8 relative z-10">
|
||||
<div class="w-10 h-10 rounded-xl bg-tertiary/10 flex items-center justify-center text-tertiary">
|
||||
<span class="material-symbols-outlined" data-icon="workspace_premium">workspace_premium</span>
|
||||
</div>
|
||||
<h2 class="text-xl font-bold tracking-tight">Subscription Plan</h2>
|
||||
</div>
|
||||
<div class="space-y-4 relative z-10">
|
||||
<!-- Plan Option 1 -->
|
||||
<label class="block cursor-pointer group">
|
||||
<input checked="" class="hidden peer" name="plan" type="radio"/>
|
||||
<div class="p-5 rounded-xl border-2 border-transparent bg-white peer-checked:border-primary peer-checked:bg-primary/5 transition-all flex items-start gap-4">
|
||||
<div class="mt-1 w-5 h-5 rounded-full border-2 border-slate-200 peer-checked:bg-primary peer-checked:border-primary flex items-center justify-center transition-colors">
|
||||
<div class="w-2 h-2 rounded-full bg-white scale-0 transition-transform peer-checked:scale-100"></div>
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<div class="flex justify-between mb-1">
|
||||
<span class="font-bold text-on-surface">Standard</span>
|
||||
<span class="text-sm font-bold text-primary">$299/mo</span>
|
||||
</div>
|
||||
<p class="text-xs text-slate-500 leading-relaxed">Up to 50 agents, 10k messages, basic reporting and email support.</p>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
<!-- Plan Option 2 -->
|
||||
<label class="block cursor-pointer group">
|
||||
<input class="hidden peer" name="plan" type="radio"/>
|
||||
<div class="p-5 rounded-xl border-2 border-transparent bg-white peer-checked:border-primary peer-checked:bg-primary/5 transition-all flex items-start gap-4">
|
||||
<div class="mt-1 w-5 h-5 rounded-full border-2 border-slate-200 peer-checked:bg-primary peer-checked:border-primary flex items-center justify-center transition-colors">
|
||||
<div class="w-2 h-2 rounded-full bg-white scale-0 transition-transform peer-checked:scale-100"></div>
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<div class="flex justify-between mb-1">
|
||||
<span class="font-bold text-on-surface">Enterprise</span>
|
||||
<span class="text-sm font-bold text-primary">$899/mo</span>
|
||||
</div>
|
||||
<p class="text-xs text-slate-500 leading-relaxed">Unlimited agents, dedicated API shard, 24/7 priority SLA support.</p>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
<!-- Plan Option 3 -->
|
||||
<label class="block cursor-pointer group">
|
||||
<input class="hidden peer" name="plan" type="radio"/>
|
||||
<div class="p-5 rounded-xl border-2 border-transparent bg-white peer-checked:border-primary peer-checked:bg-primary/5 transition-all flex items-start gap-4">
|
||||
<div class="mt-1 w-5 h-5 rounded-full border-2 border-slate-200 peer-checked:bg-primary peer-checked:border-primary flex items-center justify-center transition-colors">
|
||||
<div class="w-2 h-2 rounded-full bg-white scale-0 transition-transform peer-checked:scale-100"></div>
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<div class="flex justify-between mb-1">
|
||||
<span class="font-bold text-on-surface">Custom Arch</span>
|
||||
<span class="text-sm font-bold text-primary">Contact</span>
|
||||
</div>
|
||||
<p class="text-xs text-slate-500 leading-relaxed">Single-tenant isolated instance, HIPAA compliance pack, on-prem option.</p>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
</section>
|
||||
<!-- Deployment Summary & Actions -->
|
||||
<div class="bg-surface-container-highest/30 p-8 rounded-full">
|
||||
<div class="flex items-start gap-4 mb-8">
|
||||
<span class="material-symbols-outlined text-primary" data-icon="info">info</span>
|
||||
<p class="text-xs text-slate-600 leading-relaxed">
|
||||
By clicking <span class="font-bold">Register Tenant</span>, you will initiate the infrastructure provisioning workflow. This process typically takes 2-4 minutes to spin up the dedicated containers and database schemas.
|
||||
</p>
|
||||
</div>
|
||||
<div class="space-y-3">
|
||||
<button class="w-full bg-gradient-to-br from-primary to-primary-container text-white py-4 px-8 rounded-full font-bold shadow-lg shadow-primary/20 hover:scale-[1.02] active:scale-[0.98] transition-all flex items-center justify-center gap-2" type="submit">
|
||||
<span class="material-symbols-outlined text-lg" data-icon="rocket_launch">rocket_launch</span>
|
||||
Register Tenant
|
||||
</button>
|
||||
<button class="w-full bg-transparent text-slate-500 py-3 px-8 rounded-full font-bold hover:bg-slate-200/50 transition-colors" type="button">
|
||||
Cancel & Discard
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<!-- Visual Decorative Element -->
|
||||
<div class="mt-20 flex justify-center opacity-40">
|
||||
<div class="w-3/4 h-px bg-gradient-to-r from-transparent via-outline-variant to-transparent"></div>
|
||||
</div>
|
||||
<div class="mt-8 flex justify-between items-center text-[10px] font-bold text-slate-400 uppercase tracking-widest">
|
||||
<span>ZappCare Protocol v4.2.0</span>
|
||||
<div class="flex gap-4">
|
||||
<a class="hover:text-primary transition-colors" href="#">Documentation</a>
|
||||
<a class="hover:text-primary transition-colors" href="#">Security Audit</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<!-- Contextual FAB (Suppressing as per mandate for detailed/transactional screens, but following JSON CTA if needed elsewhere - currently suppressed for this specific flow) -->
|
||||
</body></html>
|
||||
Reference in New Issue
Block a user