fix: editable header width (#318)

src/editors/containers/EditorContainer/__snapshots__/index.test.jsx.snap

@@ -45,7 +45,7 @@ exports[`EditorContainer component render snapshot: initialized. enable save and
       className="d-flex flex-row justify-content-between"
     >
       <h2
-        className="h3 d-flex flex-row align-items-center"
+        className="h3 col pl-0"
       >
         <injectIntl(ShimmedIntlComponent)
           isInitialized={true}
@@ -126,7 +126,7 @@ exports[`EditorContainer component render snapshot: not initialized. disable sav
       className="d-flex flex-row justify-content-between"
     >
       <h2
-        className="h3 d-flex flex-row align-items-center"
+        className="h3 col pl-0"
       >
         <injectIntl(ShimmedIntlComponent)
           isInitialized={false}

src/editors/containers/EditorContainer/components/TitleHeader/EditableHeader.jsx

@@ -12,10 +12,7 @@ export const EditableHeader = ({
   localTitle,
   cancelEdit,
 }) => (
-  <Form.Group
-    style={{ width: '90%' }}
-    onBlur={(e) => updateTitle(e)}
-  >
+  <Form.Group onBlur={(e) => updateTitle(e)}>
     <Form.Control
       style={{ paddingInlineEnd: 'calc(1rem + 84px)' }}
       autoFocus

src/editors/containers/EditorContainer/components/TitleHeader/__snapshots__/EditableHeader.test.jsx.snap

@@ -3,11 +3,6 @@
 exports[`EditableHeader snapshot snapshot 1`] = `
 <Form.Group
   onBlur={[Function]}
-  style={
-    Object {
-      "width": "90%",
-    }
-  }
 >
   <Form.Control
     autoFocus={true}

src/editors/containers/EditorContainer/components/TitleHeader/__snapshots__/index.test.jsx.snap

@@ -12,7 +12,7 @@ exports[`TitleHeader snapshots editing 1`] = `
 
 exports[`TitleHeader snapshots initialized 1`] = `
 <div
-  className="d-flex flex-row align-items-center"
+  className="d-flex flex-row align-items-center mt-1"
 >
   <Truncate>
     <Component />

src/editors/containers/EditorContainer/components/TitleHeader/index.jsx

@@ -46,7 +46,7 @@ export const TitleHeader = ({
     );
   }
   return (
-    <div className="d-flex flex-row align-items-center">
+    <div className="d-flex flex-row align-items-center mt-1">
       <Truncate>
         {title}
       </Truncate>

src/editors/containers/EditorContainer/index.jsx

@@ -48,12 +48,9 @@ export const EditorContainer = ({
       </BaseModal>
       <ModalDialog.Header className="shadow-sm zindex-10">
         <div className="d-flex flex-row justify-content-between">
-          <h2
-            className="h3 d-flex flex-row align-items-center"
-          >
+          <h2 className="h3 col pl-0">
             <TitleHeader isInitialized={isInitialized} />
           </h2>
-
           <IconButton
             src={Close}
             iconAs={Icon}