diff --git a/apps/table.css b/apps/table.css
index 7653bb41e..4c3a16981 100644
--- a/apps/table.css
+++ b/apps/table.css
@@ -174,6 +174,7 @@ nav li:not(.active):hover{
 .bg-gray {
   background-color: #eee;
 }
+
 @media (max-width: 640px) {
   #dropNot {
     top: 50px;
@@ -190,7 +191,46 @@ nav li:not(.active):hover{
   .message {
     font-size: 13px;
   }
+} 
+@media (max-width: 1200px) {
+  .btn-style-group{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    margin: auto;
+  }
+  .custom-table {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  
 }
+@media (max-width: 1087px) {
+  
+  .custom-table {
+    width: 90%;
+  }
+  
+}
+@media (max-width: 900px) {
+  .custom-table {
+    width: 75%;
+  }
+}
+@media (max-width: 1027px) {
+  .btn-style-group{
+    width: auto;
+  }
+  .custom-table {
+    overflow-x: auto;
+    width: 80%;
+    position: relative;
+  }
+  
+}
+
 #dropNot {
   top: 60px;
   left: 0px;
diff --git a/apps/table.html b/apps/table.html
index 0ad2b8cb1..95fad063a 100644
--- a/apps/table.html
+++ b/apps/table.html
@@ -92,10 +92,10 @@ <h1 class="h1">caMicroscope</h1>
 
 	<div class="bg-light">
 		<div class="p-2">
-        <div class="d-flex justify-content-between">
-            <div class="d-md-inline-flex m-2 w-100">
+        <div class="d-flex">
+            <div class="d-md-inline-flex m-2 w-75">
             <div style="padding:0 1rem">
-                <div class="row">
+                <div class="row collection-btn">
                     <ul id = "collection-list" class="list-group">
                         <li class="list-group-item d-flex align-items-center justify-content-between active">
                             <i class="fas fa-archive"></i>
@@ -127,13 +127,13 @@ <h1 class="h1">caMicroscope</h1>
                         </div>
                     </div>
                 </div>
-                <div class="table-responsive ">
+                <div class="table-responsive custom-table ">
                     <table id='datatables' class="table table-striped"></table>
                 </div>
             </div>
             </div>
 
-            <div class="d-md-inline-flex" style="width:20%;">
+            <div class="d-md-inline-flex btn-style-group" style="width:20%;">
                 <div class="pl-md-2 pt-2">
                     <button type="button" data-bs-toggle="modal" data-bs-target="#dicom"
                         class="btn btn2 btn-success float-right w-md-100" style="background-color: cadetblue; padding: 7px;" onclick="setDicomParams();"> <i
@@ -222,41 +222,59 @@ <h3>Steps for uploading.</h3>
                                 </ul>
                             </div>
                             <div>
+                                <!-- upload new slide -->
                                 <form id="upload-form">
                                     <table class="table table-borderless" cellpadding="5" cellspacing="0">
                                         <tr>
-                                            <td align="right"><b>File</b></td>
+                                            <td align="right"><b class="form-label m-0">File</b></td>
                                             <td id="fileUploadInput">
                                                 <span class="input-group mb-3" >
                                                     <span class="custom-file fileInputClass">
-                                                        <input type="file" class="custom-file-input" id="input" onchange="handleUpload(this.files)">
-                                                        <label class="custom-file-label" for="input" style="overflow: hidden;">Choose file</label>
+                                                        <input type="file" class="custom-file-input form-control" id="input" onchange="handleUpload(this.files)" required>
+                                                        <label class="custom-file-label form-label" for="input" style="overflow: hidden;">Choose file</label>
                                                     </span>
                                                     <div class="form-group urlUploadClass" style="display:none; flex-wrap:wrap">
                                                         <input type="url" placeholder="Enter file URL" class="form-control" id="urlInput" style="width: 20em;" required>
-                                                        <button type="button" class="btn btn-info" onclick="urlInputChange();" style="margin-left: 0.6em; margin-right:-5em" >Upload</button>
+                                                        <button type="button" class="btn btn-primary" onclick="urlInputChange();" style="margin-left: 0.6em; margin-right:-5em" >Upload</button>
                                                     </div>
                                                 </span> <div id="uploadLoading" style="display: none;"><span>Uploading...</span> <br>
                                                 <div class="spinner-grow text-primary" role="status" style="margin-left: 1.2em;">
                                                     <span class="sr-only"></span>
                                                 </div> </div>
-                                                <a title="Upload from google drive" href="#" id='gdriveUpload' onclick="googlePickerStart()"><i style="font-size: 1.2em;" class="fab fa-google-drive"></i></a>
-                                                <a href="#" id='urlswitch' onclick="$('#urlInput').val(''); switchToUrl();" > <span style="position: absolute; right:2em;" > <i class="fas fa-link"></i> Upload from URL</span></a>
-                                                <a href="#" style="display: none;" id="fileswitch" onclick=" switchToFile();" > <span style="position: absolute; right:2em;" > <i class="fas fa-folder"></i> Upload from local</span></a>
-
+                                                <div class="container" id="buttonContainer">
+                                                    <div class="row">
+                                                        <div class="col-md-4">
+                                                            <a title="Upload from google drive" href="#" id='gdriveUpload' onclick="googlePickerStart()" class="btn btn-primary ">
+                                                                <i style="font-size: 1.5em;" class="fab fa-google-drive mr-2"></i> Upload from Google Drive
+                                                            </a>
+                                                        </div>
+                                                        <div class="col-md-4">
+                                                            <a href="#" id='urlswitch' onclick="$('#urlInput').val(''); switchToUrl();" class="btn btn-primary ">
+                                                                <i class="fas fa-link mr-2" style="font-size: 1.5em;"></i> Upload from URL
+                                                            </a>
+                                                        </div>
+                                                        <div class="col-md-4">
+                                                            <a href="#" style="display: none;" id="fileswitch" onclick="switchToFile();" class="btn btn-primary ">
+                                                                <i class="fas fa-folder mr-2" style="font-size: 1.5em;"></i> Upload from Local
+                                                            </a>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                                
                                             </td>
                                         </tr>
                                         <tr id="filenameRow">
-                                            <td align="right"><b>Filename</b></td>
+                                            <td align="right" class="form-control"><b>Filename</b></td>
                                         </tr>
                                         <tr id="tokenRow">
-                                            <td align="right"><b>Token</b></td>
+                                            <td align="right" class="form-control"><b>Token</b></td>
                                         </tr>
                                         <tr id="slidenameRow">
-                                            <td align="right"><b>Slidename</b></td>
+                                            <td align="right" class="form-control"><b>Slidename</b></td>
+                                            <div id="alertContainer"></div>
                                         </tr>
                                         <tr id="filterRow">
-                                            <td align="right"><b>Filter (leave blank for public)</b></td>
+                                            <td align="right" class="form-control"><b>Filter (leave blank for public)</b></td>
                                         </tr>
                                     </table>
                                     <div id="upload-progress-div" style="display: none; align-content: center;">
@@ -266,7 +284,7 @@ <h3>Steps for uploading.</h3>
                                     </div>
                                     <div class="text-center" id="controlButtons">
                                         <button class="btn btn-primary" type="button" id="finish_btn" style="display: none;"
-                                            value="Finish Upload" onclick="validateForm(finishUpload)"><i class="fas fa-arrow-right"></i></button>
+                                            value="Finish Upload" onclick="validateForm(finishUpload)"><i class="fas fa-arrow-right"></i> <span>UPLOAD</span> </button>
                                         <button class="btn btn-success" type="button" id="post_btn" value="Post"
                                             onclick="validateForm(PostBtn)">Finish Upload</button>
                                     </div>
@@ -281,7 +299,7 @@ <h3>Steps for uploading.</h3>
 
                 </div>
                 <div class="modal-footer">
-                    <button type="button" class="btn btn-secondary" onclick="initialize();" data-bs-dismiss="modal">Close</button>
+                    <button type="button" class="btn btn-danger" onclick="initialize();" data-bs-dismiss="modal">Close</button>
                 </div>
             </div>
         </div>
diff --git a/apps/table.js b/apps/table.js
index a84ee48aa..f90877af0 100644
--- a/apps/table.js
+++ b/apps/table.js
@@ -36,7 +36,7 @@ function validateForm(callback) {
     finishUploadSuccess = false;
     $('#check_btn').hide();
     $('#post_btn').hide();
-    changeStatus('UPLOAD', 'Please choose a file first');
+    $('#alertContainer').html('<div class="alert alert-danger" role="alert">Please enter slide name</div>');
     return false;
   }
   // Check if slide name is empty
@@ -44,14 +44,14 @@ function validateForm(callback) {
     finishUploadSuccess = false;
     $('#check_btn').hide();
     $('#post_btn').hide();
-    changeStatus('UPLOAD', 'Please enter slide name');
+    $('#alertContainer').html('<div class="alert alert-danger" role="alert">Please enter slide name</div>');
     return false;
   }
   // Sanitizing input
   slide.value = sanitize(slide.value);
   // Checking if silde with given name already exists
   if (existingSlideNames.includes(slide.value)) {
-    changeStatus('UPLOAD', 'Slide with given name already exists');
+    $('#alertContainer').html('<div class="alert alert-danger" role="alert">Slide with given name already exists</div>');
     finishUploadSuccess = false;
     $('#check_btn').hide();
     $('#post_btn').hide();
diff --git a/components/toolbar/toolbar.css b/components/toolbar/toolbar.css
index bbb93c0b4..4ab131a40 100644
--- a/components/toolbar/toolbar.css
+++ b/components/toolbar/toolbar.css
@@ -71,7 +71,7 @@ ul.drop_down {
 }
 
 ul.tools > li:hover ul.drop_down {
-  flex-direction: column;
+  flex-direction: row; /* Consumes less space */
   display: flex;
   width: fit-content;
   width: -moz-fit-content;
diff --git a/components/toolbar/toolbar.js b/components/toolbar/toolbar.js
index a50a6876d..b0b69a891 100644
--- a/components/toolbar/toolbar.js
+++ b/components/toolbar/toolbar.js
@@ -155,12 +155,11 @@ CaToolbar.prototype.__createBtn = function(options) {
   btn.classList.add('md-24');
   btn.textContent = options.icon;
   if (options.title) {
-    btn.title = options.title;
     tippy(btn, {
       content: options.title,
-      placement: 'right',
-      delay: 300,
-      theme: 'light-border',
+      placement: 'bottom',
+      delay: 200,
+      theme: 'dark',
     });
   }
   li.appendChild(btn);
@@ -214,12 +213,11 @@ CaToolbar.prototype.__createCheck = function(options) {
   icon.textContent = options.icon;
   icon.htmlFor = id;
   if (options.title) {
-    icon.title = options.title;
     tippy(icon, {
       content: options.title,
-      placement: 'right',
+      placement: 'bottom',
       delay: 300,
-      theme: 'light-border',
+      theme: 'dark',
     });
   }
   li.appendChild(icon);
@@ -291,12 +289,11 @@ CaToolbar.prototype.__createRadio = function(options) {
 
   icon.htmlFor = id;
   if (options.title) {
-    icon.title = options.title;
     tippy(icon, {
       content: options.title,
-      placement: 'right',
+      placement: 'bottom',
       delay: 300,
-      theme: 'light-border',
+      theme: 'dark',
     });
   }
 
@@ -337,12 +334,11 @@ CaToolbar.prototype.__createMultiStateBtns = function(options) {
   icon.dataset.state = 0;
   icon.textContent = options.icon;
   if (options.title) {
-    icon.title = options.title;
     tippy(icon, {
       content: options.title,
-      placement: 'right',
+      placement: 'bottom',
       delay: 300,
-      theme: 'light-border',
+      theme: 'dark',
     });
   }
   li.appendChild(icon);
@@ -390,12 +386,11 @@ CaToolbar.prototype.__createMultiDropDown = function(options) {
   icon.textContent = options.icon;
   icon.htmlFor = id;
   if (options.title) {
-    icon.title = options.title;
     tippy(icon, {
       content: options.title,
-      placement: 'right',
+      placement: 'bottom',
       delay: 300,
-      theme: 'light-border',
+      theme: 'dark',
     });
   }
   li.appendChild(icon);
@@ -518,12 +513,11 @@ CaToolbar.prototype.__createDropDown = function(options) {
   icon.textContent = options.icon;
   icon.htmlFor = id;
   if (options.title) {
-    icon.title = options.title;
     tippy(icon, {
       content: options.title,
-      placement: 'right',
+      placement: 'left-start',
       delay: 300,
-      theme: 'light-border',
+      theme: 'dark',
     });
   }
   li.appendChild(icon);