@@ -0,0 +1 @@
|
||||
{"reason":"idle timeout","timestamp":1774884294221}
|
||||
@@ -0,0 +1,10 @@
|
||||
{"type":"server-started","port":63304,"host":"127.0.0.1","url_host":"localhost","url":"http://localhost:63304","screen_dir":"/Users/sean/Dev/battl/gunbuilder-prototype/.superpowers/brainstorm/20960-1774881654"}
|
||||
{"type":"screen-added","file":"/Users/sean/Dev/battl/gunbuilder-prototype/.superpowers/brainstorm/20960-1774881654/waiting.html"}
|
||||
{"type":"screen-added","file":"/Users/sean/Dev/battl/gunbuilder-prototype/.superpowers/brainstorm/20960-1774881654/waiting-2.html"}
|
||||
{"type":"screen-added","file":"/Users/sean/Dev/battl/gunbuilder-prototype/.superpowers/brainstorm/20960-1774881654/changelog-layout.html"}
|
||||
{"type":"screen-added","file":"/Users/sean/Dev/battl/gunbuilder-prototype/.superpowers/brainstorm/20960-1774881654/roadmap-tab.html"}
|
||||
{"type":"screen-added","file":"/Users/sean/Dev/battl/gunbuilder-prototype/.superpowers/brainstorm/20960-1774881654/roadmap-votes.html"}
|
||||
{"type":"screen-added","file":"/Users/sean/Dev/battl/gunbuilder-prototype/.superpowers/brainstorm/20960-1774881654/feedback-form.html"}
|
||||
{"type":"screen-added","file":"/Users/sean/Dev/battl/gunbuilder-prototype/.superpowers/brainstorm/20960-1774881654/feedback-form-v2.html"}
|
||||
{"type":"screen-added","file":"/Users/sean/Dev/battl/gunbuilder-prototype/.superpowers/brainstorm/20960-1774881654/waiting-3.html"}
|
||||
{"type":"server-stopped","reason":"idle timeout"}
|
||||
@@ -0,0 +1 @@
|
||||
20969
|
||||
@@ -0,0 +1,113 @@
|
||||
<style>
|
||||
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { background: #09090b; color: #f4f4f5; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; padding: 32px 24px; }
|
||||
.wrap { max-width: 900px; margin: 0 auto; }
|
||||
|
||||
h2 { font-size: 13px; font-weight: 600; color: #a1a1aa; margin-bottom: 20px; letter-spacing: 0.05em; text-transform: uppercase; }
|
||||
|
||||
/* ── Tabs ── */
|
||||
.tabs { display: flex; gap: 0; border-bottom: 1px solid #27272a; margin-bottom: 40px; }
|
||||
.tab { padding: 10px 20px; font-size: 13px; font-weight: 500; color: #71717a; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; }
|
||||
.tab.active { color: #fbbf24; border-bottom-color: #fbbf24; }
|
||||
|
||||
/* ── Changelog entries ── */
|
||||
.entries { display: flex; flex-direction: column; gap: 0; }
|
||||
.entry { display: grid; grid-template-columns: 120px 1fr; gap: 0 32px; border-bottom: 1px solid #18181b; padding: 32px 0; }
|
||||
.entry:last-child { border-bottom: none; }
|
||||
.entry-meta { padding-top: 4px; }
|
||||
.entry-version { font-size: 12px; font-weight: 700; color: #fbbf24; font-family: monospace; margin-bottom: 4px; }
|
||||
.entry-date { font-size: 11px; color: #3f3f46; }
|
||||
.entry-title { font-size: 17px; font-weight: 600; color: #fff; margin-bottom: 8px; }
|
||||
.entry-body { font-size: 13px; color: #71717a; line-height: 1.7; }
|
||||
.entry-tags { display: flex; gap: 6px; margin-bottom: 10px; flex-wrap: wrap; }
|
||||
.tag { font-size: 10px; font-weight: 600; padding: 2px 8px; border-radius: 99px; letter-spacing: 0.05em; text-transform: uppercase; }
|
||||
.tag-feature { background: rgba(251,191,36,0.1); color: #fbbf24; border: 1px solid rgba(251,191,36,0.25); }
|
||||
.tag-fix { background: rgba(74,222,128,0.1); color: #4ade80; border: 1px solid rgba(74,222,128,0.2); }
|
||||
.tag-improvement { background: rgba(147,197,253,0.1); color: #93c5fd; border: 1px solid rgba(147,197,253,0.2); }
|
||||
|
||||
/* ── Roadmap items ── */
|
||||
.roadmap { display: flex; flex-direction: column; gap: 12px; }
|
||||
.roadmap-item { display: flex; align-items: flex-start; gap: 16px; padding: 20px; border: 1px solid #1c1c1f; border-radius: 10px; background: #0d0d0f; }
|
||||
.status-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; margin-top: 6px; }
|
||||
.status-planned { background: #3f3f46; }
|
||||
.status-inprogress { background: #fbbf24; box-shadow: 0 0 8px rgba(251,191,36,0.4); }
|
||||
.status-shipped { background: #4ade80; }
|
||||
.roadmap-item-title { font-size: 14px; font-weight: 600; color: #e4e4e7; margin-bottom: 4px; }
|
||||
.roadmap-item-desc { font-size: 12px; color: #52525b; line-height: 1.6; }
|
||||
.status-badge { font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 99px; letter-spacing: 0.06em; text-transform: uppercase; margin-left: auto; flex-shrink: 0; }
|
||||
.badge-planned { background: rgba(63,63,70,0.4); color: #71717a; border: 1px solid #27272a; }
|
||||
.badge-inprogress { background: rgba(251,191,36,0.1); color: #fbbf24; border: 1px solid rgba(251,191,36,0.3); }
|
||||
.badge-shipped { background: rgba(74,222,128,0.1); color: #4ade80; border: 1px solid rgba(74,222,128,0.2); }
|
||||
|
||||
.page-header { margin-bottom: 40px; }
|
||||
.page-label { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #52525b; margin-bottom: 8px; }
|
||||
.page-title { font-size: 28px; font-weight: 700; color: #fff; letter-spacing: -0.02em; margin-bottom: 6px; }
|
||||
.page-sub { font-size: 14px; color: #52525b; }
|
||||
|
||||
/* ── Section separators for roadmap ── */
|
||||
.roadmap-group-label { font-size: 10px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: #3f3f46; margin: 24px 0 10px; }
|
||||
.roadmap-group-label:first-child { margin-top: 0; }
|
||||
</style>
|
||||
|
||||
<div class="wrap">
|
||||
<div class="page-header">
|
||||
<p class="page-label">Battl Builders</p>
|
||||
<h1 class="page-title">Updates</h1>
|
||||
<p class="page-sub">What we've shipped and what's coming next.</p>
|
||||
</div>
|
||||
|
||||
<div class="tabs">
|
||||
<div class="tab active">What's New</div>
|
||||
<div class="tab">What's Next</div>
|
||||
<div class="tab">Give Feedback</div>
|
||||
</div>
|
||||
|
||||
<!-- WHAT'S NEW -->
|
||||
<div id="whats-new">
|
||||
<div class="entries">
|
||||
<div class="entry">
|
||||
<div class="entry-meta">
|
||||
<div class="entry-version">v0.4</div>
|
||||
<div class="entry-date">Mar 28, 2026</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="entry-tags">
|
||||
<span class="tag tag-feature">Feature</span>
|
||||
<span class="tag tag-improvement">Improvement</span>
|
||||
</div>
|
||||
<div class="entry-title">Homepage redesign + open access</div>
|
||||
<div class="entry-body">Removed the beta gate. New landing page explains what Battl does without the jargon. Compatibility conflict warnings now surface inline while you build.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="entry">
|
||||
<div class="entry-meta">
|
||||
<div class="entry-version">v0.3</div>
|
||||
<div class="entry-date">Mar 14, 2026</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="entry-tags">
|
||||
<span class="tag tag-feature">Feature</span>
|
||||
<span class="tag tag-fix">Fix</span>
|
||||
</div>
|
||||
<div class="entry-title">Shareable build links + vault</div>
|
||||
<div class="entry-body">Save and share builds with a single link. Anyone can view the parts list without an account. Fixed gas system validation that was incorrectly flagging mid-length configs.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="entry">
|
||||
<div class="entry-meta">
|
||||
<div class="entry-version">v0.2</div>
|
||||
<div class="entry-date">Feb 28, 2026</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="entry-tags">
|
||||
<span class="tag tag-feature">Feature</span>
|
||||
</div>
|
||||
<div class="entry-title">Live pricing from real retailers</div>
|
||||
<div class="entry-body">AvantLink feed integration. Running total updates as you add parts. Prices are pulled daily — no estimated MSRP, no sponsored rankings.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,88 @@
|
||||
<style>
|
||||
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { background: #09090b; color: #f4f4f5; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; padding: 32px 24px; }
|
||||
.wrap { max-width: 900px; margin: 0 auto; }
|
||||
|
||||
.tabs { display: flex; gap: 0; border-bottom: 1px solid #27272a; margin-bottom: 40px; }
|
||||
.tab { padding: 10px 20px; font-size: 13px; font-weight: 500; color: #71717a; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; }
|
||||
.tab.active { color: #fbbf24; border-bottom-color: #fbbf24; }
|
||||
|
||||
.page-header { margin-bottom: 40px; }
|
||||
.page-label { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #52525b; margin-bottom: 8px; }
|
||||
.page-title { font-size: 28px; font-weight: 700; color: #fff; letter-spacing: -0.02em; margin-bottom: 6px; }
|
||||
.page-sub { font-size: 14px; color: #52525b; }
|
||||
|
||||
.feedback-header { margin-bottom: 28px; }
|
||||
.feedback-header h2 { font-size: 20px; font-weight: 700; color: #fff; letter-spacing: -0.015em; margin-bottom: 6px; }
|
||||
.feedback-header p { font-size: 13px; color: #52525b; line-height: 1.6; }
|
||||
|
||||
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
|
||||
.form-field { margin-bottom: 20px; }
|
||||
.form-label { font-size: 11px; font-weight: 600; color: #71717a; letter-spacing: 0.05em; text-transform: uppercase; margin-bottom: 8px; display: block; }
|
||||
.form-input, .form-select, .form-textarea {
|
||||
width: 100%; padding: 10px 14px; font-size: 13px; font-family: inherit;
|
||||
background: #0d0d0f; border: 1px solid #27272a; border-radius: 8px;
|
||||
color: #e4e4e7; outline: none;
|
||||
}
|
||||
.form-input:focus, .form-select:focus, .form-textarea:focus { border-color: rgba(251,191,36,0.4); }
|
||||
.form-textarea { resize: vertical; min-height: 160px; line-height: 1.6; }
|
||||
.form-select { appearance: none; cursor: pointer; }
|
||||
.form-hint { font-size: 11px; color: #3f3f46; margin-top: 6px; }
|
||||
.char-count { font-size: 11px; color: #3f3f46; text-align: right; margin-top: 6px; }
|
||||
|
||||
.form-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 4px; }
|
||||
.form-footer-note { font-size: 11px; color: #3f3f46; }
|
||||
|
||||
.btn-submit {
|
||||
display: inline-flex; align-items: center; gap: 8px;
|
||||
background: rgba(251,191,36,0.9); color: #000; font-size: 13px; font-weight: 700;
|
||||
padding: 10px 28px; border-radius: 8px; border: none; cursor: pointer;
|
||||
letter-spacing: 0.02em; font-family: inherit;
|
||||
}
|
||||
.btn-submit:hover { background: #fbbf24; }
|
||||
</style>
|
||||
|
||||
<div class="wrap">
|
||||
<div class="page-header">
|
||||
<p class="page-label">Battl Builders</p>
|
||||
<h1 class="page-title">Updates</h1>
|
||||
<p class="page-sub">What we've shipped and what's coming next.</p>
|
||||
</div>
|
||||
|
||||
<div class="tabs">
|
||||
<div class="tab">What's New</div>
|
||||
<div class="tab">What's Next</div>
|
||||
<div class="tab active">Give Feedback</div>
|
||||
</div>
|
||||
|
||||
<div class="feedback-header">
|
||||
<h2>Tell us what you think.</h2>
|
||||
<p>Bug, feature idea, or general thought — we read everything. Rough language welcome.</p>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<div class="form-field">
|
||||
<label class="form-label">Category</label>
|
||||
<select class="form-select">
|
||||
<option>Bug report</option>
|
||||
<option>Feature request</option>
|
||||
<option>General feedback</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-field">
|
||||
<label class="form-label">Email <span style="color:#3f3f46; font-weight:400; text-transform:none; letter-spacing:0;">(optional — if you want a reply)</span></label>
|
||||
<input class="form-input" type="email" placeholder="you@email.com" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-field">
|
||||
<label class="form-label">Message</label>
|
||||
<textarea class="form-textarea" placeholder="What's on your mind?"></textarea>
|
||||
<div class="char-count">0 / 1000</div>
|
||||
</div>
|
||||
|
||||
<div class="form-footer">
|
||||
<span class="form-footer-note">We'll only use your email to follow up on your feedback.</span>
|
||||
<button class="btn-submit">Send Feedback →</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,160 @@
|
||||
<style>
|
||||
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { background: #09090b; color: #f4f4f5; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; padding: 32px 24px; }
|
||||
.wrap { max-width: 900px; margin: 0 auto; }
|
||||
|
||||
.tabs { display: flex; gap: 0; border-bottom: 1px solid #27272a; margin-bottom: 40px; }
|
||||
.tab { padding: 10px 20px; font-size: 13px; font-weight: 500; color: #71717a; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; }
|
||||
.tab.active { color: #fbbf24; border-bottom-color: #fbbf24; }
|
||||
|
||||
.page-header { margin-bottom: 40px; }
|
||||
.page-label { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #52525b; margin-bottom: 8px; }
|
||||
.page-title { font-size: 28px; font-weight: 700; color: #fff; letter-spacing: -0.02em; margin-bottom: 6px; }
|
||||
.page-sub { font-size: 14px; color: #52525b; }
|
||||
|
||||
/* ── Shared form styles ── */
|
||||
.form-label { font-size: 11px; font-weight: 600; color: #71717a; letter-spacing: 0.05em; text-transform: uppercase; margin-bottom: 8px; display: block; }
|
||||
.form-field { margin-bottom: 20px; }
|
||||
.form-input, .form-select, .form-textarea {
|
||||
width: 100%; padding: 10px 14px; font-size: 13px; font-family: inherit;
|
||||
background: #0d0d0f; border: 1px solid #27272a; border-radius: 8px;
|
||||
color: #e4e4e7; outline: none;
|
||||
}
|
||||
.form-input:focus, .form-select:focus, .form-textarea:focus { border-color: rgba(251,191,36,0.4); }
|
||||
.form-textarea { resize: vertical; min-height: 120px; line-height: 1.6; }
|
||||
.form-select { appearance: none; cursor: pointer; }
|
||||
.form-hint { font-size: 11px; color: #3f3f46; margin-top: 6px; }
|
||||
.btn-submit {
|
||||
display: inline-flex; align-items: center; gap-8px; gap: 8px;
|
||||
background: rgba(251,191,36,0.9); color: #000; font-size: 13px; font-weight: 700;
|
||||
padding: 10px 24px; border-radius: 8px; border: none; cursor: pointer;
|
||||
letter-spacing: 0.02em; font-family: inherit;
|
||||
}
|
||||
.btn-submit:hover { background: #fbbf24; }
|
||||
|
||||
/* ── Split view ── */
|
||||
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; }
|
||||
|
||||
/* ── Page form (tab) ── */
|
||||
.feedback-page { max-width: 560px; }
|
||||
.feedback-page-header { margin-bottom: 28px; }
|
||||
.feedback-page-header h2 { font-size: 20px; font-weight: 700; color: #fff; letter-spacing: -0.015em; margin-bottom: 6px; }
|
||||
.feedback-page-header p { font-size: 13px; color: #52525b; line-height: 1.6; }
|
||||
|
||||
/* ── Modal ── */
|
||||
.modal-wrap { position: relative; }
|
||||
.modal-label { font-size: 10px; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: #52525b; margin-bottom: 12px; text-align: center; }
|
||||
.modal {
|
||||
background: #111113; border: 1px solid #27272a; border-radius: 14px;
|
||||
padding: 28px; width: 100%;
|
||||
box-shadow: 0 24px 80px rgba(0,0,0,0.6);
|
||||
}
|
||||
.modal-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
|
||||
.modal-title { font-size: 16px; font-weight: 700; color: #fff; letter-spacing: -0.01em; }
|
||||
.modal-close { font-size: 18px; color: #3f3f46; cursor: pointer; background: none; border: none; font-family: inherit; padding: 0; line-height: 1; }
|
||||
.modal-close:hover { color: #71717a; }
|
||||
|
||||
/* Nav trigger button (shown for context) */
|
||||
.nav-context { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid #18181b; }
|
||||
.nav-context-label { font-size: 10px; color: #3f3f46; letter-spacing: 0.05em; }
|
||||
.btn-feedback-nav {
|
||||
padding: 6px 12px; border-radius: 6px; font-size: 11px; font-weight: 600;
|
||||
border: 1px solid #27272a; color: #71717a; background: transparent;
|
||||
cursor: pointer; font-family: inherit; letter-spacing: 0.02em;
|
||||
}
|
||||
|
||||
.divider { width: 1px; background: #18181b; align-self: stretch; }
|
||||
|
||||
.char-count { font-size: 11px; color: #3f3f46; text-align: right; margin-top: 6px; }
|
||||
</style>
|
||||
|
||||
<div class="wrap">
|
||||
<div class="page-header">
|
||||
<p class="page-label">Battl Builders</p>
|
||||
<h1 class="page-title">Updates</h1>
|
||||
<p class="page-sub">What we've shipped and what's coming next.</p>
|
||||
</div>
|
||||
|
||||
<div class="tabs">
|
||||
<div class="tab">What's New</div>
|
||||
<div class="tab">What's Next</div>
|
||||
<div class="tab active">Give Feedback</div>
|
||||
</div>
|
||||
|
||||
<div class="split">
|
||||
|
||||
<!-- LEFT: Tab / page form -->
|
||||
<div>
|
||||
<p class="modal-label" style="text-align:left; margin-bottom: 20px;">Give Feedback tab (full page)</p>
|
||||
<div class="feedback-page">
|
||||
<div class="feedback-page-header">
|
||||
<h2>Tell us what you think.</h2>
|
||||
<p>Bug, feature idea, or general thought — we read everything. Rough language welcome.</p>
|
||||
</div>
|
||||
|
||||
<div class="form-field">
|
||||
<label class="form-label">Category</label>
|
||||
<select class="form-select">
|
||||
<option>Bug report</option>
|
||||
<option>Feature request</option>
|
||||
<option>General feedback</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-field">
|
||||
<label class="form-label">Message</label>
|
||||
<textarea class="form-textarea" placeholder="What's on your mind?"></textarea>
|
||||
<div class="char-count">0 / 1000</div>
|
||||
</div>
|
||||
|
||||
<div class="form-field">
|
||||
<label class="form-label">Email <span style="color:#3f3f46; font-weight:400; text-transform:none; letter-spacing:0;">(optional — if you want a reply)</span></label>
|
||||
<input class="form-input" type="email" placeholder="you@email.com" />
|
||||
<p class="form-hint">We'll only use this to follow up on your feedback.</p>
|
||||
</div>
|
||||
|
||||
<button class="btn-submit">Send Feedback →</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="divider"></div>
|
||||
|
||||
<!-- RIGHT: Modal (triggered from nav/footer) -->
|
||||
<div>
|
||||
<div class="nav-context">
|
||||
<span class="nav-context-label">Triggered from nav/footer →</span>
|
||||
<button class="btn-feedback-nav">Send Feedback</button>
|
||||
</div>
|
||||
<p class="modal-label">Modal</p>
|
||||
<div class="modal">
|
||||
<div class="modal-header">
|
||||
<span class="modal-title">Send Feedback</span>
|
||||
<button class="modal-close">✕</button>
|
||||
</div>
|
||||
|
||||
<div class="form-field">
|
||||
<label class="form-label">Category</label>
|
||||
<select class="form-select">
|
||||
<option>Bug report</option>
|
||||
<option>Feature request</option>
|
||||
<option>General feedback</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-field">
|
||||
<label class="form-label">Message</label>
|
||||
<textarea class="form-textarea" style="min-height:100px;" placeholder="What's on your mind?"></textarea>
|
||||
<div class="char-count">0 / 1000</div>
|
||||
</div>
|
||||
|
||||
<div class="form-field">
|
||||
<label class="form-label">Email <span style="color:#3f3f46; font-weight:400; text-transform:none; letter-spacing:0;">(optional)</span></label>
|
||||
<input class="form-input" type="email" placeholder="you@email.com" />
|
||||
</div>
|
||||
|
||||
<button class="btn-submit" style="width:100%; justify-content:center;">Send Feedback →</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,104 @@
|
||||
<style>
|
||||
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { background: #09090b; color: #f4f4f5; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; padding: 32px 24px; }
|
||||
.wrap { max-width: 900px; margin: 0 auto; }
|
||||
|
||||
.tabs { display: flex; gap: 0; border-bottom: 1px solid #27272a; margin-bottom: 40px; }
|
||||
.tab { padding: 10px 20px; font-size: 13px; font-weight: 500; color: #71717a; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; }
|
||||
.tab.active { color: #fbbf24; border-bottom-color: #fbbf24; }
|
||||
|
||||
.page-header { margin-bottom: 40px; }
|
||||
.page-label { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #52525b; margin-bottom: 8px; }
|
||||
.page-title { font-size: 28px; font-weight: 700; color: #fff; letter-spacing: -0.02em; margin-bottom: 6px; }
|
||||
.page-sub { font-size: 14px; color: #52525b; }
|
||||
|
||||
.roadmap { display: flex; flex-direction: column; gap: 10px; }
|
||||
.roadmap-item { display: flex; align-items: flex-start; gap: 16px; padding: 20px; border: 1px solid #1c1c1f; border-radius: 10px; background: #0d0d0f; }
|
||||
.dot-col { display: flex; flex-direction: column; align-items: center; gap: 0; padding-top: 5px; flex-shrink: 0; }
|
||||
.status-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
|
||||
.status-planned .status-dot { background: #3f3f46; }
|
||||
.status-inprogress .status-dot { background: #fbbf24; box-shadow: 0 0 10px rgba(251,191,36,0.5); }
|
||||
.status-shipped .status-dot { background: #4ade80; }
|
||||
.roadmap-body { flex: 1; }
|
||||
.roadmap-item-title { font-size: 14px; font-weight: 600; color: #e4e4e7; margin-bottom: 4px; }
|
||||
.roadmap-item-desc { font-size: 12px; color: #52525b; line-height: 1.65; }
|
||||
.status-badge { font-size: 10px; font-weight: 700; padding: 2px 9px; border-radius: 99px; letter-spacing: 0.06em; text-transform: uppercase; flex-shrink: 0; margin-top: 2px; }
|
||||
.status-planned .status-badge { background: rgba(63,63,70,0.4); color: #52525b; border: 1px solid #27272a; }
|
||||
.status-inprogress .status-badge { background: rgba(251,191,36,0.08); color: #fbbf24; border: 1px solid rgba(251,191,36,0.25); }
|
||||
.status-shipped .status-badge { background: rgba(74,222,128,0.08); color: #4ade80; border: 1px solid rgba(74,222,128,0.2); }
|
||||
|
||||
.group-label { font-size: 10px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #3f3f46; margin: 28px 0 10px; }
|
||||
.group-label:first-child { margin-top: 0; }
|
||||
|
||||
.roadmap-note { margin-top: 32px; padding: 16px 20px; border: 1px solid #18181b; border-radius: 8px; font-size: 12px; color: #3f3f46; line-height: 1.6; }
|
||||
.roadmap-note a { color: #52525b; text-decoration: underline; text-underline-offset: 3px; }
|
||||
</style>
|
||||
|
||||
<div class="wrap">
|
||||
<div class="page-header">
|
||||
<p class="page-label">Battl Builders</p>
|
||||
<h1 class="page-title">Updates</h1>
|
||||
<p class="page-sub">What we've shipped and what's coming next.</p>
|
||||
</div>
|
||||
|
||||
<div class="tabs">
|
||||
<div class="tab">What's New</div>
|
||||
<div class="tab active">What's Next</div>
|
||||
<div class="tab">Give Feedback</div>
|
||||
</div>
|
||||
|
||||
<div class="roadmap">
|
||||
<div class="group-label">In Progress</div>
|
||||
|
||||
<div class="roadmap-item status-inprogress">
|
||||
<div class="dot-col"><span class="status-dot"></span></div>
|
||||
<div class="roadmap-body">
|
||||
<div class="roadmap-item-title">Compatibility engine — gas system + buffer</div>
|
||||
<div class="roadmap-item-desc">Automatic warnings when barrel length and gas system length don't match, and when buffer weight conflicts with your stock/brace selection.</div>
|
||||
</div>
|
||||
<span class="status-badge">In Progress</span>
|
||||
</div>
|
||||
|
||||
<div class="roadmap-item status-inprogress">
|
||||
<div class="dot-col"><span class="status-dot"></span></div>
|
||||
<div class="roadmap-body">
|
||||
<div class="roadmap-item-title">Mobile builder experience</div>
|
||||
<div class="roadmap-item-desc">Full 375px breakpoint pass on the builder, parts browser, and build summary. Lighthouse score target ≥70.</div>
|
||||
</div>
|
||||
<span class="status-badge">In Progress</span>
|
||||
</div>
|
||||
|
||||
<div class="group-label">Planned</div>
|
||||
|
||||
<div class="roadmap-item status-planned">
|
||||
<div class="dot-col"><span class="status-dot"></span></div>
|
||||
<div class="roadmap-body">
|
||||
<div class="roadmap-item-title">Expanded parts catalog</div>
|
||||
<div class="roadmap-item-desc">50–75 SKUs across all 10 slots, 3–5 options per category, with live AvantLink pricing.</div>
|
||||
</div>
|
||||
<span class="status-badge">Planned</span>
|
||||
</div>
|
||||
|
||||
<div class="roadmap-item status-planned">
|
||||
<div class="dot-col"><span class="status-dot"></span></div>
|
||||
<div class="roadmap-body">
|
||||
<div class="roadmap-item-title">Build guides — first wave</div>
|
||||
<div class="roadmap-item-desc">Three long-form guides targeting "AR-15 build planner" and related keywords. Written for the ICP: experienced shooter, not an expert builder.</div>
|
||||
</div>
|
||||
<span class="status-badge">Planned</span>
|
||||
</div>
|
||||
|
||||
<div class="roadmap-item status-planned">
|
||||
<div class="dot-col"><span class="status-dot"></span></div>
|
||||
<div class="roadmap-body">
|
||||
<div class="roadmap-item-title">Caliber cross-compatibility checks</div>
|
||||
<div class="roadmap-item-desc">Flag mismatches between upper and lower when mixing calibers (e.g., .300 Blackout upper on a 5.56 lower).</div>
|
||||
</div>
|
||||
<span class="status-badge">Planned</span>
|
||||
</div>
|
||||
|
||||
<div class="roadmap-note">
|
||||
Have something you want to see? <a href="#">Give us feedback →</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,150 @@
|
||||
<style>
|
||||
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { background: #09090b; color: #f4f4f5; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; padding: 32px 24px; }
|
||||
.wrap { max-width: 900px; margin: 0 auto; }
|
||||
|
||||
.tabs { display: flex; gap: 0; border-bottom: 1px solid #27272a; margin-bottom: 40px; }
|
||||
.tab { padding: 10px 20px; font-size: 13px; font-weight: 500; color: #71717a; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; }
|
||||
.tab.active { color: #fbbf24; border-bottom-color: #fbbf24; }
|
||||
|
||||
.page-header { margin-bottom: 40px; }
|
||||
.page-label { font-size: 10px; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: #52525b; margin-bottom: 8px; }
|
||||
.page-title { font-size: 28px; font-weight: 700; color: #fff; letter-spacing: -0.02em; margin-bottom: 6px; }
|
||||
.page-sub { font-size: 14px; color: #52525b; }
|
||||
|
||||
.roadmap { display: flex; flex-direction: column; gap: 10px; }
|
||||
|
||||
.roadmap-item {
|
||||
display: grid;
|
||||
grid-template-columns: 52px 1fr auto;
|
||||
gap: 0 16px;
|
||||
align-items: center;
|
||||
padding: 20px;
|
||||
border: 1px solid #1c1c1f;
|
||||
border-radius: 10px;
|
||||
background: #0d0d0f;
|
||||
}
|
||||
|
||||
/* Upvote button */
|
||||
.upvote {
|
||||
display: flex; flex-direction: column; align-items: center; justify-content: center;
|
||||
gap: 3px; width: 44px; height: 52px;
|
||||
border: 1px solid #27272a; border-radius: 8px; background: transparent;
|
||||
cursor: pointer; color: #52525b; transition: all 0.15s;
|
||||
font-size: 11px; font-weight: 700; font-family: inherit;
|
||||
}
|
||||
.upvote:hover { border-color: #fbbf24; color: #fbbf24; background: rgba(251,191,36,0.06); }
|
||||
.upvote.voted { border-color: rgba(251,191,36,0.4); color: #fbbf24; background: rgba(251,191,36,0.08); }
|
||||
.upvote svg { width: 14px; height: 14px; }
|
||||
|
||||
.roadmap-body { }
|
||||
.roadmap-item-title { font-size: 14px; font-weight: 600; color: #e4e4e7; margin-bottom: 4px; }
|
||||
.roadmap-item-desc { font-size: 12px; color: #52525b; line-height: 1.65; }
|
||||
|
||||
.right-col { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
|
||||
.status-badge { font-size: 10px; font-weight: 700; padding: 2px 9px; border-radius: 99px; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; }
|
||||
.badge-planned { background: rgba(63,63,70,0.4); color: #52525b; border: 1px solid #27272a; }
|
||||
.badge-inprogress { background: rgba(251,191,36,0.08); color: #fbbf24; border: 1px solid rgba(251,191,36,0.25); }
|
||||
|
||||
.group-label { font-size: 10px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #3f3f46; margin: 28px 0 10px; }
|
||||
.group-label:first-child { margin-top: 0; }
|
||||
|
||||
.roadmap-note { margin-top: 32px; padding: 16px 20px; border: 1px solid #18181b; border-radius: 8px; font-size: 12px; color: #3f3f46; line-height: 1.6; }
|
||||
.roadmap-note a { color: #52525b; text-decoration: underline; text-underline-offset: 3px; }
|
||||
|
||||
.auth-hint { font-size: 10px; color: #3f3f46; margin-top: 4px; }
|
||||
</style>
|
||||
|
||||
<div class="wrap">
|
||||
<div class="page-header">
|
||||
<p class="page-label">Battl Builders</p>
|
||||
<h1 class="page-title">Updates</h1>
|
||||
<p class="page-sub">What we've shipped and what's coming next.</p>
|
||||
</div>
|
||||
|
||||
<div class="tabs">
|
||||
<div class="tab">What's New</div>
|
||||
<div class="tab active">What's Next</div>
|
||||
<div class="tab">Give Feedback</div>
|
||||
</div>
|
||||
|
||||
<div class="roadmap">
|
||||
<div class="group-label">In Progress</div>
|
||||
|
||||
<div class="roadmap-item">
|
||||
<button class="upvote voted" title="Remove vote">
|
||||
<svg viewBox="0 0 16 16" fill="currentColor"><path d="M8 2l5 7H3z"/></svg>
|
||||
24
|
||||
</button>
|
||||
<div class="roadmap-body">
|
||||
<div class="roadmap-item-title">Compatibility engine — gas system + buffer</div>
|
||||
<div class="roadmap-item-desc">Automatic warnings when barrel length and gas system length don't match, and when buffer weight conflicts with your stock or brace selection.</div>
|
||||
</div>
|
||||
<div class="right-col">
|
||||
<span class="status-badge badge-inprogress">In Progress</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="roadmap-item">
|
||||
<button class="upvote" title="Upvote">
|
||||
<svg viewBox="0 0 16 16" fill="currentColor"><path d="M8 2l5 7H3z"/></svg>
|
||||
11
|
||||
</button>
|
||||
<div class="roadmap-body">
|
||||
<div class="roadmap-item-title">Mobile builder experience</div>
|
||||
<div class="roadmap-item-desc">Full 375px breakpoint pass on the builder, parts browser, and build summary. Lighthouse score target ≥70.</div>
|
||||
</div>
|
||||
<div class="right-col">
|
||||
<span class="status-badge badge-inprogress">In Progress</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="group-label">Planned</div>
|
||||
|
||||
<div class="roadmap-item">
|
||||
<button class="upvote" title="Upvote">
|
||||
<svg viewBox="0 0 16 16" fill="currentColor"><path d="M8 2l5 7H3z"/></svg>
|
||||
38
|
||||
</button>
|
||||
<div class="roadmap-body">
|
||||
<div class="roadmap-item-title">Expanded parts catalog</div>
|
||||
<div class="roadmap-item-desc">50–75 SKUs across all 10 slots, 3–5 options per category, with live AvantLink pricing.</div>
|
||||
</div>
|
||||
<div class="right-col">
|
||||
<span class="status-badge badge-planned">Planned</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="roadmap-item">
|
||||
<button class="upvote" title="Upvote">
|
||||
<svg viewBox="0 0 16 16" fill="currentColor"><path d="M8 2l5 7H3z"/></svg>
|
||||
17
|
||||
</button>
|
||||
<div class="roadmap-body">
|
||||
<div class="roadmap-item-title">Caliber cross-compatibility checks</div>
|
||||
<div class="roadmap-item-desc">Flag mismatches between upper and lower when mixing calibers (e.g., .300 Blackout upper on a 5.56 lower).</div>
|
||||
</div>
|
||||
<div class="right-col">
|
||||
<span class="status-badge badge-planned">Planned</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="roadmap-item">
|
||||
<button class="upvote" title="Upvote">
|
||||
<svg viewBox="0 0 16 16" fill="currentColor"><path d="M8 2l5 7H3z"/></svg>
|
||||
9
|
||||
</button>
|
||||
<div class="roadmap-body">
|
||||
<div class="roadmap-item-title">Build guides — first wave</div>
|
||||
<div class="roadmap-item-desc">Three long-form guides targeting "AR-15 build planner" and related keywords. Written for the ICP: experienced shooter, not an expert builder.</div>
|
||||
</div>
|
||||
<div class="right-col">
|
||||
<span class="status-badge badge-planned">Planned</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="roadmap-note">
|
||||
Don't see what you need? <a href="#">Give us feedback →</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,3 @@
|
||||
<div style="display:flex;align-items:center;justify-content:center;min-height:60vh">
|
||||
<p class="subtitle">Continuing in terminal...</p>
|
||||
</div>
|
||||
@@ -0,0 +1,3 @@
|
||||
<div style="display:flex;align-items:center;justify-content:center;min-height:60vh">
|
||||
<p class="subtitle">Continuing in terminal...</p>
|
||||
</div>
|
||||
@@ -0,0 +1,3 @@
|
||||
<div style="display:flex;align-items:center;justify-content:center;min-height:60vh">
|
||||
<p class="subtitle">Continuing in terminal...</p>
|
||||
</div>
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user