From 0064ca7b185f25fb28ab1f3628fe5f33cf52e953 Mon Sep 17 00:00:00 2001
From: Anatoly <akopyl@radner.ru>
Date: Tue, 4 Jan 2022 12:39:27 +0300
Subject: [PATCH] Styled progress bar

---
 index.php | 4 ++--
 main.js   | 6 +-----
 2 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/index.php b/index.php
index 3df4180..5c96820 100644
--- a/index.php
+++ b/index.php
@@ -23,8 +23,8 @@
         </div>
       </label>
       <input id="upload" type="file" class="d-none">
-      <div class="progress">
-        <div id="progress" class="progress-bar d-none" role="progressbar"></div>
+      <div class="progress d-none mb-5" id="progress">
+        <div class="progress-bar" role="progressbar"></div>
       </div>
 
 
diff --git a/main.js b/main.js
index dfb6dc5..ea4326c 100644
--- a/main.js
+++ b/main.js
@@ -22,10 +22,6 @@ fileInput.addEventListener('change', async function (event) {
     const file = event.target.files[0];
     let formData = new FormData();
     formData.append("file", file);
-    // const response = await fetch('upload.php', { method: "POST", body: formData });
-    // if (response.status === 200) {
-    //     window.location.reload(false);
-    // }
     axios.request({
         method: "post",
         url: "upload.php", 
@@ -33,7 +29,7 @@ fileInput.addEventListener('change', async function (event) {
         headers: { "Content-Type": "multipart/form-data" },
         onUploadProgress: (p) => {
             progressBar.style.display = 'block';
-            progressBar.style.width = `${p.loaded / p.total}%`;
+            progressBar.children[0].style.width = `${p.loaded / p.total}%`;
         }
     }).then (data => {
         window.location.reload(false);