PWA styles fixes

app/scripts/util/feature-detector.js

@@ -47,6 +47,9 @@ const FeatureDetector = {
         if (window.navigator.userAgent.indexOf('Edge/') > -1) {
             return 'edge';
         }
+        if (navigator.standalone) {
+            return 'standalone';
+        }
         return '';
     }
 };

app/scripts/views/open-view.js

@@ -111,8 +111,8 @@ const OpenView = Backbone.View.extend({
         this.inputEl.focus();
     },
 
-    focusInput: function() {
-        if (FocusDetector.hasFocus() && !FeatureDetector.isMobile) {
+    focusInput: function(focusOnMobile) {
+        if (FocusDetector.hasFocus() && (focusOnMobile || !FeatureDetector.isMobile)) {
             this.inputEl.focus();
         }
     },
@@ -385,7 +385,7 @@ const OpenView = Backbone.View.extend({
         }
 
         const fileInfo = this.model.fileInfos.get(id);
-        this.showOpenFileInfo(fileInfo);
+        this.showOpenFileInfo(fileInfo, true);
     },
 
     removeFile: function(id) {
@@ -494,7 +494,7 @@ const OpenView = Backbone.View.extend({
         }
     },
 
-    showOpenFileInfo: function(fileInfo) {
+    showOpenFileInfo: function(fileInfo, fileWasClicked) {
         if (this.busy || !fileInfo) {
             return;
         }
@@ -511,6 +511,10 @@ const OpenView = Backbone.View.extend({
         this.displayOpenKeyFile();
 
         this.openFileWithFingerprint(fileInfo);
+
+        if (fileWasClicked) {
+            this.focusInput(true);
+        }
     },
 
     showOpenLocalFile: function(path, keyFilePath) {
@@ -586,7 +590,7 @@ const OpenView = Backbone.View.extend({
         this.inputEl.removeAttr('disabled').toggleClass('input--error', !!err);
         if (err) {
             logger.error('Error opening file', err);
-            this.focusInput();
+            this.focusInput(true);
             this.inputEl[0].selectionStart = 0;
             this.inputEl[0].selectionEnd = this.inputEl.val().length;
             if (err.code === 'InvalidKey') {

app/styles/areas/_footer.scss

@@ -63,6 +63,10 @@
     flex: 0 0 auto;
     @include area-selectable(top);
     padding: $base-padding;
+    .standalone & {
+      padding-top: $base-padding-v;
+      padding-bottom: 1.2em;
+    }
     font-size: 1.4em;
     text-align: center;
     width: 1em;

app/styles/areas/_open.scss

@@ -36,10 +36,10 @@
       }
     }
     @include mobile() {
+      &-i, &-svg { font-size: 4.6em; }
+      &-text { font-size: 1.1em; }
       .open__icons--lower & {
-        margin: 8px;
-        &-i, &-svg { font-size: 2em; }
-        &-text { font-size: .5em; }
+        margin: 14px;
       }
     }
   }