ui: Move camera action buttons below image viewer
On mobile, the screen is too narrow to put the action buttons to the right of the image viewer.bugfix/ci-buildah
parent
2d7ff417fc
commit
2050ebf088
|
@ -3,11 +3,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
#photo-view {
|
#photo-view {
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
|
|
||||||
#photo-view .workspace {
|
|
||||||
flex-grow: 1;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -36,18 +36,13 @@
|
||||||
<video class="invisible"></video>
|
<video class="invisible"></video>
|
||||||
</div>
|
</div>
|
||||||
<div class="buttons">
|
<div class="buttons">
|
||||||
<div>
|
<sl-tooltip content="Take Photo">
|
||||||
<sl-tooltip content="Take Photo" placement="left">
|
|
||||||
<sl-icon-button name="camera" label="Take Photo"></sl-icon-button>
|
<sl-icon-button name="camera" label="Take Photo"></sl-icon-button>
|
||||||
</sl-tooltip>
|
</sl-tooltip>
|
||||||
</div>
|
<sl-tooltip content="Crop">
|
||||||
<div>
|
|
||||||
<sl-tooltip content="Crop" placement="left">
|
|
||||||
<sl-icon-button name="crop" label="Crop"></sl-icon-button>
|
<sl-icon-button name="crop" label="Crop"></sl-icon-button>
|
||||||
</sl-tooltip>
|
</sl-tooltip>
|
||||||
</div>
|
<sl-tooltip content="Start Over">
|
||||||
<div>
|
|
||||||
<sl-tooltip content="Start Over" placement="left">
|
|
||||||
<sl-icon-button
|
<sl-icon-button
|
||||||
name="trash"
|
name="trash"
|
||||||
label="Start Over"
|
label="Start Over"
|
||||||
|
@ -55,7 +50,6 @@
|
||||||
</sl-tooltip>
|
</sl-tooltip>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</sl-details>
|
</sl-details>
|
||||||
<footer>
|
<footer>
|
||||||
<sl-button type="reset" variant="secondary">Reset</sl-button
|
<sl-button type="reset" variant="secondary">Reset</sl-button
|
||||||
|
|
Loading…
Reference in New Issue