diff --git a/web/pgadmin/misc/file_manager/static/css/file_manager.css b/web/pgadmin/misc/file_manager/static/css/file_manager.css
index dd7596b4c..571e90e83 100644
--- a/web/pgadmin/misc/file_manager/static/css/file_manager.css
+++ b/web/pgadmin/misc/file_manager/static/css/file_manager.css
@@ -20,20 +20,6 @@
   height: 17px;
 }
 
-.fileinfo #contents li p > span.less_text,
-.fileinfo table#contents tr td:first-child p span.less_text {
-  width: 100%;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  text-align: center;
-  white-space: nowrap;
-}
-
-.fileinfo table#contents tr td p {
-  display: inline-block;
-  margin-bottom: 0;
-}
-
 .fileinfo > h1 {
   font-size: 16px;
   margin: 100px auto;
@@ -86,7 +72,6 @@ x:-o-prefocus, .file-input-container {top:16px;width:198px;}
 }
 
 div.clip {
-  width: 30px;
   height: 30px;
   margin: 10px auto;
   overflow: hidden;
diff --git a/web/pgadmin/misc/file_manager/static/js/utility.js b/web/pgadmin/misc/file_manager/static/js/utility.js
index ae6b8b346..5e9eb2f08 100644
--- a/web/pgadmin/misc/file_manager/static/js/utility.js
+++ b/web/pgadmin/misc/file_manager/static/js/utility.js
@@ -533,7 +533,7 @@ define([
 
             var class_type;
             if ((data[key]).file_type == 'dir') {
-              class_type = 'fa fa-folder-open fm_folder';
+              class_type = 'fa fa-folder-open fm_folder_grid';
             } else if ((data[key]).file_type == 'drive') {
               class_type = 'fa fa-hdd-o fm_drive';
             } else {
@@ -560,9 +560,9 @@ define([
               result += '<span>' + fm_filename + '</span>';
             } else {
               result +=
-                '<p><input type="text" class="fm_file_rename" />' +
+                '<div><input type="text" class="fm_file_rename" />' +
                 '<span class="less_text" title="' + fm_filename + '">' + fm_filename +
-                '</span></p>';
+                '</span></div>';
             }
             if (props.Width && props.Width != '') {
               result += '<span class="meta dimensions">' +
@@ -611,7 +611,7 @@ define([
 
             if ((data[key]).file_type == 'dir') {
               class_type = 'tbl_folder';
-              icon_type = 'fa fa-folder-open';
+              icon_type = 'fa fa-folder-open fm_folder_list';
             } else if ((data[key]).file_type == 'drive') {
               class_type = 'tbl_drive';
               icon_type = 'fa fa-hdd-o';
@@ -639,11 +639,13 @@ define([
               result += '<span title="' + (data[key]).Filename + '">' +
                 fm_filename + '</span></td>';
             } else {
-              result += '<p><input type="text" class="fm_file_rename"/>'+
+              result += '<div><input type="text" class="fm_file_rename"/>'+
+                        '<div class="d-flex">' +
                         '<span class="'+icon_type+'"></span>' +
                         data_protected +
                         '<span class="less_text ml-2" title="' + fm_filename + '">' + fm_filename + '</span>' +
-                        '</p></td>';
+                        '</div>' +
+                        '</div></td>';
             }
             if (props.Size && props.Size != '') {
               result += '<td><span title="' + props.Size + '">' +
@@ -698,7 +700,7 @@ define([
 
         if ($('.fileinfo').data('view') == 'grid') {
           e.stopPropagation();
-          $this = $('.file_manager').find('#contents li.selected p');
+          $this = $('.file_manager').find('#contents li.selected div');
           orig_value = decodeURI($this.find('span.less_text').attr('title'));
           newvalue = orig_value.substring(0, orig_value.indexOf('.'));
 
@@ -713,7 +715,7 @@ define([
           $('.file_manager').off().on('keyup', function(e) {
             if (e.keyCode == 13) {
               e.stopPropagation();
-              $('.fileinfo #contents li.selected p').find(
+              $('.fileinfo #contents li.selected div').find(
                 'input'
               ).trigger('blur');
             }
@@ -721,7 +723,7 @@ define([
         } else if ($('.fileinfo').data('view') == 'list') {
           e.stopPropagation();
           $this = $('.fileinfo').find(
-            'table#contents tbody tr.selected td:first-child p'
+            'table#contents tbody tr.selected td:first-child div'
           );
           orig_value = decodeURI($this.find('span.less_text').html()),
             newvalue = orig_value.substring(0, orig_value.lastIndexOf('.'));
@@ -737,7 +739,7 @@ define([
           $('.file_manager').off().on('keyup', function(e) {
             if (e.keyCode == 13) {
               e.stopPropagation();
-              $('.fileinfo table#contents tr.selected td p').find(
+              $('.fileinfo table#contents tr.selected td div').find(
                 'input'
               ).trigger('blur');
             }
@@ -746,7 +748,7 @@ define([
       });
 
       // Rename UI handling
-      $('.fileinfo #contents li p').on('blur dblclick', 'input', function(e) {
+      $('.fileinfo #contents li div').on('blur dblclick', 'input', function(e) {
         e.stopPropagation();
 
         var old_name = decodeURI($(this).siblings('span').attr('title'));
@@ -824,7 +826,7 @@ define([
         }
       });
 
-      $('.fileinfo table#contents tr td p').on(
+      $('.fileinfo table#contents tr td div').on(
         'blur dblclick', 'input',
         function(e) {
           var old_name = decodeURI($(this).siblings('span').attr('title')),
@@ -1141,7 +1143,7 @@ define([
 
           select_box = `<div class='change_file_types d-flex align-items-center p-1'>
           <div>
-            ${gettext('Show hidden files and folders')} ?
+            ${gettext('Show hidden files and folders')}?
             <input type='checkbox' id='show_hidden' onclick='pgAdmin.FileUtils.handleClick(this)' tabindex='11'>
           </div>
           <div class="ml-auto">
@@ -1415,7 +1417,7 @@ define([
         // we remove simple file upload element
         $('.file-input-container').remove();
         $('.upload').remove();
-        $('.create').before('<button value="Upload" type="button" title="Upload File" name="upload" id="upload" class="btn fa fa-upload upload" tabindex="6"><span></span></button> ');
+        $('.create').before('<button value="Upload" type="button" title="Upload File" name="upload" id="upload" class="btn btn-sm btn-secondary upload" tabindex="6"><span class="fa fa-upload sql-icon-lg"></span></button> ');
 
         $('#uploader .upload').off().on('click', function() {
           // we create prompt
@@ -1579,8 +1581,8 @@ define([
           // template for creating new folder
           folder_div =
             '<li class=\'cap_download cap_delete cap_select_file cap_select_folder cap_rename cap_create cap_upload\'>' +
-            '<div class=\'clip\'><span data-alt=\'\' class=\'fa fa-folder-open fm_folder\'></span></div>' +
-            '<p><input type=\'text\' class=\'fm_file_rename\'><span title=\'\'>New_Folder</span></p>' +
+            '<div class=\'clip\'><span data-alt=\'\' class=\'fa fa-folder-open fm_folder_grid\'></span></div>' +
+            '<div><input type=\'text\' class=\'fm_file_rename\'><span title=\'\'>New_Folder</span></div>' +
             '<span class=\'meta size\'></span><span class=\'meta created\'></span><span class=\'meta modified\'></span></li>';
 
           path = $('.currentpath').val();
@@ -1619,7 +1621,7 @@ define([
             '<tr class=\'cap_download cap_delete cap_select_file cap_select_folder cap_rename cap_create cap_upload\'>' +
             '<td title=\'\' class=\' tbl_folder\'>' +
             '<input type=\'text\' class=\'fm_file_rename\'>'+
-            '<span class="fa fa-folder-open"></span>' +
+            '<span class="fa fa-folder-open fm_folder_list"></span>' +
             '<span>' + lg.new_folder + '</span>' +
             '</td>'+
             '<td><span title=\'\'></span></td>' +
diff --git a/web/pgadmin/misc/file_manager/static/scss/_file_manager.scss b/web/pgadmin/misc/file_manager/static/scss/_file_manager.scss
index 404bf6d1b..45bcfebbf 100644
--- a/web/pgadmin/misc/file_manager/static/scss/_file_manager.scss
+++ b/web/pgadmin/misc/file_manager/static/scss/_file_manager.scss
@@ -40,8 +40,8 @@
 
   .file_listing_table tbody tr td:nth-child(1),
   .file_listing_table thead tr th:nth-child(1) {
-    width: 100%;
-    min-width: 100%;
+    width: 400px;
+    min-width: 400px;
   }
 
   .file_listing_table tbody tr td:nth-child(2),
@@ -53,9 +53,9 @@
 
   .file_listing_table tbody tr td:nth-child(3),
   .file_listing_table thead tr th:nth-child(3) {
-    width: 200px;
-    min-width: 200px;
-    max-width: 200px;
+    width: 100%;
+    min-width: 100%;
+    max-width: 100%;
   }
 }
 
@@ -66,12 +66,39 @@
   background: $table-hover-bg-color;
 }
 
-.fileinfo table#contents tr td p {
+.fileinfo table#contents tr td {
   font-family: $font-family-primary;
 }
 
-.fm_folder {
+.fileinfo #contents li span.less_text {
+  width: 100%;
+  text-overflow: ellipsis;
+  overflow: hidden;
+  text-align: center;
+  white-space: nowrap;
+  display: block;
+}
+
+.fileinfo table#contents tr td:first-child {
+  & span.less_text {
+    width: 100%;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    max-width: calc(400px - 30px);
+  }
+
+  & .fa {
+    line-height: inherit;
+  }
+}
+
+.fm_folder_grid {
   font-size: xx-large !important;
+}
+
+.fm_folder_list,
+.fm_folder_grid {
   color: $color-warning;
 }
 
@@ -118,7 +145,7 @@
   height: 80px;
   text-align: center;
   overflow: hidden;
-  margin-bottom: 10px;
+  margin: 0.5rem;
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;
   border-radius: 2px;
@@ -338,4 +365,4 @@
 
 .cap_select_file {
   cursor: pointer;
-}
+}
\ No newline at end of file
diff --git a/web/pgadmin/misc/file_manager/templates/file_manager/index.html b/web/pgadmin/misc/file_manager/templates/file_manager/index.html
index f854545e1..86cf6fd6e 100644
--- a/web/pgadmin/misc/file_manager/templates/file_manager/index.html
+++ b/web/pgadmin/misc/file_manager/templates/file_manager/index.html
@@ -8,12 +8,13 @@
             <div class="flex-grow-1 mr-1">
                 <div class="input-group" role="group">
                     <div class="input-group-prepend">
-                        <button name="home" type="button" value="Home" title="{{ _('Home') }}" class="btn btn-secondary bg-gray-lighter home"
+                        <button name="home" type="button" value="Home" title="{{ _('Home') }}" class="btn btn-secondary home"
                                 tabindex="1">
-                            <span class="fa fa-home fa-lg"></span>
+                            <span class="fa fa-home sql-icon-lg"></span>
                         </button>
-                        <button name="level-up" type="button" title="{{ _('Back') }}" value="LevelUp" class="btn btn-secondary bg-gray-lighter fa fa-level-up level-up"
+                        <button name="level-up" type="button" title="{{ _('Back') }}" value="LevelUp" class="btn btn-secondary level-up"
                                 disabled tabindex="2">
+                            <span class="fa fa-level-up sql-icon-lg"></span>
                         </button>
                     </div>
                     <input id="file-input-path" class="form-control input-path text-truncate" title="" type="text" tabindex="3" autofocus/>
@@ -23,32 +24,32 @@
             <div>
                 <input class="mode" name="mode" type="hidden" value="add"/>
                 <input class="currentpath" name="currentpath" type="hidden"/>
-                <button type="button" title="{{ _('Refresh') }}" class="btn btn-sm refresh"
+                <button type="button" title="{{ _('Refresh') }}" class="btn btn-sm btn-secondary refresh"
                         tabindex="4">
-                    <span class="fa fa-refresh fa-lg"></span>
+                    <span class="fa fa-refresh sql-icon-lg"></span>
                 </button>
-                <button type="button" title="{{ _('Download File') }}" class="btn btn-sm download"
+                <button type="button" title="{{ _('Download File') }}" class="btn btn-sm btn-secondary download"
                         disabled>
-                    <span class="fa fa-download fa-lg"></span>
+                    <span class="fa fa-download sql-icon-lg"></span>
                 </button>
-                <button name="delete" type="button" title="{{ _('Delete File/Folder') }}" class="btn btn-sm delete"
+                <button name="delete" type="button" title="{{ _('Delete File/Folder') }}" class="btn btn-sm btn-secondary delete"
                         disabled>
-                    <span class="fa fa-trash fa-lg"></span>
+                    <span class="fa fa-trash sql-icon-lg"></span>
                 </button>
-                <button name="rename" type="button" title="{{ _('Rename File/Folder') }}" class="btn btn-sm rename"
+                <button name="rename" type="button" title="{{ _('Rename File/Folder') }}" class="btn btn-sm btn-secondary rename"
                         tabindex="5">
-                    <span class="fa fa-pencil-square-o fa-lg"></span>
+                    <span class="fa fa-pencil-square-o sql-icon-lg"></span>
                 </button>
                 <button name="newfolder" type="button" title="{{ _('Create new folder') }}" value="New Folder"
-                        class="btn btn-sm create" tabindex="8">
-                    <span class="fa fa-folder-open fa-lg"></span>
+                        class="btn btn-sm btn-secondary create" tabindex="8">
+                    <span class="fa fa-folder-open sql-icon-lg"></span>
                 </button>
                 <div class="btn-group" role="group">
                     <button class="ON btn btn-secondary btn-sm grid" type="button" title="{{ _('View as grid') }}" tabindex="9">
-                        <span class="fa fa-th fa-lg"></span>
+                        <span class="fa fa-th sql-icon-lg"></span>
                     </button>
                     <button type="button" class="btn btn-secondary btn-sm list" title="{{ _('View as table') }}" tabindex="10">
-                        <span class="fa fa-list fa-lg"></span>
+                        <span class="fa fa-list sql-icon-lg"></span>
                     </button>
                 </div>
             </div>
diff --git a/web/pgadmin/static/scss/_bootstrap.overrides.scss b/web/pgadmin/static/scss/_bootstrap.overrides.scss
index 8ab15ad51..febe7ad74 100644
--- a/web/pgadmin/static/scss/_bootstrap.overrides.scss
+++ b/web/pgadmin/static/scss/_bootstrap.overrides.scss
@@ -266,7 +266,6 @@ td.switch-cell > div.bootstrap-switch {
 			border: none !important;
 			padding: $tabs-padding;
 			color: $color-fg-theme;
-			font-weight: bold;
 			&.active {
 				border-bottom: $active-border !important;
 				color: $color-primary;
@@ -290,10 +289,11 @@ td.switch-cell > div.bootstrap-switch {
 	margin-right: 0rem;
 	padding-left: 0.5rem !important;
 	padding-right: 1rem !important;
-	min-height: $title-height;
+	min-height: $navbar-height;
 	padding: 0rem;
 	display: flex;
 	align-items: center !important;
+	font-weight: bold;
 }
 
 .navbar-brand:hover {
diff --git a/web/pgadmin/static/scss/_codemirror.overrides.scss b/web/pgadmin/static/scss/_codemirror.overrides.scss
index 70747ced4..f22220174 100644
--- a/web/pgadmin/static/scss/_codemirror.overrides.scss
+++ b/web/pgadmin/static/scss/_codemirror.overrides.scss
@@ -9,6 +9,7 @@
 
 .CodeMirror {
   font-size: 1em;
+  font-family: monospace, monospace;
 }
 
 /* Ensure the codemirror editor displays full height gutters when resized */
diff --git a/web/pgadmin/static/scss/_pgadmin.style.scss b/web/pgadmin/static/scss/_pgadmin.style.scss
index 3e1318488..1ad4b91f0 100644
--- a/web/pgadmin/static/scss/_pgadmin.style.scss
+++ b/web/pgadmin/static/scss/_pgadmin.style.scss
@@ -145,17 +145,16 @@
 
 @media (min-width: 768px) {
   .pg-navbar {
-    height: $title-height;
+    height: $navbar-height;
   }
 
   .pg-docker {
-    top: $title-height !important;
+    top: $navbar-height !important;
   }
 }
 
 .pg-navbar {
   font-size: $navbar-font-size;
-  font-weight: bold;
   padding-left: 0rem;
   padding-right: 0.5rem;
   & .nav-item .nav-link{
@@ -163,7 +162,7 @@
   }
 
   .pg-navbar-brand-arrow {
-    border: $title-height/2 solid $color-fg;
+    border: $navbar-height/2 solid $color-fg;
     border-right-color: transparent;
     border-bottom-color: transparent;
     border-top-color: transparent;
diff --git a/web/pgadmin/static/scss/_webcabin.pgadmin.scss b/web/pgadmin/static/scss/_webcabin.pgadmin.scss
index 79f68ecc6..55e35628c 100644
--- a/web/pgadmin/static/scss/_webcabin.pgadmin.scss
+++ b/web/pgadmin/static/scss/_webcabin.pgadmin.scss
@@ -79,7 +79,6 @@
   color: $color-fg-theme;
   padding: $tabs-padding;
   margin: 0px;
-  font-weight: bold;
 }
 
 .wcFloating {
diff --git a/web/pgadmin/static/scss/resources/_default.variables.scss b/web/pgadmin/static/scss/resources/_default.variables.scss
index 060e915fb..1a263784d 100644
--- a/web/pgadmin/static/scss/resources/_default.variables.scss
+++ b/web/pgadmin/static/scss/resources/_default.variables.scss
@@ -155,7 +155,8 @@ $footer-height-calc: $footer-min-height+$footer-padding*2;
 $navbar-font-size: 0.925rem;
 $navbar-user-font-size: 0.875rem;
 
-$navbar-dropdown-top: 100%;
+$navbar-height: 40px;
+$navbar-dropdown-top: 110%;
 $dropdown-submenu-top: -$dropdown-spacer;
 
 $table-bg: $color-bg-theme;