remove unnecessary react fragments

components/NoteTitle/NoteTitle.module.css

@@ -0,0 +1,26 @@
+.title {
+  margin: 0.3em 0 0.5em -0.03em;
+  font-size: 2.1em;
+  line-height: 1.3;
+  font-weight: 700;
+}
+
+.title a {
+  background: none;
+  padding-bottom: 0;
+  color: inherit;
+}
+
+.title code {
+  font-size: 1em;
+  background: none !important;
+  border: 0 !important;
+  margin: 0 0.075em !important;
+  padding: 0 !important;
+}
+
+@media screen and (max-width: 768px) {
+  .title {
+    font-size: 1.8em;
+  }
+}

components/NoteTitle/NoteTitle.tsx

@@ -0,0 +1,16 @@
+import Link from "next/link";
+import type { NoteMetaType } from "../../types";
+
+import styles from "./NoteTitle.module.css";
+
+type Props = Pick<NoteMetaType, "slug" | "htmlTitle">;
+
+const NoteTitle = ({ slug, htmlTitle }: Props) => (
+  <h1 className={styles.title}>
+    <Link href={`/notes/${slug}/`}>
+      <a dangerouslySetInnerHTML={{ __html: htmlTitle }} />
+    </Link>
+  </h1>
+);
+
+export default NoteTitle;