diff --git a/public/less/admin/manage/categories.less b/public/less/admin/manage/categories.less
index b925fd64234c..8350b574c895 100644
--- a/public/less/admin/manage/categories.less
+++ b/public/less/admin/manage/categories.less
@@ -22,7 +22,7 @@ div.categories {
 			}
 		}
 		> li {
-			margin: @acp-base-line 0;
+			margin: 16px 0 24px 0;
 
 			&.placeholder {
 				border: 1px dashed #2196F3;
@@ -37,7 +37,7 @@ div.categories {
 		li {
 			min-height: 0;
 			display: inline;
-			margin: 0 @acp-margin 0 0;
+			margin: 0 16px 0 0;
 			left: 0;
 		}
 	}
@@ -93,7 +93,7 @@ div.categories {
 
 	.category-header {
 		margin-top: 0;
-		margin-bottom: @acp-base-line;
+		margin-bottom: 8px;
 	}
 
 	.description {
diff --git a/public/less/admin/vars.less b/public/less/admin/vars.less
index e888af0b9678..dda7ed1fe8d4 100644
--- a/public/less/admin/vars.less
+++ b/public/less/admin/vars.less
@@ -1,6 +1,3 @@
-@acp-base-line: 8px;
-@acp-line-height: @acp-base-line * 6;
-@acp-margin: @acp-base-line * 2;
 // system font family
 // based on those in [bootstrap@5.0.0-alpha1](https://github.com/twbs/bootstrap/blob/b531bda07cbea2e124194aefe3b8597b3ac2578e/scss/_variables.scss#L386)
 // and [wordpress admin](https://core.trac.wordpress.org/browser/trunk/src/wp-admin/css/common.css?rev=47835#L220)
diff --git a/public/src/admin/manage/categories.js b/public/src/admin/manage/categories.js
index 521716c8e491..cae9f782ca75 100644
--- a/public/src/admin/manage/categories.js
+++ b/public/src/admin/manage/categories.js
@@ -42,7 +42,7 @@ define('admin/manage/categories', [
 
 		$('.categories').on('click', '.toggle', function () {
 			const el = $(this);
-			el.find('i').toggleClass('fa-minus').toggleClass('fa-plus');
+			el.find('i').toggleClass('fa-chevron-down').toggleClass('fa-chevron-right');
 			el.closest('[data-cid]').find('> ul[data-cid]').toggleClass('hidden');
 		});
 
@@ -84,7 +84,7 @@ define('admin/manage/categories', [
 
 		function toggleAll(expand) {
 			const el = $('.categories .toggle');
-			el.find('i').toggleClass('fa-minus', expand).toggleClass('fa-plus', !expand);
+			el.find('i').toggleClass('fa-chevron-down', expand).toggleClass('fa-chevron-right', !expand);
 			el.closest('[data-cid]').find('> ul[data-cid]').toggleClass('hidden', !expand);
 		}
 	};
@@ -207,6 +207,20 @@ define('admin/manage/categories', [
 
 			if (isCategoryUpdate) {
 				modified[cid].parentCid = newCategoryId;
+
+				// Show/hide expand buttons after drag completion
+				const oldParentCid = parseInt(e.from.getAttribute('data-cid'), 10);
+				const newParentCid = parseInt(e.to.getAttribute('data-cid'), 10);
+				if (oldParentCid !== newParentCid) {
+					document.querySelector(`.categories li[data-cid="${newParentCid}"] .toggle`).classList.toggle('hide', false);
+
+					const children = document.querySelectorAll(`.categories li[data-cid="${oldParentCid}"] ul[data-cid] li[data-cid]`);
+					if (!children.length) {
+						document.querySelector(`.categories li[data-cid="${oldParentCid}"] .toggle`).classList.toggle('hide', true);
+					}
+
+					e.item.dataset.parentCid = newParentCid;
+				}
 			}
 
 			newCategoryId = -1;
@@ -251,6 +265,12 @@ define('admin/manage/categories', [
 			}, function (html) {
 				container.append(html);
 
+				// Disable expand toggle
+				if (!categories.length) {
+					const toggleEl = container.get(0).querySelector('.toggle');
+					toggleEl.classList.toggle('hide', true);
+				}
+
 				// Handle and children categories in this level have
 				for (let x = 0, numCategories = categories.length; x < numCategories; x += 1) {
 					renderList(categories[x].children, $('li[data-cid="' + categories[x].cid + '"]'), categories[x]);
diff --git a/src/views/admin/partials/categories/category-rows.tpl b/src/views/admin/partials/categories/category-rows.tpl
index f138e8c3e55f..7df4bd7c45d5 100644
--- a/src/views/admin/partials/categories/category-rows.tpl
+++ b/src/views/admin/partials/categories/category-rows.tpl
@@ -5,7 +5,7 @@
             <div class="col-md-9">
                 <div class="clearfix">
                     <div class="toggle">
-                        <i class="fa fa-minus"></i>
+                        <i class="fa fa-chevron-down"></i>
                     </div>
                     <div class="information">
                         <div class="icon" style="
@@ -56,5 +56,4 @@
     </li>
 	{{{ end }}}
 <!-- END categories -->
-<li class="children-placeholder"></li>
 </ul>