diff --git a/frontend/src/components/repo-list-view/repo-list-item.js b/frontend/src/components/repo-list-view/repo-list-item.js
index d0dd69f94c..eda75ebcd9 100644
--- a/frontend/src/components/repo-list-view/repo-list-item.js
+++ b/frontend/src/components/repo-list-view/repo-list-item.js
@@ -108,10 +108,10 @@ class RepoListItem extends React.Component {
 
     const share = <a href="#" className={shareIconClassName} title={gettext("Share")} onClick={this.share}></a>;
     const unshare = <a href="#" className={unshareIconClassName} title={gettext("Unshare")} onClick={this.unshare}></a>
+    const deleteOperation = <a href="#" className={deleteIconClassName} title={gettext('Delete')} onClick={this.deleteItem}></a>;
 
     const shareDropdownItem = <DropdownItem onClick={this.share}>{gettext('Share')}</DropdownItem>;
     const unshareDropdownItem = <DropdownItem onClick={this.unshare}>{gettext('Unshare')}</DropdownItem>;
-
     if (isPro) {
       if (repo.owner_email.indexOf('@seafile_group') != -1) { // group owned repo
         if (isStaff) {
@@ -119,7 +119,7 @@ class RepoListItem extends React.Component {
             desktopOperations = (
               <Fragment>
                 {share}
-                <a href="#" className={deleteIconClassName} title={gettext('Delete')} onClick={this.deleteItem}></a>
+                {deleteOperation}
                 <Dropdown isOpen={this.state.isOperationShow} toggle={this.toggleOperationMenu}>
                   {commonToggle}
                   <DropdownMenu>
@@ -170,7 +170,7 @@ class RepoListItem extends React.Component {
     }
 
     const mobileOperations = (
-      <Dropdown isOpen={this.state.isOperationShow} toggle={this.toggleOperationMenu}>
+      <Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
         {commonToggle}
         <div className={`${this.state.isItemMenuShow?'':'d-none'}`} onClick={this.toggleOperationMenu}>
           <div className="mobile-operation-menu-bg-layer"></div>
diff --git a/media/css/seahub_react.css b/media/css/seahub_react.css
index 62d00ac20a..90029ba071 100644
--- a/media/css/seahub_react.css
+++ b/media/css/seahub_react.css
@@ -80,10 +80,10 @@
 .sf2-icon-move:before {content:"\e029"}
 .sf2-icon-menu:before { content: "\e031"; }
 .sf2-icon-more:before { content: "\e032"; }
+.sf2-icon-x3:before {content:"\e035";}
 .sf2-icon-close:before { content:"\e035"; }
 .sf2-icon-two-columns:before { content:"\e036"; }
 .sf2-icon-tag:before {content:"\e037"}
-.sf2-icon-x3:before {content:"\e035";}
 
 /* common class and element style*/
 a { color:#eb8205; }