feat(Pagination/ManuscriptDetailsTop/AddUser): Use custom icons instead of feather library

packages/component-faraday-ui/src/Pagination.js

@@ -22,37 +22,40 @@ const PaginationComponent = ({
     </Text>
     <TextInput onChange={changeItemsPerPage} value={itemsPerPage} />
     <Chevrons
-      className="arrow-left"
+      className="arrow-end-left"
       hide={page === 0}
       iconSize={2}
       onClick={toFirst}
-      pr={0.6}
+      pb={0.5}
+      pr={2}
+      pl={1}
     />
     <Chevrons
-      className="arrow-left"
+      className="carat-right"
       hide={page === 0}
       iconSize={2}
       onClick={prevPage}
-      pr={0.8}
+      pb={0.5}
+      pr={2}
     />
     <Label>{`${page * itemsPerPage + 1} to ${
       hasMore ? itemsPerPage * (page + 1) : maxItems
     }`}</Label>
     <Chevrons
-      className="arrow-right"
+      className="carat-left"
       hide={!hasMore}
       iconSize={2}
       onClick={nextPage}
       pb={0.5}
-      pl={1}
+      pl={2}
     />
     <Chevrons
-      className="arrow-right"
+      className="arrow-end-right"
       hide={!hasMore}
       iconSize={2}
       onClick={toLast}
       pb={0.5}
-      pl={0.6}
+      pl={2}
     />
   </Root>
 )

packages/component-faraday-ui/src/manuscriptDetails/ManuscriptDetailsTop.js

@@ -41,7 +41,7 @@ const ManuscriptDetailsTop = ({
       {canOverrideTechChecks && (
         <ActionLink
           data-test-id="button-qa-manuscript-technical-checks"
-          icon="check-square"
+          fontIcon="technical-checks"
           onClick={goToTechnicalCheck(collection)}
           pr={2}
         >
@@ -51,7 +51,7 @@ const ManuscriptDetailsTop = ({
       {canEditManuscript && (
         <ActionLink
           data-test-id="button-qa-manuscript-edit"
-          fontIcon="editIcon"
+          fontIcon="dashboard-edit"
           onClick={goToEdit(collection, fragment)}
           pr={2}
         >

packages/components-faraday/src/components/Admin/AddUser.js

@@ -21,7 +21,12 @@ const AddUser = ({ edit, journal, handleSubmit, ...rest }) => (
   >
     {showModal =>
       edit ? (
-        <IconButton icon="edit-2" iconSize={2} onClick={showModal} pt={1 / 2} />
+        <IconButton
+          fontIcon="editIcon"
+          iconSize={2}
+          onClick={showModal}
+          pt={1 / 2}
+        />
       ) : (
         <ActionLink icon="plus" onClick={showModal}>
           ADD USER

packages/hindawi-theme/src/fonts/index.css

@@ -104,7 +104,7 @@
   font-family: hindawi-icons, sans-serif;
 }
 
-.more_default::before {
+.more-default::before {
   content: '\e90c';
   font-family: hindawi-icons, sans-serif;
 }
@@ -141,3 +141,37 @@
   font-family: hindawi-icons, sans-serif;
   transform: rotate(180deg);
 }
+
+.dashboard-edit::before {
+  content: '\e904';
+  font-family: hindawi-icons, sans-serif;
+  padding: 0 3px 6px 0;
+}
+
+.arrow-end-left::before {
+  content: "\e912";
+  font-family: hindawi-icons, sans-serif;
+  transform: rotate(180deg);
+}
+
+.arrow-end-right::before {
+  content: "\e912";
+  font-family: hindawi-icons, sans-serif;
+}
+
+.carat-left::before {
+  content: "\e911";
+  font-family: hindawi-icons, sans-serif;
+  transform: rotate(180deg);
+}
+
+.carat-right::before {
+  content: "\e911";
+  font-family: hindawi-icons, sans-serif;
+}
+
+.technical-checks::before {
+  content: "\e913";
+  font-family: hindawi-icons, sans-serif;
+  padding: 0 3px 6px 0;
+}