custom modal header close icon (#7240)

* seahub custom modal header

* add custom modal header

* special modal use custom close

frontend/src/components/common/seahub-modal-header.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { ModalHeader } from 'reactstrap';
+import '../../css/seahub-modal-header.css';
+
+const SeahubModalHeader = ({ children, ...props }) => {
+  const customCloseBtn = (
+    <button type="button" className="close seahub-modal-close" data-dismiss="modal" aria-label="Close" onClick={props.toggle}>
+      <span className="seahub-modal-close-inner">
+        <i className="sf3-font sf3-font-x-01" aria-hidden="true"></i>
+      </span>
+    </button>
+  );
+  return (
+    <ModalHeader {...props} close={customCloseBtn}>
+      {children}
+    </ModalHeader>
+  );
+};
+
+export default SeahubModalHeader;