add refactoring note on top of page

client/src/components/Header/Header.module.css

@@ -13,3 +13,17 @@
   background: transparent;
   color: var(--blue12);
 }
+
+.note {
+  text-align: center;
+  background-color: var(--blue2);
+  padding: 0.9em 0;
+  font-size: 0.7em;
+  width: 100%;
+  color: var(--blue12);
+}
+
+.note a {
+  color: var(--blue11);
+  text-decoration: underline;
+}

client/src/components/Header/Header.tsx

@@ -29,6 +29,14 @@ const Header = () => {
   }
 
   return (
+    <>
+      <div className={styles.note}>
+        This project is currently undergoing a major refactor & redesign. (
+        <a href="https://github.com/nizewn/chessu/pull/4" target="_blank" rel="noreferrer">
+          #4
+        </a>
+        )
+      </div>
       <header className={styles.header}>
         <Link to="/" className={styles.title}>
           chessu
@@ -41,6 +49,7 @@ const Header = () => {
           {darkTheme ? <SunIcon /> : <MoonIcon />}
         </button>
       </header>
+    </>
   );
 };