Migrate to Next

components/HeaderLogo.js

@@ -0,0 +1,26 @@
+import React, { useEffect, useState } from "react";
+import classnames from "classnames";
+import { Heading, Text } from ".";
+import styles from "./HeaderLogo.module.css";
+import { LogoArrowsSvg } from "../icons";
+
+export default function HeaderLogo({ transition }) {
+  const [visible, setVisible] = useState(!transition);
+  useEffect(() => transition && setVisible(true), [transition]);
+  return (
+    <div className={classnames(styles.block, { [styles.isvisible]: visible })}>
+      <div className={styles.top}>
+        <LogoArrowsSvg />
+      </div>
+      <div className={styles.middle}>
+        <Heading>ABC Project Design Ltd</Heading>
+        <Text size="lg" noMargin>
+          Easy as ABC
+        </Text>
+      </div>
+      <div className={styles.bottom}>
+        <LogoArrowsSvg />
+      </div>
+    </div>
+  );
+}