diff options
| author | rr- <rr-@sakuya.pl> | 2017-01-06 14:05:54 +0100 |
|---|---|---|
| committer | rr- <rr-@sakuya.pl> | 2017-01-08 02:26:13 +0100 |
| commit | d1bb33ecf0e82689ecbca747a8ac7b038d6cf173 (patch) | |
| tree | 1327c1e0fa777b734a9607e1ad7a37e8ffc99612 /client/html | |
| parent | 4cb613a5c912e16aedc8114df6bd519cae72e06b (diff) | |
client/posts: tweak upload appearance and UX
Diffstat (limited to 'client/html')
| -rw-r--r-- | client/html/post_upload_row.tpl | 86 |
1 files changed, 49 insertions, 37 deletions
diff --git a/client/html/post_upload_row.tpl b/client/html/post_upload_row.tpl index d91f274..a8a04db 100644 --- a/client/html/post_upload_row.tpl +++ b/client/html/post_upload_row.tpl @@ -1,10 +1,4 @@ -<li class='uploadable'> - <div class='controls'> - <a href class='move-up'><i class='fa fa-chevron-up'></i></a> - <a href class='move-down'><i class='fa fa-chevron-down'></i></a> - <a href class='remove'><i class='fa fa-remove'></i></a> - </div> - +<li class='uploadable-container'> <div class='thumbnail-wrapper'> <% if (['image'].includes(ctx.uploadable.type)) { %> @@ -29,40 +23,58 @@ <% } %> </div> - <div class='file'> - <strong><%= ctx.uploadable.name %></strong> - </div> + <div class='uploadable'> + <header> + <nav> + <ul> + <li><a href class='move-up'><i class='fa fa-chevron-up'></i></a></li> + <li><a href class='move-down'><i class='fa fa-chevron-down'></i></a></li> + </ul> + </nav> + <nav> + <ul> + <li><a href class='remove'><i class='fa fa-remove'></i></a></li> + </ul> + </nav> - <div class='safety'> - <% for (let safety of ['safe', 'sketchy', 'unsafe']) { %> - <%= ctx.makeRadio({ - name: 'safety-' + ctx.uploadable.key, - value: safety, - text: safety[0].toUpperCase() + safety.substr(1), - selectedValue: ctx.uploadable.safety, - }) %> - <% } %> - </div> + <span class='filename'><%= ctx.uploadable.name %></span> + </header> - <div class='options'> - <% if (ctx.canUploadAnonymously) { %> - <div class='anonymous'> - <%= ctx.makeCheckbox({ - text: 'Upload anonymously', - name: 'anonymous', - checked: ctx.uploadable.anonymous, - }) %> + <div class='body'> + <div class='safety'> + <% for (let safety of ['safe', 'sketchy', 'unsafe']) { %> + <%= ctx.makeRadio({ + name: 'safety-' + ctx.uploadable.key, + value: safety, + text: safety[0].toUpperCase() + safety.substr(1), + selectedValue: ctx.uploadable.safety, + }) %> + <% } %> </div> - <% } %> - <% if (['video'].includes(ctx.uploadable.type)) { %> - <div class='loop-video'> - <%= ctx.makeCheckbox({ - text: 'Loop video', - name: 'loop-video', - checked: ctx.uploadable.flags.includes('loop'), - }) %> + <div class='options'> + <% if (ctx.canUploadAnonymously) { %> + <div class='anonymous'> + <%= ctx.makeCheckbox({ + text: 'Upload anonymously', + name: 'anonymous', + checked: ctx.uploadable.anonymous, + }) %> + </div> + <% } %> + + <% if (['video'].includes(ctx.uploadable.type)) { %> + <div class='loop-video'> + <%= ctx.makeCheckbox({ + text: 'Loop video', + name: 'loop-video', + checked: ctx.uploadable.flags.includes('loop'), + }) %> + </div> + <% } %> </div> - <% } %> + + <div class='messages'></div> + </div> </div> </li> |