Stack suggest name and form vertically with cards below
This commit is contained in:
@@ -16,30 +16,28 @@
|
|||||||
<main class="grid">
|
<main class="grid">
|
||||||
<section class="card" id="actions-card">
|
<section class="card" id="actions-card">
|
||||||
<div id="suggest-view" class="phase-view hidden">
|
<div id="suggest-view" class="phase-view hidden">
|
||||||
<div class="split wide">
|
<div class="card subcard name-box">
|
||||||
<div class="card subcard name-box">
|
<h3>Your Name</h3>
|
||||||
<h3>Your Name</h3>
|
<label class="stack">
|
||||||
<label class="stack">
|
<span class="label">Display name</span>
|
||||||
<span class="label">Display name</span>
|
<input id="name-input" maxlength="64" placeholder="Pick a name" />
|
||||||
<input id="name-input" maxlength="64" placeholder="Pick a name" />
|
</label>
|
||||||
</label>
|
<button id="save-name" class="ghost">Save</button>
|
||||||
<button id="save-name" class="ghost">Save</button>
|
<p class="hint" id="player-id"></p>
|
||||||
<p class="hint" id="player-id"></p>
|
</div>
|
||||||
</div>
|
<div class="card subcard">
|
||||||
<div class="card subcard">
|
<h2>Suggest (up to 3)</h2>
|
||||||
<h2>Suggest (up to 3)</h2>
|
<p class="hint">Only you can see your suggestions until Reveal.</p>
|
||||||
<p class="hint">Only you can see your suggestions until Reveal.</p>
|
<form id="suggest-form" class="stack">
|
||||||
<form id="suggest-form" class="stack">
|
<input name="name" required maxlength="100" placeholder="Game name *" />
|
||||||
<input name="name" required maxlength="100" placeholder="Game name *" />
|
<input name="genre" maxlength="50" placeholder="Genre" />
|
||||||
<input name="genre" maxlength="50" placeholder="Genre" />
|
<textarea name="description" maxlength="500" placeholder="Short description"></textarea>
|
||||||
<textarea name="description" maxlength="500" placeholder="Short description"></textarea>
|
<div class="stack horizontal">
|
||||||
<div class="stack horizontal">
|
<input name="screenshotUrl" maxlength="2048" placeholder="Screenshot URL" />
|
||||||
<input name="screenshotUrl" maxlength="2048" placeholder="Screenshot URL" />
|
<input name="youtubeUrl" maxlength="2048" placeholder="YouTube URL" />
|
||||||
<input name="youtubeUrl" maxlength="2048" placeholder="YouTube URL" />
|
</div>
|
||||||
</div>
|
<button type="submit">Submit</button>
|
||||||
<button type="submit">Submit</button>
|
</form>
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="card subcard">
|
<div class="card subcard">
|
||||||
<h3>Your suggestions</h3>
|
<h3>Your suggestions</h3>
|
||||||
|
|||||||
@@ -62,10 +62,6 @@ body {
|
|||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
.split.wide > .subcard {
|
|
||||||
flex: 1 1 320px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.name-box {
|
.name-box {
|
||||||
min-width: 220px;
|
min-width: 220px;
|
||||||
max-width: 260px;
|
max-width: 260px;
|
||||||
|
|||||||
Reference in New Issue
Block a user