Stack suggest name and form vertically with cards below

This commit is contained in:
2026-01-28 15:49:41 +01:00
parent 88f048b239
commit 3087b4b7b0
2 changed files with 22 additions and 28 deletions

View File

@@ -16,30 +16,28 @@
<main class="grid">
<section class="card" id="actions-card">
<div id="suggest-view" class="phase-view hidden">
<div class="split wide">
<div class="card subcard name-box">
<h3>Your Name</h3>
<label class="stack">
<span class="label">Display name</span>
<input id="name-input" maxlength="64" placeholder="Pick a name" />
</label>
<button id="save-name" class="ghost">Save</button>
<p class="hint" id="player-id"></p>
</div>
<div class="card subcard">
<h2>Suggest (up to 3)</h2>
<p class="hint">Only you can see your suggestions until Reveal.</p>
<form id="suggest-form" class="stack">
<input name="name" required maxlength="100" placeholder="Game name *" />
<input name="genre" maxlength="50" placeholder="Genre" />
<textarea name="description" maxlength="500" placeholder="Short description"></textarea>
<div class="stack horizontal">
<input name="screenshotUrl" maxlength="2048" placeholder="Screenshot URL" />
<input name="youtubeUrl" maxlength="2048" placeholder="YouTube URL" />
</div>
<button type="submit">Submit</button>
</form>
</div>
<div class="card subcard name-box">
<h3>Your Name</h3>
<label class="stack">
<span class="label">Display name</span>
<input id="name-input" maxlength="64" placeholder="Pick a name" />
</label>
<button id="save-name" class="ghost">Save</button>
<p class="hint" id="player-id"></p>
</div>
<div class="card subcard">
<h2>Suggest (up to 3)</h2>
<p class="hint">Only you can see your suggestions until Reveal.</p>
<form id="suggest-form" class="stack">
<input name="name" required maxlength="100" placeholder="Game name *" />
<input name="genre" maxlength="50" placeholder="Genre" />
<textarea name="description" maxlength="500" placeholder="Short description"></textarea>
<div class="stack horizontal">
<input name="screenshotUrl" maxlength="2048" placeholder="Screenshot URL" />
<input name="youtubeUrl" maxlength="2048" placeholder="YouTube URL" />
</div>
<button type="submit">Submit</button>
</form>
</div>
<div class="card subcard">
<h3>Your suggestions</h3>

View File

@@ -62,10 +62,6 @@ body {
flex-wrap: wrap;
}
.split.wide > .subcard {
flex: 1 1 320px;
}
.name-box {
min-width: 220px;
max-width: 260px;