feat: add blog (#320)

components/Header/index.tsx

@@ -4,7 +4,13 @@ import Image from 'next/image'
 import { Language } from './Language'
 import { SwitchTheme } from './SwitchTheme'
 
-export const Header: React.FC = () => {
+export interface HeaderProps {
+  showLanguage?: boolean
+}
+
+export const Header: React.FC<HeaderProps> = (props) => {
+  const { showLanguage = false } = props
+
   return (
     <header className='bg-white sticky top-0 z-50 flex w-full justify-between px-6 py-2 border-b-2 border-gray-600 dark:border-gray-400 dark:bg-black'>
       <Link href='/'>
@@ -23,7 +29,17 @@ export const Header: React.FC = () => {
         </a>
       </Link>
       <div className='flex justify-between'>
-        <Language />
+        <div className='flex flex-col justify-center items-center px-6'>
+          <Link href='/blog'>
+            <a
+              data-cy='header-blog-link'
+              className='text-yellow dark:text-yellow-dark hover:underline'
+            >
+              Blog
+            </a>
+          </Link>
+        </div>
+        {showLanguage && <Language />}
         <SwitchTheme />
       </div>
     </header>

components/Interests/index.tsx

@@ -22,6 +22,12 @@ export const Interests: React.FC = () => {
         })}
         <InterestsList />
       </div>
+
+      <style jsx global>{`
+        #__next {
+          display: block;
+        }
+      `}</style>
     </>
   )
 }