Better layout for upload options

This commit is contained in:
Fabricio Winter 2022-12-30 13:47:08 -03:00
parent 28d2de8a54
commit 0d1fec51c5
3 changed files with 43 additions and 30 deletions

View file

@ -15,11 +15,13 @@ $cancel-button-color = tomato
&.inactive .skip-duplicates &.inactive .skip-duplicates
&.inactive .always-upload-similar &.inactive .always-upload-similar
&.inactive .pause-remain-on-error &.inactive .pause-remain-on-error
&.inactive .upload-all-anonymous
&.inactive #common-tags, &.inactive #common-tags,
&.uploading input[type=submit], &.uploading input[type=submit],
&.uploading .skip-duplicates, &.uploading .skip-duplicates,
&.uploading .always-upload-similar &.uploading .always-upload-similar
&.uploading .pause-remain-on-error &.uploading .pause-remain-on-error
&.uploading .upload-all-anonymous
&:not(.uploading) .cancel &:not(.uploading) .cancel
display: none display: none
@ -59,6 +61,15 @@ $cancel-button-color = tomato
form>.messages form>.messages
margin-top: 1em margin-top: 1em
.control-strip
display: flex
flex-direction: column
gap: 0.5em
.control-options
display: flex
flex-direction: column
.uploadables-container .uploadables-container
list-style-type: none list-style-type: none
margin: 0 margin: 0

View file

@ -5,39 +5,41 @@
<div class='control-strip'> <div class='control-strip'>
<input type='submit' value='Upload all' class='submit'/> <input type='submit' value='Upload all' class='submit'/>
<span class='skip-duplicates'> <div class='control-options'>
<%= ctx.makeCheckbox({ <span class='skip-duplicates'>
text: 'Skip duplicate', <%= ctx.makeCheckbox({
name: 'skip-duplicates', text: 'Skip duplicate',
checked: false, name: 'skip-duplicates',
}) %> checked: false,
</span> }) %>
</span>
<span class='always-upload-similar'> <span class='always-upload-similar'>
<%= ctx.makeCheckbox({ <%= ctx.makeCheckbox({
text: 'Force upload similar', text: 'Force upload similar',
name: 'always-upload-similar', name: 'always-upload-similar',
checked: false, checked: false,
}) %> }) %>
</span> </span>
<span class='pause-remain-on-error'> <span class='pause-remain-on-error'>
<%= ctx.makeCheckbox({ <%= ctx.makeCheckbox({
text: 'Pause on error', text: 'Pause on error',
name: 'pause-remain-on-error', name: 'pause-remain-on-error',
checked: true, checked: true,
}) %> }) %>
</span> </span>
<span class='upload-all-anonymous'> <span class='upload-all-anonymous'>
<%= ctx.makeCheckbox({ <%= ctx.makeCheckbox({
text: 'Upload anonymously', text: 'Upload anonymously',
name: 'upload-all-anonymous', name: 'upload-all-anonymous',
checked: false, checked: false,
}) %> }) %>
</span> </span>
</div>
<%= ctx.makeTextInput({placeholder: 'Common tags', id: 'common-tags', name: 'common-tags', style: 'margin-top:1em;'}) %> <%= ctx.makeTextInput({placeholder: 'Common tags', id: 'common-tags', name: 'common-tags'}) %>
<input type='button' value='Cancel' class='cancel'/> <input type='button' value='Cancel' class='cancel'/>
</div> </div>

View file

@ -474,7 +474,7 @@ class PostUploadView extends events.EventTarget {
} }
get _commonTagsInputNode() { get _commonTagsInputNode() {
return this._formNode.querySelector('form [name=common-tags'); return this._formNode.querySelector('form [name=common-tags]');
} }
} }