apt/mesh-life-signup-site
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Upload files to "public"

Browse Source
This commit is contained in:
Ade Thompson
2025-11-02 16:05:41 +00:00
parent 870f964887
commit bdf23bb691
2 changed files with 71 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/Mesh-Life_500x500.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 324 KiB

71
public/index.html Normal file
View File

@@ -0,0 +1,71 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<title>Signup</title>
<style>
:root { --bg:#0b0b10; --panel:#151823; --text:#e8e8ea; --muted:#a7adbb; --brand:#7c5cff; }
* { box-sizing:border-box; }
body {
margin:0; font:16px/1.45 system-ui, -apple-system, Segoe UI, Inter, Roboto, sans-serif;
color:var(--text);
background: radial-gradient(900px 600px at 20% -10%, #1e2240 0%, #0b0b10 55%) fixed;
min-height:100dvh; display:grid; place-items:center; padding:24px;
font-family: "Zilla Slab", serif;
}
.card { width:100%; max-width:560px; background:var(--panel);
border:1px solid rgba(255,255,255,.06); border-radius:16px; box-shadow:0 10px 30px rgba(0,0,0,.35); overflow:hidden; }
.media { aspect-ratio:16/9; background:#222735; display:grid; place-items:center; border-bottom:1px solid rgba(255,255,255,.05); }
.media svg { width:35%; max-width:180px; opacity:.85; }
.content { padding:20px clamp(18px,3.5vw,28px) 24px; }
h1 { margin:0 0 6px; font-size:clamp(20px,2.3vw,28px); }
p.lead { color:var(--muted); margin:0 0 14px; }
form { display:grid; gap:12px; margin-top:10px; }
.row { display:flex; gap:10px; }
input[type="email"]{
flex:1; background:#0f1220; color:var(--text); border:1px solid rgba(255,255,255,.12);
border-radius:12px; padding:14px; outline:none;
}
input[type="email"]:focus{ border-color:var(--brand); box-shadow:0 0 0 3px rgba(124,92,255,.15) }
button{ background:var(--brand); color:#fff; border:0; padding:14px 18px; border-radius:12px; font-weight:600; cursor:pointer }
.hint{ color:var(--muted); font-size:13px }
.msg{ margin-top:6px; font-size:14px }
.msg.success{ color:#6de39b } .msg.error{ color:#ff6b81 }
</style>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Zilla+Slab:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet">
<script defer src="https://umami.mycod.in/script.js" data-website-id="951c3ca0-5510-46a2-a2f1-e69d55796403"></script>
</head>
<body>
<main class="card" aria-labelledby="title">
<div class="media" aria-hidden="true">
<img src="Mesh-Life_500x500.png" width="72%" style="padding:20px;">
</div>
<div class="content">
<h1 id="title">Be first to know</h1>
<p class="lead">Drop your email below. We’ll ping you when we launch.</p>
<form id="signup" novalidate>
<div class="row">
<input id="email" name="email" type="email" inputmode="email" placeholder="your@email.com" required autocomplete="email">
<button id="submitBtn" type="submit">Notify me</button>
</div>
<div id="msg" class="msg" role="status" aria-live="polite"></div>
</form>
</div>
</main>
<script>
const form=document.getElementById('signup');const email=document.getElementById('email');const msg=document.getElementById('msg');
const valid=v=>/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(v);
form.addEventListener('submit',async e=>{e.preventDefault();msg.textContent='';const val=email.value.trim();
if(!valid(val)){msg.textContent='Invalid email';msg.className='msg error';return;}
try{const r=await fetch('/api/subscribe',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({email:val})});
if(!r.ok)throw new Error();
msg.textContent='Thanks! You’re on the list.';msg.className='msg success';form.reset();}
catch{msg.textContent='Error saving email';msg.className='msg error';}});
</script>
</body>
</html>