Initial commit

src/components/Heading/index.js

@@ -0,0 +1,32 @@
+import Tagline from "../Tagline/index.js";
+
+const Heading = ({
+    className,
+    textAlignClassName,
+    tagClassName,
+    tag,
+    titleLarge,
+    title,
+    textLarge,
+    text,
+    children,
+}) => (
+    <div
+        className={`max-w-[50rem] mx-auto mb-12 ${
+            textAlignClassName || "md:text-center"
+        } lg:mb-20 ${className || ""}`}
+    >
+        {tag && (
+            <Tagline className={`mb-4 md:justify-center ${tagClassName || ""}`}>
+                {tag}
+            </Tagline>
+        )}
+        {titleLarge && <h1 className="h1 text-n-1">{titleLarge}</h1>}
+        {title && <h2 className="h2 text-n-1">{title}</h2>}
+        {textLarge && <p className="h5 mt-6 text-n-2">{textLarge}</p>}
+        {text && <p className="body-2 mt-4 text-n-2">{text}</p>}
+        {children}
+    </div>
+);
+
+export default Heading;