test(e2e): header should always be visible (sticky)

components/Interests/index.tsx

@@ -15,19 +15,11 @@ export const Interests: React.FC = () => {
   )
 
   return (
-    <>
     <div className='max-w-full'>
       {paragraphs.map((paragraph, index) => {
         return <InterestParagraph key={index} {...paragraph} />
       })}
       <InterestsList />
     </div>
-
-      <style jsx global>{`
-        #__next {
-          display: block;
-        }
-      `}</style>
-    </>
   )
 }

components/Profile/ProfileDescriptionBottom.tsx

@@ -14,7 +14,7 @@ export const ProfileDescriptionBottom: React.FC = () => {
             href='/curriculum-vitae.html'
             className='text-yellow hover:underline dark:text-yellow-dark'
           >
-            Mon Curriculum vitæ
+            Curriculum vitæ
           </a>
         </>
       )}

cypress/integration/common/Header.spec.ts

@@ -8,6 +8,10 @@ describe('Common > Header', () => {
       .should('eq', '/blog')
   })
 
+  it('should always be visible (sticky header)', () => {
+    cy.scrollTo('bottom').get('header').should('be.visible')
+  })
+
   describe('Switch theme color (dark/light)', () => {
     it('should switch theme from `dark` (default) to `light`', () => {
       cy.get('[data-cy=switch-theme-dark]').should('be.visible')

posts/clean-code.mdx

@@ -2,7 +2,7 @@
 title: '🧼 Clean Code'
 description: 'What is "Clean Code", what are "Design Patterns", and why is it so important today ? Tips and tricks to make your code more readable and maintainable in the long term.'
 isPublished: true
-publishedOn: '2021-11-06T22:06:33.818Z'
+publishedOn: '2022-02-23T08:00:18.758Z'
 ---
 
 Hello! 👋

posts/hello-world.mdx

@@ -2,7 +2,7 @@
 title: '👋 Hello, world!'
 description: 'First post of the blog, introduction and explanation of how this blog is made.'
 isPublished: true
-publishedOn: '2021-10-06T22:06:33.818Z'
+publishedOn: '2022-02-20T08:00:18.758Z'
 ---
 
 Hello, world! 👋

styles/global.css

@@ -2,10 +2,6 @@
 @tailwind components;
 @tailwind utilities;
 
-#__next {
-  @apply flex h-screen flex-col;
-}
-
 .prose {
   @apply !max-w-4xl text-gray dark:text-gray-300;
 }