Make dialog single column with images above controls

This commit is contained in:
David Rowe 2017-03-28 08:55:38 +13:00
parent e58e3fbbf7
commit 35305b4476
2 changed files with 27 additions and 68 deletions

View file

@ -9,38 +9,36 @@
<body>
<div class="snapshot-container">
<div class="snapshot-column-left">
<div class="snapsection">
<label class="title">Snapshot successfully saved!</label>
</div>
<hr />
<div class="snapsection">
<div id="sharing">
<div class="prompt">Would you like to share your pics in the Snapshots feed?</div>
<div class="button">
<span class="compound-button">
<input type="button" class="blue" id="share" value="Share in Feed" onclick="shareSelected()" />
<span class="glyph"></span>
</span>
</div>
</div>
<div class="snapsection">
<label class="title">Snapshot successfully saved!</label>
</div>
<hr />
<div id="snapshot-images">
</div>
<div class="snapsection">
<div id="sharing">
<div class="prompt">Would you like to share your pics in the Snapshots feed?</div>
<div class="button">
<input type="button" class="black" id="close" value="Don't Share" onclick="doNotShare()" />
<span class="compound-button">
<input type="button" class="blue" id="share" value="Share in Feed" onclick="shareSelected()" />
<span class="glyph"></span>
</span>
</div>
</div>
<hr />
<div class="snapsection">
<span class="setting">
<input type="button" class="glyph naked" id="snapshotSettings" value="@" onclick="snapshotSettings()" />
<label for="snapshotSettings">Snapshot settings</label>
</span>
<span class="setting checkbox">
<input id="openFeed" type="checkbox" checked />
<label for="openFeed">Open feed after</label>
</span>
<div class="button">
<input type="button" class="black" id="close" value="Don't Share" onclick="doNotShare()" />
</div>
</div>
<div id="snapshot-images" class="snapshot-column-right">
<hr />
<div class="snapsection">
<span class="setting">
<input type="button" class="glyph naked" id="snapshotSettings" value="@" onclick="snapshotSettings()" />
<label for="snapshotSettings">Snapshot settings</label>
</span>
<span class="setting checkbox">
<input id="openFeed" type="checkbox" checked />
<label for="openFeed">Open feed after</label>
</span>
</div>
</div>
</body>

View file

@ -14,51 +14,12 @@
padding-top: 3px;
}
.snapshot-column-left {
width: 320px;
position: absolute;
padding-top: 8px;
}
.snapshot-column-right {
margin-left: 342px;
}
.snapshot-column-right > div > img {
#snapshot-images > img {
width: 100%;
}
@media (max-width: 768px) {
.snapshot-column-left {
position: initial;
width: 100%;
}
.snapshot-column-right {
margin-left: 0;
width: 100%;
}
.snapshot-column-right > div > img {
margin-top: 18px !important;
}
}
.snapshot-column-right > div {
position: relative;
padding: 2px;
}
.snapshot-column-right > div > img {
border: 2px solid #575757;
margin: -2px;
}
hr {
padding-left: 0;
padding-right: 0;
margin: 21px 0;
}
.snapsection {
padding-top: 21px;
text-align: center;
}