rename class and apply color and border

src/client/js/components/PageAccessoriesModal.jsx

@@ -22,15 +22,13 @@ const PageAccessoriesModal = (props) => {
       size="lg"
       isOpen={props.isOpen}
       toggle={props.onClose}
-      className="grw-create-page"
+      className="grw-page-accessories-modal"
     >
       <ModalBody>
-        <ul className="nav">
+        <ul className="nav border-bottom">
           <li className="nav-item">
             <a className={`nav-link ${props.isActive === 'pageList' && 'active'}`} href="#">
-              <PageList
-                className="mx-5"
-              />
+              <PageList />
               ページリスト
             </a>
           </li>

src/client/styles/scss/_layout_growi.scss

@@ -22,6 +22,12 @@
     }
   }
 
+  .grw-page-accessories-modal {
+    .table-top-icon {
+      margin-right: 5px;
+    }
+  }
+
   .revision-toc {
     position: sticky;
     // growisubnavigation + grw-navbar-boder

src/client/styles/scss/theme/_apply-colors.scss

@@ -253,6 +253,16 @@ pre:not(.hljs):not(.CodeMirror-line) {
   }
 }
 
+.grw-page-accessories-modal {
+  .table-top-icon {
+    fill: $color-link;
+  }
+  .active {
+    border-bottom: 2px solid $color-link;
+  }
+  
+}
+
 /*
  * cards
  */