improved file upload and font

clojure_frontend/src/toaster/bulma.clj

@@ -106,7 +106,7 @@
       :content "width=device-width, initial-scale=1"}]
 
     [:title title]
-    [:link {:href "https://fonts.googleapis.com/css?family=Open+Sans:300,400,700"
+    [:link {:href "https://fonts.googleapis.com/css?family=Ubuntu:300,400,700"
             :rel "stylesheet"}]
 
     ;; non-invasive js for syntax highlight of text-area

clojure_frontend/src/toaster/views.clj

@@ -71,19 +71,23 @@
            :enctype "multipart/form-data"}
     [:div {:class "file has-label is-fullwidth"}
      [:label {:class "file-label"}
-      [:input {:class "file-input" :name "file" :type "file"}]
+      [:input {:class "file-input inputfile inputfile-2" :id "file" :type "file"}]
+      [:label {:for "file"} [:span {:id "filename"} "Choose a Dockerfile..."]]
       [:span {:class "file-cta"}
        [:span {:class "file-icon"}
         [:i {:class "fa fa-upload"}]]
-       [:span {:class "file-label"}
-        "Docker file..."]]
-      [:span {:class "file-name"}]]]
+       [:span {:class "file-label"} "Upload"]]]]
     ;; [:fieldset {:class "fieldset-submit"}
     [:div {:class "field"}
      [:div {:class "control"}
       [:input {:class "button is-block is-info is-large is-fullwidth"
                :type "submit"
-               :name  "submit" :value "submit"}]]]]])
+               :name  "submit" :value "submit"}]]]]
+   [:script "var file = document.getElementById(\"file\");
+    file.onchange = function(){
+    if(file.files.length > 0) {
+      document.getElementById('filename').innerHTML = file.files[0].name;
+    } };"]])
 
 (defn dockerfile-upload-post [request config account]
   (let