fix(ui): global UI fix

client/jdropit-send.js

@@ -161,7 +161,7 @@ SenderHandler.prototype = {
         });
         linkRemove.tooltip();
 
-        var pbContainer = newRow.children(".col-xs-7");
+        var pbContainer = newRow.children(".col-xs-8");
         var transferProgressBar = pbContainer.find("progress");
         var displayProgressBar = pbContainer.find(".text-xs-center");
         displayProgressBar.attr("id", "progress-"+receiverId);

public/css/justdropit.css

@@ -211,6 +211,8 @@ input[type='file'] {
 	display: inline;
 }
 
+/*to add margin between rows*/
+.top-buffer { margin-top:30px; }
 
 
 

views/header.jade

@@ -28,8 +28,7 @@ header(role="banner")
             div.row
                 div.col-xs-12
                     h1 Just drop it
-                        small «Let us ease your file transfer»
-    block extra_header
+                        //- small «Let us ease your file transfer»
 
 script.
     function enableNotifications() {

views/layout.jade

@@ -73,12 +73,13 @@ html
     body
         include ./header
         main
+            div.alert.alert-warning#warning-window(style="display: none;")
+                                span.icon-Warningimportant(aria-hidden="true")
+                                span.sr-only Warning:
+                                span
+                                    |   Don't close this window!
             div.container
-                div.alert.alert-warning#warning-window(style="display: none;")
-                    span.icon-Warningimportant(aria-hidden="true")
-                    span.sr-only Warning:
-                    span
-                        |   Don't close this window!
+
                 include ./user_messages
                 block content
         include ./footer

views/receive.jade

@@ -47,7 +47,7 @@ block content
     div.row#completeContainer(style="display: none;")
         div.col-xs-12
             h2 Thank you!
-            p Your friend knows you received the file. You can close this page now.
+            p Your friend knows you've received the file. You can close this page now.
     div.row#errorContainer(style="display: none;")
         div.col-xs-12
             h2 Error

views/send.jade

@@ -41,49 +41,49 @@ block extra_scripts
             sendFile(#{isLocal});
             enableNotifications();
         }
-block extra_header
-    nav.o-stepbar
-        ol
-            li.stepbar-item.current
-                a.stepbar-link(title="Select your file")
-                    span.step-number 1
-                    span.step-title Select your file
-            li.stepbar-item
-                a.stepbar-link(title="Share it with your friends")
-                    span.step-number 2
-                    span.step-title Share it with your friends
-            li.stepbar-item
-                a.stepbar-link(title="Transferring")
-                    span.step-number 3
-                    span.step-title Transferring
+
 block content
-    div.row#selectFileContainer
+    div.row
+        div.col-xs-12
+            nav.o-stepbar
+                    ol
+                        li.stepbar-item.current
+                            a.stepbar-link(title="Select your file")
+                                span.step-number 1
+                                span.step-title Select your file
+                        li.stepbar-item
+                            a.stepbar-link(title="Share it with your friends")
+                                span.step-number 2
+                                span.step-title Share it with your friends
+                        li.stepbar-item
+                            a.stepbar-link(title="Transfer")
+                                span.step-number 3
+                                span.step-title Transfer
+
+    div.row.top-buffer#selectFileContainer
         div.col-xs-12
             p.lead Either drop a file below:
             div.upload-drop-zone#drop-zone Just drag and drop a file here
-            form.form-inline#myform(action="")
+            form.form-inline.float-xs-right#myform(action="")
                 label.lead(for="file") Or select it with the file explorer: 
                 input#file(type="file")
-    div.row#copyLinkContainer(style="display: none;")
+    div.row.top-buffer#copyLinkContainer(style="display: none;")
         div.col-xs-12
             p.lead Tell your friend to go to this url:
-            div.text-muted
-                p#generatedurl
-            button.btn.btn-orange#copy-button(title="Click to copy url to clipboard") Copy to clipoard
-            span.text-success.icon-checkbox-tick#clipboardcopyok(aria-hidden="true")
+            p.text-muted.text-xs-center.lead#generatedurl
+            span.text-success.pull-xs-right.icon-checkbox-tick#clipboardcopyok(aria-hidden="true")
+            button.btn.btn-orange.pull-xs-right#copy-button(title="Click to copy url to clipboard") Copy to clipboard
     div#transferContainer(style="display: none;")
-        div.row
+        div.row.top-buffer
             div.col-xs-12
-                em Each transfer will start as soon as your friends open the link.
-
-                p.text-muted#generatedurlreminder
+                p.lead Each transfer will start as soon as your friends open the link.
+                p.text-muted.text-xs-center.lead#generatedurlreminder
                 p  
                     span#filename
         div#rowReceiverTemplate.row(style="display: none;")
-            div.col-xs-1
-            div.col-xs-1.text-right
+            div.col-xs-1.offset-xs-1.text-right
                 span.icon-Adult.big-icon
-            div.col-xs-7
+            div.col-xs-8
                 div.text-xs-center#progressDisplay 0%
                 progress.progress(value="0" max="100" style="min-width: 2em;" aria-describedby="progressDisplay" aria-valuenow="0")
             div.col-xs-1