diff --git a/public/index.css b/public/index.css
index 720a46a..776729e 100644
--- a/public/index.css
+++ b/public/index.css
@@ -211,7 +211,7 @@ input {
   font-size: large;
   border-radius: 10px 10px 0px 0px;
   transition: 0.1s border-left ease-out, 0.1s background-color ease-in-out;
-  height: 96px;
+  min-height: 96px;
   display: flex;
   justify-content: space-between;
 }
@@ -423,12 +423,10 @@ input:checked + .slider:before {
 #progress-state {
   font-family: monospace;
   font-size: 12px;
-  max-height: 50px;
   border-radius: 10px;
-  overflow: auto;
-  width: 60%;
-  margin-top: 5px;
-  padding: 2px;
+  width: 80%;
+  padding: 6px;
+  height: 110px;
 }
 
 .album-downloading {
diff --git a/public/index.js b/public/index.js
index 22e0c61..c04192d 100644
--- a/public/index.js
+++ b/public/index.js
@@ -41,7 +41,7 @@ function getWebsocketLocation() {
 
 function addlog(log, text) {
   log += `<br>${text}`;
-  log = log.split('<br>').slice(-3).join('<br>');
+  log = log.split('<br>').slice(-5).join('<br>');
   if (log.startsWith('<br>')) log = log.replace('<br>', '');
   return log;
 }
@@ -77,6 +77,8 @@ function startDownload(id, isAlbum) {
       download(d.data);
     } else if (d.key === 'finishDownload') {
       log = addlog(log, 'Download finished');
+    } else if (d.key === 'zipping') {
+      log = addlog(log, 'Zipping up files');
     }
 
     document.getElementById('progress-album').innerHTML = `
diff --git a/src/index.js b/src/index.js
index 5505da8..5a7451a 100644
--- a/src/index.js
+++ b/src/index.js
@@ -121,6 +121,8 @@ app.ws('/api/album', async (ws, req) => {
 
   await deemixDownloader.start();
 
+  await ws.send(JSON.stringify({key: 'zipping'}));
+
   const folderName = trackpaths[0].split('/').slice(-2)[0];
   try {
     await promisify(exec)(`zip -0rD "data/${folderName}.zip" "data/${folderName}"`);