diff --git a/android/pages/home.js b/android/pages/home.js index 71db6190..78eb649f 100644 --- a/android/pages/home.js +++ b/android/pages/home.js @@ -24,14 +24,18 @@ module.exports = function(state, emit) { let content = ''; let button = html` - + > + + `; if (state.uploading) { - content = archiveTile.uploading(state, emit); + content = html` +
${archiveTile.uploading(state, emit)}
+ `; } else if (state.archive) { content = archiveTile.wip(state, emit); button = ''; @@ -39,11 +43,15 @@ module.exports = function(state, emit) { content = archives.length < 1 ? intro(state) - : list(archives, 'list-reset h-full overflow-y-scroll', 'mb-3'); + : list( + archives, + 'list-reset h-full overflow-y-scroll w-full p-6', + 'mb-3 w-full' + ); } return html` -
+
${state.modal && modal(state, emit)} ${content}
${button} diff --git a/app/main.css b/app/main.css index 1539d7a3..270bb03e 100644 --- a/app/main.css +++ b/app/main.css @@ -165,3 +165,23 @@ progress::-webkit-progress-value { @apply shadow-md; } } + +.rounded-device { + border-radius: 0.25rem; +} + +.px-4-device { + padding-left: 0; + padding-right: 0; +} + +@media screen and (max-device-width: 576px) { + .rounded-device { + border-radius: 0; + } + + .px-4-device { + padding-left: 1rem; + padding-right: 1rem; + } +} diff --git a/app/ui/archiveTile.js b/app/ui/archiveTile.js index 66b0bc76..58f1b60f 100644 --- a/app/ui/archiveTile.js +++ b/app/ui/archiveTile.js @@ -20,7 +20,7 @@ function password(state) { const MAX_LENGTH = 32; return html` -
+
+

${file.name}

@@ -143,7 +143,7 @@ module.exports = function(state, emit, archive) { return html`
+ class="flex flex-col items-start border border-grey-light bg-white p-4 w-full">

+

${ list( Array.from(state.archive.files) @@ -225,7 +225,7 @@ module.exports.wip = function(state, emit) { ${expiryOptions(state, emit)} ${password(state, emit)}