diff --git a/www/js/my.full.js b/www/js/my.full.js
index dad5f587d5..eb48fe75d2 100644
--- a/www/js/my.full.js
+++ b/www/js/my.full.js
@@ -829,8 +829,8 @@ function toggleFold(form, unfoldIdList, objectID, objectType)
     if($parentTd.length == 0) return false;
 
     var toggleClass = objectType == 'product' ? 'story-toggle' : 'task-toggle';
-    var nameClass   = objectType == 'product' ? 'c-title'      : 'c-name';
-    $form.find('th.' + nameClass).append("<button type='button' id='toggleFold' class='btn btn-mini collapsed'>" + unfoldAll + "</button>");
+    var nameClass   = objectType == 'product' ? 'c-title' : 'c-name';
+    $form.find('th.' + nameClass).addClass('flex-between').append("<span id='toggleFold' class='collapsed'><i  class='icon icon-angle-double-right'></i></span>");
 
     var allUnfold = true;
     $parentTd.each(function()
@@ -843,7 +843,7 @@ function toggleFold(form, unfoldIdList, objectID, objectType)
         $(this).find('a.' + toggleClass).addClass('collapsed')
     })
 
-    $form.find('th.' + nameClass + ' #toggleFold').html(allUnfold ? foldAll : unfoldAll).toggleClass('collapsed', !allUnfold);
+    $form.find('th.' + nameClass + ' #toggleFold').toggleClass('collapsed', !allUnfold);
 
     $(document).on('click', '#toggleFold', function()
     {
@@ -858,7 +858,7 @@ function toggleFold(form, unfoldIdList, objectID, objectType)
             newUnfoldID.push(dataID);
         })
 
-        $(this).html(collapsed ? foldAll : unfoldAll).toggleClass('collapsed', !collapsed);
+        $(this).toggleClass('collapsed', !collapsed);
         url = createLink('misc', 'ajaxSetUnfoldID', 'objectID=' + objectID + '&objectType=' + objectType + '&action=' + (collapsed ? 'add' : 'delete'));
         $.post(url, {'newUnfoldID': JSON.stringify(newUnfoldID)});
     });
diff --git a/www/theme/default/style.css b/www/theme/default/style.css
index ffb8f774ab..68f74aa79f 100644
--- a/www/theme/default/style.css
+++ b/www/theme/default/style.css
@@ -118,11 +118,6 @@ body.xxc-embed.m-productplan-view,body.xxc-embed.m-bug-browse,body.xxc-embed.m-p
 #downloadMobile .dropdown-menu .mobile-version {text-align: center;}
 #downloadMobile .dropdown-menu .mobile-version span {color: #0c64eb; font-size: 12px; font-weight: 700;}
 
-/* #mainMenu > .btn-toolBar .btn-link .label-light,
-#mainMenu > .btn-toolbar .btn-link .label-light {color: #203362; background: #fff;}
-#mainMenu > .btn-toolBar .btn-active-text,
-#mainMenu > .btn-toolbar .btn-active-text {background: #E6EAF1;} */
-
 #programTableList > tr:hover {background: #E6F0FF; opacity: 0.8;}
 #programTableList > tr[data-type="project"] > .c-name:hover > a {color: #1E6AEB !important;}
 #programTableList > tr[data-type="project"] > .c-name > a {color: #2463c7 !important;}
@@ -131,3 +126,13 @@ body.xxc-embed.m-productplan-view,body.xxc-embed.m-bug-browse,body.xxc-embed.m-p
 #projectForm .c-name .label-danger,
 #executionTableList .c-name .label-danger,
 #programTableList .c-name .label-danger {position: absolute; right: 10px; padding: 2px 4px;}
+
+
+.flex-between {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+#toggleFold > .icon {display: inline-block; transition: transform .2s; transform: rotate(-90deg);}
+#toggleFold.collapsed > .icon {transform: rotate(90deg);}
+