remove text-muted icon from btn-page-item-control

packages/app/src/components/Sidebar/PageTree/Item.tsx

@@ -451,7 +451,7 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
           >
             {/* pass the color property to reactstrap dropdownToggle props. https://6-4-0--reactstrap.netlify.app/components/dropdowns/  */}
             <DropdownToggle color="transparent" className="border-0 rounded btn-page-item-control p-0 grw-visible-on-hover mr-1">
-              <i className="icon-options fa fa-rotate-90 text-muted p-1"></i>
+              <i className="icon-options fa fa-rotate-90 p-1"></i>
             </DropdownToggle>
           </PageItemControl>
           <button
@@ -459,7 +459,7 @@ const Item: FC<ItemProps> = (props: ItemProps) => {
             className="border-0 rounded btn btn-page-item-control p-0 grw-visible-on-hover"
             onClick={onClickPlusButton}
           >
-            <i className="icon-plus text-muted d-block p-0" />
+            <i className="icon-plus d-block p-0" />
           </button>
         </div>
       </li>

packages/app/src/styles/theme/_apply-colors.scss

@@ -712,6 +712,7 @@ mark.rbt-highlight-text {
 
 // Page Management Dropdown icon
 .btn-page-item-control {
+  color: $gray-500;
   &:hover,
   &:focus {
     background-color: rgba($color-link, 0.15);