83 lines
3.1 KiB
HTML
83 lines
3.1 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>mediator — new poll</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:wght@700;800&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
</head>
|
|
<body>
|
|
<div class="wrap">
|
|
<header class="site">
|
|
<a class="logo" href="/"><span class="dot"></span>mediator</a>
|
|
<span class="tagline">one calendar for the whole crew</span>
|
|
</header>
|
|
|
|
<div id="create-view">
|
|
<h1>Circle the dates that work</h1>
|
|
<p class="sub">Pick every day you'd offer for the get-together, add a time if you already know one, and send your friends a single link.</p>
|
|
|
|
<div class="card">
|
|
<label class="field">
|
|
<span>What's the plan?</span>
|
|
<input type="text" id="title" maxlength="120" placeholder="Pizza & board games at Lena's" autocomplete="off">
|
|
</label>
|
|
<label class="field">
|
|
<span>Details <span class="hint">(optional)</span></span>
|
|
<textarea id="description" maxlength="600" placeholder="Bring a game. We'll order around 7."></textarea>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<div id="calendar"></div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<strong style="font-size:14px;">Offered dates</strong>
|
|
<div id="picked-list" class="picked-list">
|
|
<p class="empty">Nothing circled yet — tap dates on the calendar above.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="actions">
|
|
<button class="btn btn-primary" id="create-btn">Create poll</button>
|
|
<span class="note">Heads-up: once created, a poll can only be closed or deleted, not edited.</span>
|
|
</div>
|
|
<p class="error" id="error" role="alert"></p>
|
|
</div>
|
|
|
|
<div id="done-view" hidden>
|
|
<h1>Your poll is live</h1>
|
|
<p class="sub">Send the share link to your friends. Keep the admin link to yourself — it's the only way to close or delete the poll.</p>
|
|
|
|
<div class="card">
|
|
<strong style="font-size:14px;">Share with friends</strong>
|
|
<div class="share-link">
|
|
<input type="text" id="share-url" readonly>
|
|
<button class="btn btn-ghost" data-copy="share-url">Copy</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card">
|
|
<strong style="font-size:14px;">Admin link (just for you)</strong>
|
|
<div class="share-link">
|
|
<input type="text" id="admin-url" readonly>
|
|
<button class="btn btn-ghost" data-copy="admin-url">Copy</button>
|
|
</div>
|
|
<p class="note">Anyone with this link can close or delete the poll — save it somewhere safe.</p>
|
|
</div>
|
|
|
|
<div class="actions">
|
|
<a class="btn btn-primary" id="open-poll" href="#">Open the poll</a>
|
|
<a class="btn btn-ghost" href="/">Make another</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="/static/calendar.js"></script>
|
|
<script src="/static/create.js"></script>
|
|
</body>
|
|
</html>
|