54 lines
7.3 KiB
HTML
54 lines
7.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta name="description" content="Apply to join Teppelin Labs, a selective online Discord collective for digital builders."><title>Apply for Membership - Teppelin Labs</title>
|
|
<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=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet"><link rel="stylesheet" href="../styles.css">
|
|
</head>
|
|
<body data-page="join">
|
|
<a class="skip-link" href="#main">Skip to content</a><div class="scroll-progress" aria-hidden="true"><span></span></div><div class="cursor-dot" aria-hidden="true"></div><div class="cursor-ring" aria-hidden="true"></div>
|
|
<header class="site-header"><a class="brand" href="../index.html" aria-label="Teppelin Labs home"><img class="brand-logo" src="../assets/brand/teppelin-full-logomark.png" alt="Teppelin Labs"></a><button class="menu-toggle" type="button" aria-label="Toggle navigation" aria-expanded="false"><span></span></button><nav class="site-nav" aria-label="Primary navigation"><span class="nav-divider">Explore</span><a href="../index.html" data-nav="home">About</a><a href="solutions.html" data-nav="solutions">Build</a><a href="work.html" data-nav="work">Lab</a><span class="nav-divider">Members</span><a href="methodology.html" data-nav="methodology">Collective</a><a class="nav-cta" href="join.html" data-nav="join">Apply</a></nav></header>
|
|
|
|
<main id="main">
|
|
<section class="page-hero section-orange grid-surface"><div class="page-hero-head reveal"><p class="eyebrow">Member acquisition / Application</p><p class="page-hero-copy">Membership is for active digital builders who want to contribute to a focused peer community, not simply observe one.</p></div><h1 class="page-title reveal reveal-delay"><span><b class="page-index">05</b>Apply</span><span>to build</span><span class="text-white">together.</span></h1></section>
|
|
|
|
<section class="section grid-surface"><div class="application-layout">
|
|
<aside class="application-aside reveal"><p class="eyebrow">Before you apply</p><h2 class="section-title">Signal over scale.</h2><p class="body-copy" style="margin-top:30px;">Applications help us understand your craft, current momentum, and how you might strengthen the room. We care more about evidence of curiosity and follow-through than titles or follower counts.</p><ul class="application-points"><li>Applications are reviewed by humans</li><li>Membership is currently application-based</li><li>Accepted members receive the Discord invite</li><li>Thoughtful answers matter more than long answers</li></ul></aside>
|
|
|
|
<form class="application-form reveal reveal-delay" data-application-form>
|
|
<div class="field-grid">
|
|
<div class="field"><label for="app-name">Full name</label><input id="app-name" name="name" type="text" autocomplete="name" placeholder="Your name" required></div>
|
|
<div class="field"><label for="app-email">Email</label><input id="app-email" name="email" type="email" autocomplete="email" placeholder="you@example.com" required></div>
|
|
<div class="field"><label for="app-discord">Discord username</label><input id="app-discord" name="discord" type="text" placeholder="username" required></div>
|
|
<div class="field"><label for="app-location">Location / timezone</label><input id="app-location" name="location" type="text" placeholder="City or UTC offset" required></div>
|
|
<div class="field field-wide"><label for="app-portfolio">Work, GitHub, or portfolio link</label><input id="app-portfolio" name="portfolio" type="url" placeholder="https://" required></div>
|
|
</div>
|
|
|
|
<span class="meta">Primary craft</span>
|
|
<div class="choice-grid">
|
|
<div class="choice"><input id="craft-engineering" type="radio" name="craft" value="Engineering" required><label for="craft-engineering">Software engineering</label></div>
|
|
<div class="choice"><input id="craft-design" type="radio" name="craft" value="Design"><label for="craft-design">Product / visual design</label></div>
|
|
<div class="choice"><input id="craft-ai" type="radio" name="craft" value="AI"><label for="craft-ai">AI / applied research</label></div>
|
|
<div class="choice"><input id="craft-creative" type="radio" name="craft" value="Creative technology"><label for="craft-creative">Creative technology</label></div>
|
|
</div>
|
|
|
|
<div class="field-grid">
|
|
<div class="field field-wide"><label for="app-work">What are you building or learning right now?</label><textarea id="app-work" name="current_work" placeholder="Tell us about the problem, project, or technical territory holding your attention." required></textarea></div>
|
|
<div class="field field-wide"><label for="app-proof">What is one thing you have made that best represents how you think?</label><textarea id="app-proof" name="proof" placeholder="Link it if possible and explain the choices or learning behind it." required></textarea></div>
|
|
<div class="field field-wide"><label for="app-contribution">How would you contribute to the collective?</label><textarea id="app-contribution" name="contribution" placeholder="Knowledge, critique, project leadership, introductions, sessions, collaboration, or something else." required></textarea></div>
|
|
<div class="field"><label for="app-time">Weekly availability</label><select id="app-time" name="availability" required><option value="">Select one</option><option>1-2 hours</option><option>3-5 hours</option><option>6-10 hours</option><option>10+ hours</option></select></div>
|
|
<div class="field"><label for="app-source">How did you find Teppelin?</label><input id="app-source" name="source" type="text" placeholder="Person, post, event, search..."></div>
|
|
</div>
|
|
<button class="btn" type="submit">Submit membership application</button>
|
|
<p class="form-note">Submitting this prototype stores nothing yet. Connect the form to Formspree, Tally, Airtable, or your own endpoint before publishing publicly.</p>
|
|
<p class="form-status" aria-live="polite"></p>
|
|
</form>
|
|
</div></section>
|
|
|
|
<section class="section section-dark"><div class="intro-grid"><h2 class="section-title reveal">What happens<br><span class="text-orange">next.</span></h2><div class="intro-copy reveal reveal-delay"><p class="lede">A simple human review, followed by an invitation when the fit is clear.</p><p class="body-copy">We review the work and answers, look for evidence of active craft and collaborative intent, and may ask one short follow-up. Accepted applicants receive onboarding details and a private Discord invite.</p></div></div></section>
|
|
</main>
|
|
|
|
<footer class="site-footer"><div class="footer-bottom"><a class="footer-brand" href="../index.html"><img class="footer-logo" src="../assets/brand/teppelin-full-logomark.png" alt="Teppelin Labs"></a><div class="footer-links"><a href="solutions.html">What we build</a><a href="work.html">The lab</a><a href="methodology.html">The collective</a><a href="join.html">Apply</a><a href="contact.html">Collaborate</a></div><p class="footer-meta">© <span data-year></span> Teppelin Labs<br>Built online, worldwide</p></div></footer>
|
|
<script src="../script.js"></script>
|
|
</body>
|
|
</html>
|