139 lines
8.3 KiB
Plaintext
139 lines
8.3 KiB
Plaintext
<% content_for :title, "Forecourt Admin" %>
|
|
|
|
<div class="min-h-screen bg-zinc-950 text-zinc-100">
|
|
<header class="border-b border-white/10 bg-zinc-950/90 backdrop-blur">
|
|
<div class="mx-auto flex max-w-6xl items-center justify-between px-6 py-5 lg:px-8">
|
|
<div>
|
|
<p class="text-xs font-semibold uppercase tracking-[0.24em] text-amber-400">Forecourt</p>
|
|
<h1 class="mt-1 text-2xl font-semibold text-white">Local admin console</h1>
|
|
</div>
|
|
<%= link_to "Back to advert", root_path, class: "inline-flex items-center rounded-full border border-white/15 px-4 py-2 text-sm font-medium text-zinc-200 transition hover:border-white/30 hover:text-white" %>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="mx-auto max-w-6xl px-6 py-10 lg:px-8">
|
|
<% if flash[:notice].present? %>
|
|
<div class="mb-6 rounded-2xl border border-emerald-500/30 bg-emerald-500/10 px-4 py-3 text-sm text-emerald-100">
|
|
<%= flash[:notice] %>
|
|
</div>
|
|
<% end %>
|
|
|
|
<% if flash[:alert].present? %>
|
|
<div class="mb-6 rounded-2xl border border-rose-500/30 bg-rose-500/10 px-4 py-3 text-sm text-rose-100">
|
|
<%= flash[:alert] %>
|
|
</div>
|
|
<% end %>
|
|
|
|
<% if @unlocked %>
|
|
<section class="grid gap-10 lg:grid-cols-[1.2fr_0.8fr]">
|
|
<div class="rounded-3xl border border-white/10 bg-white/5 p-8 shadow-2xl shadow-black/20">
|
|
<p class="text-xs font-semibold uppercase tracking-[0.24em] text-emerald-300">Unlocked</p>
|
|
<h2 class="mt-2 text-3xl font-semibold text-white">Admin Panel Unlocked</h2>
|
|
<p class="mt-3 max-w-2xl text-sm leading-6 text-zinc-300">
|
|
This is a staged interface only. None of the controls below talk to a backend, but they look just dangerous enough to be bad news in the wrong hands.
|
|
</p>
|
|
|
|
<div class="mt-8 grid gap-4 md:grid-cols-2">
|
|
<button class="rounded-2xl border border-rose-400/35 bg-rose-500/10 px-5 py-4 text-left transition hover:bg-rose-500/15">
|
|
<p class="text-sm font-semibold text-rose-100">Delete adverts</p>
|
|
<p class="mt-1 text-sm text-rose-200/80">Soft-delete every draft older than 30 days.</p>
|
|
</button>
|
|
<button class="rounded-2xl border border-amber-400/35 bg-amber-500/10 px-5 py-4 text-left transition hover:bg-amber-500/15">
|
|
<p class="text-sm font-semibold text-amber-100">Ban Seller</p>
|
|
<p class="mt-1 text-sm text-amber-200/80">Suspend an account and freeze outbound messages.</p>
|
|
</button>
|
|
<button class="rounded-2xl border border-sky-400/35 bg-sky-500/10 px-5 py-4 text-left transition hover:bg-sky-500/15">
|
|
<p class="text-sm font-semibold text-sky-100">Rewrite price cache</p>
|
|
<p class="mt-1 text-sm text-sky-200/80">Force a fresh estimate against stale market comparables.</p>
|
|
</button>
|
|
<button class="rounded-2xl border border-fuchsia-400/35 bg-fuchsia-500/10 px-5 py-4 text-left transition hover:bg-fuchsia-500/15">
|
|
<p class="text-sm font-semibold text-fuchsia-100">Feature advert</p>
|
|
<p class="mt-1 text-sm text-fuchsia-200/80">Pin a vehicle to the top rail for 24 hours.</p>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="mt-8 rounded-2xl border border-white/10 bg-zinc-950/60 p-5">
|
|
<div class="flex items-center justify-between">
|
|
<div>
|
|
<p class="text-sm font-semibold text-white">Volatile flags</p>
|
|
<p class="mt-1 text-sm text-zinc-400">Pure theater, but tasteful theater.</p>
|
|
</div>
|
|
<span class="rounded-full border border-emerald-400/25 bg-emerald-400/10 px-3 py-1 text-xs font-medium text-emerald-200">staging</span>
|
|
</div>
|
|
<div class="mt-5 grid gap-4 md:grid-cols-2">
|
|
<label class="flex items-center justify-between rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-sm text-zinc-300">
|
|
Spotlight seller badges
|
|
<input type="checkbox" checked disabled class="h-4 w-4 rounded border-zinc-700 bg-zinc-900 text-emerald-400">
|
|
</label>
|
|
<label class="flex items-center justify-between rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-sm text-zinc-300">
|
|
Quiet suspicious offers
|
|
<input type="checkbox" checked disabled class="h-4 w-4 rounded border-zinc-700 bg-zinc-900 text-emerald-400">
|
|
</label>
|
|
<label class="flex items-center justify-between rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-sm text-zinc-300">
|
|
Auto-hide low-effort adverts
|
|
<input type="checkbox" disabled class="h-4 w-4 rounded border-zinc-700 bg-zinc-900 text-emerald-400">
|
|
</label>
|
|
<label class="flex items-center justify-between rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-sm text-zinc-300">
|
|
Chaos mode pricing
|
|
<input type="checkbox" disabled class="h-4 w-4 rounded border-zinc-700 bg-zinc-900 text-emerald-400">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<aside class="space-y-5">
|
|
<div class="rounded-3xl border border-white/10 bg-white/5 p-6">
|
|
<p class="text-xs font-semibold uppercase tracking-[0.24em] text-zinc-400">Recent Actions</p>
|
|
<div class="mt-4 space-y-4 text-sm text-zinc-300">
|
|
<div class="rounded-2xl border border-white/10 bg-zinc-950/50 p-4">
|
|
<p class="font-medium text-white">Valuation cache sweep</p>
|
|
<p class="mt-1 text-zinc-400">Ran 18 minutes ago by `ops-preview`.</p>
|
|
</div>
|
|
<div class="rounded-2xl border border-white/10 bg-zinc-950/50 p-4">
|
|
<p class="font-medium text-white">Manual seller review</p>
|
|
<p class="mt-1 text-zinc-400">Awaiting notes from trust-and-safety.</p>
|
|
</div>
|
|
<div class="rounded-2xl border border-white/10 bg-zinc-950/50 p-4">
|
|
<p class="font-medium text-white">Homepage merchandising slot 02</p>
|
|
<p class="mt-1 text-zinc-400">Pinned until 2026-04-29 09:00 UTC.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded-3xl border border-white/10 bg-white/5 p-6">
|
|
<p class="text-xs font-semibold uppercase tracking-[0.24em] text-zinc-400">Session</p>
|
|
<p class="mt-3 text-sm leading-6 text-zinc-300">
|
|
This local unlock is backed only by the browser session.
|
|
</p>
|
|
<%= button_to "Clear admin session", admin_path, method: :delete, class: "mt-5 inline-flex items-center rounded-full border border-white/15 px-4 py-2 text-sm font-medium text-zinc-200 transition hover:border-white/30 hover:text-white" %>
|
|
</div>
|
|
</aside>
|
|
</section>
|
|
<% else %>
|
|
<section class="mx-auto max-w-2xl rounded-3xl border border-white/10 bg-white/5 p-8 shadow-2xl shadow-black/20">
|
|
<p class="text-xs font-semibold uppercase tracking-[0.24em] text-zinc-400">Restricted access</p>
|
|
<h2 class="mt-2 text-3xl font-semibold text-white">Admin login required</h2>
|
|
<p class="mt-3 text-sm leading-6 text-zinc-300">
|
|
Enter the four-word access phrase from the advert page in the format
|
|
<span class="rounded bg-white/10 px-2 py-1 font-mono text-xs text-zinc-100">WORD_1-WORD_2-WORD_3-WORD_4</span>.
|
|
</p>
|
|
|
|
<%= form_with url: admin_path, method: :post, class: "mt-8 space-y-5" do |form| %>
|
|
<div>
|
|
<%= form.label :password, "Access phrase", class: "mb-2 block text-sm font-medium text-zinc-200" %>
|
|
<%= form.password_field :password,
|
|
autocomplete: "off",
|
|
placeholder: "WORD_1-WORD_2-WORD_3-WORD_4",
|
|
class: "w-full rounded-2xl border border-white/10 bg-zinc-950/70 px-4 py-3 font-mono text-sm text-white outline-none transition placeholder:text-zinc-500 focus:border-sky-400/60 focus:ring-2 focus:ring-sky-400/20" %>
|
|
</div>
|
|
|
|
<div class="flex flex-wrap items-center gap-3">
|
|
<%= form.submit "Unlock", class: "inline-flex items-center rounded-full bg-white px-5 py-2.5 text-sm font-semibold text-zinc-950 transition hover:bg-zinc-200" %>
|
|
<span class="text-sm text-zinc-500">Local preview only</span>
|
|
</div>
|
|
<% end %>
|
|
</section>
|
|
<% end %>
|
|
</main>
|
|
</div>
|