Update UI for the file/media app

www/file/file.css

@@ -3,6 +3,19 @@ body {
   margin: 0px;
   height: 100%;
 }
+body {
+  display: flex;
+  flex-flow: column;
+}
+#app {
+  flex: 1;
+  background: url('/customize/bg3.jpg') no-repeat center center;
+  background-size: cover;
+  background-position: center;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
 .cryptpad-toolbar {
   margin-bottom: 1px;
   padding: 0px;
@@ -23,6 +36,10 @@ body {
   position: absolute;
   z-index: -1;
 }
+media-tag img {
+  max-width: 100%;
+  max-height: calc(100vh - 64px);
+}
 #upload-form,
 #download-form {
   padding: 0px;
@@ -56,20 +73,14 @@ body {
   display: none;
 }
 .inputfile + label {
-  border: 2px solid black;
-  background-color: rgba(50, 50, 50, 0.1);
   display: block;
 }
-.inputfile:focus + label,
-.inputfile + label:hover {
-  background-color: rgba(50, 50, 50, 0.3);
-}
 #progress {
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
-  transition: width 500ms;
+  transition: width 200ms;
   width: 0%;
   max-width: 100%;
   max-height: 100%;
@@ -77,3 +88,9 @@ body {
   z-index: 10000;
   display: block;
 }
+body #uploadStatusContainer {
+  background-color: rgba(255, 255, 255, 0.9);
+  color: black;
+  opacity: 0.9;
+  display: block !important;
+}