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
Dustin 2025-03-08 20:12:20 -06:00
parent 2d7ff417fc
commit 2050ebf088
2 changed files with 12 additions and 23 deletions

View File

@ -3,11 +3,6 @@
}
#photo-view {
display: flex;
}
#photo-view .workspace {
flex-grow: 1;
text-align: center;
}

View File

@ -36,24 +36,18 @@
<video class="invisible"></video>
</div>
<div class="buttons">
<div>
<sl-tooltip content="Take Photo" placement="left">
<sl-icon-button name="camera" label="Take Photo"></sl-icon-button>
</sl-tooltip>
</div>
<div>
<sl-tooltip content="Crop" placement="left">
<sl-icon-button name="crop" label="Crop"></sl-icon-button>
</sl-tooltip>
</div>
<div>
<sl-tooltip content="Start Over" placement="left">
<sl-icon-button
name="trash"
label="Start Over"
></sl-icon-button>
</sl-tooltip>
</div>
<sl-tooltip content="Take Photo">
<sl-icon-button name="camera" label="Take Photo"></sl-icon-button>
</sl-tooltip>
<sl-tooltip content="Crop">
<sl-icon-button name="crop" label="Crop"></sl-icon-button>
</sl-tooltip>
<sl-tooltip content="Start Over">
<sl-icon-button
name="trash"
label="Start Over"
></sl-icon-button>
</sl-tooltip>
</div>
</div>
</sl-details>