<div style="margin: 20px 80px 60px 80px"></div>
<center>
  <div style="margin: 0px 80px 0px 80px; max-width: 800px;">
    <h1>Title</h1>
    <div>
      <textarea id="editor"></textarea>
    </div>
  </div>
</center>

h1 {
  text-align: left;
  color: grey;
  margin: 0;
}
div.editor {
  margin: 0;
}

const MediumStoryConfig = {
  selector: "#editor",
  plugins: "autoresize quickbars image media table hr paste",
  skin: "snow",
  icons: "thin",
  menubar: false,
  toolbar: false,
  content_style: "@import url('https://fonts.googleapis.com/css2?family=Tinos&display=swap'); body { font-family: 'Tinos', serif; font-size: 16pt; color: #292929; }",
  placeholder: "Tell your story...",
  quickbars_selection_toolbar: "bold italic link | h1 h2 | blockquote",
  quickbars_insert_toolbar: "image media table hr"
};

const MediumHeadlineConfig = {
  selector: "h1",
  plugins: "autoresize quickbars emoticons image media table hr paste",
  skin: "snow",
  icons: "thin",
  menubar: false,
  inline: true,
  toolbar: false,
  content_style: "@import url('https://fonts.googleapis.com/css2?family=Tinos&display=swap'); body { font-family: 'Tinos', serif; font-size: 16pt; color: #292929; }",
  placeholder: "Title"
};

tinymce.init(MediumHeadlineConfig);
tinymce.init(MediumStoryConfig)