Made upload page more mobile friendly

Teknik/Areas/Upload/Views/Upload/Index.cshtml

@@ -45,7 +45,7 @@
                 </div>
             </div>
         </div>
-        <div class="col-sm-1 upload__help-icon">
+        <div class="col-sm-1 hidden-xs upload__help-icon">
             <a href="@Url.SubRouteUrl("help", "Help.Upload")" target="_blank"><i class="fa fa-question-circle-o"></i></a>
         </div>
     </div>
@@ -53,8 +53,8 @@
     <div class="row form-horizontal">
         <div class="col-sm-5 col-sm-offset-1">
             <div class="form-group form-group-sm">
-                <label for="encrypt" class="col-sm-6 control-label">Encrypt in Browser</label>
-                <div class="col-sm-6">
+                <label for="encrypt" class="col-sm-6 col-xs-3 control-label">Encrypt in Browser</label>
+                <div class="col-sm-6 col-xs-9">
                     <input type="checkbox" class="center-block" name="encrypt" id="encrypt" @(Model.Encrypt ? "checked" : string.Empty) />
                 </div>
             </div>
@@ -63,18 +63,18 @@
             <div class="form-group form-group-sm">
                 @if (!User.Identity.IsAuthenticated)
                 {
-                    @:<label class="col-sm-3 control-label" data-toggle="tooltip" data-placement="top" title="You must be logged in to modify the expiration">Expiration*</label>
+                    @:<label class="col-xs-3 control-label" data-toggle="tooltip" data-placement="top" title="Uploads expire after 1 day for unregistered users">Expiration*</label>
                 }
                 else
                 {
-                    @:<label class="col-sm-3 control-label">Expiration</label>
+                    @:<label class="col-xs-3 control-label">Expiration</label>
                 }
                 <fieldset @if (!User.Identity.IsAuthenticated) { @: disabled
                           }>
-                    <div class="col-sm-4 hidden" id="length-div">
+                    <div class="col-xs-4 hidden" id="length-div">
                         <input type="number" min="1" step="1" class="form-control" name="expirelength" id="expirelength" value="@Model.ExpirationLength">
                     </div>
-                    <div class="col-sm-9" id="unit-div">
+                    <div class="col-xs-9" id="unit-div">
                         <select class="form-control" name="expireunit" id="expireunit">
                             @foreach (ExpirationUnit unit in Enum.GetValues(typeof(ExpirationUnit)))
                             {

Teknik/Content/Upload/Upload.css

@@ -20,7 +20,7 @@
         }
 
 .upload__help-icon {
-    margin-top: 20px;
+    margin: 20px 0;
 }
 
     .upload__help-icon a {
@@ -29,8 +29,4 @@
 
         .upload__help-icon a i {
             font-size: 18px;
-        }
-
-.control-label {
-    font-size: 12px;
-}
+        }

Teknik/Scripts/Upload/Upload.js

@@ -173,13 +173,13 @@ function linkAddToVault(element) {
 function setExpireWidth(unit) {
     if (unit === "Never") {
         $('#length-div').addClass("hidden");
-        $('#unit-div').removeClass("col-sm-5");
-        $('#unit-div').addClass("col-sm-9");
+        $('#unit-div').removeClass("col-xs-5");
+        $('#unit-div').addClass("col-xs-9");
     }
     else {
         $('#length-div').removeClass("hidden");
-        $('#unit-div').removeClass("col-sm-9");
-        $('#unit-div').addClass("col-sm-5");
+        $('#unit-div').removeClass("col-xs-9");
+        $('#unit-div').addClass("col-xs-5");
     }
 }