chore(release): 1.3.6 [skip ci]

Co-authored-by: Divlo <contact@divlo.fr>

.github/workflows/Divlo.yml

@@ -116,11 +116,11 @@ jobs:
           persist-credentials: false
 
       - name: 'Import GPG key'
-        uses: 'crazy-max/ghaction-import-gpg@v3.2.0'
+        uses: 'crazy-max/ghaction-import-gpg@v4'
         with:
-          gpg-private-key: ${{ secrets.GPG_PRIVATE_KEY }}
+          gpg_private_key: ${{ secrets.GPG_PRIVATE_KEY }}
-          git-user-signingkey: true
+          git_user_signingkey: true
-          git-commit-gpgsign: true
+          git_commit_gpgsign: true
 
       - name: 'Use Node.js'
         uses: 'actions/setup-node@v2.4.0'

components/Header/SwitchTheme.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react'
+import { useEffect, useState } from 'react'
 import { useTheme } from 'next-themes'
 
 export const SwitchTheme: React.FC = () => {
@@ -20,25 +20,35 @@ export const SwitchTheme: React.FC = () => {
   return (
     <>
       <div
-        className='toggle-button'
+        className='flex items-center'
         data-cy='switch-theme-click'
         onClick={handleClick}
       >
-        <div className='toggle-theme-button'>
+        <div className='toggle-theme-button relative cursor-pointer bg-transparent inline-block'>
           <div className='toggle-track'>
-            <div data-cy='switch-theme-dark' className='toggle-track-check'>
+            <div
-              <span className='toggle_Dark'>🌜</span>
+              data-cy='switch-theme-dark'
+              className='toggle-track-check absolute'
+            >
+              <span className='toggle_Dark flex justify-center items-center relative'>
+                🌜
+              </span>
             </div>
-            <div data-cy='switch-theme-light' className='toggle-track-x'>
+            <div
-              <span className='toggle_Light'>🌞</span>
+              data-cy='switch-theme-light'
+              className='toggle-track-x absolute'
+            >
+              <span className='toggle_Light flex justify-center items-center relative'>
+                🌞
+              </span>
             </div>
           </div>
-          <div className='toggle-thumb' />
+          <div className='toggle-thumb absolute' />
           <input
             data-cy='switch-theme-input'
             type='checkbox'
             aria-label='Dark mode toggle'
-            className='toggle-screenreader-only'
+            className='toggle-screenreader-only absolute overflow-hidden'
             defaultChecked
           />
         </div>
@@ -46,16 +56,8 @@ export const SwitchTheme: React.FC = () => {
 
       <style jsx>
         {`
-          .toggle-button {
-            display: flex;
-            align-items: center;
-          }
           .toggle-theme-button {
             touch-action: pan-x;
-            display: inline-block;
-            position: relative;
-            cursor: pointer;
-            background-color: transparent;
             border: 0;
             padding: 0;
             user-select: none;
@@ -70,7 +72,6 @@ export const SwitchTheme: React.FC = () => {
             color: #fff;
           }
           .toggle-track-check {
-            position: absolute;
             width: 14px;
             height: 10px;
             top: 0;
@@ -83,7 +84,6 @@ export const SwitchTheme: React.FC = () => {
             transition: opacity 0.25s ease;
           }
           .toggle-track-x {
-            position: absolute;
             width: 10px;
             height: 10px;
             top: 0;
@@ -96,15 +96,10 @@ export const SwitchTheme: React.FC = () => {
           }
           .toggle_Dark,
           .toggle_Light {
-            align-items: center;
-            display: flex;
             height: 10px;
-            justify-content: center;
-            position: relative;
             width: 10px;
           }
           .toggle-thumb {
-            position: absolute;
             left: ${theme === 'dark' ? '27px' : '0px'};
             width: 22px;
             height: 22px;
@@ -121,9 +116,7 @@ export const SwitchTheme: React.FC = () => {
             clip: rect(0 0 0 0);
             height: 1px;
             margin: -1px;
-            overflow: hidden;
             padding: 0;
-            position: absolute;
             width: 1px;
           }
         `}

locales/en/home.json

@@ -4,7 +4,7 @@
     "description": "Developer Full Stack Junior • Passionate about High-Tech",
     "birthDate": "Birth date",
     "nationality": "Nationality",
-    "descriptionBottom": "I am self-taught in Computer Science by following online trainings. <0/> <0/> I put into practice everything I learn and make many projects."
+    "descriptionBottom": "I am self-taught in Computer Science by following online trainings and I am also a student at the university following the French training \"BUT Informatique\" (first year). <0/> <0/> I put into practice everything I learn and make many projects."
   },
   "interests": {
     "title": "Interests",

locales/fr/home.json

@@ -4,7 +4,7 @@
     "description": "Développeur Full Stack Junior • Passionné de High-Tech",
     "birthDate": "Date de naissance",
     "nationality": "Nationalité",
-    "descriptionBottom": "Je me forme en autodidacte dans l'informatique en suivant des formations en ligne. <0/> <0/> Je mets en pratique tout ce que j'apprends et réalise de nombreux projets."
+    "descriptionBottom": "Je me forme en autodidacte dans l'informatique en suivant des formations en ligne et je suis aussi un étudiant à l'université suivant la formation \"BUT Informatique\" (première année). <0/> <0/> Je mets en pratique tout ce que j'apprends et réalise de nombreux projets."
   },
   "interests": {
     "title": "Intérêts",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "divlo",
-  "version": "1.3.5",
+  "version": "1.3.6",
   "private": true,
   "repository": {
     "type": "git",
@@ -36,7 +36,7 @@
     "@fortawesome/free-solid-svg-icons": "5.15.4",
     "@fortawesome/react-fontawesome": "0.1.15",
     "classnames": "2.3.1",
-    "html-react-parser": "1.2.8",
+    "html-react-parser": "1.3.0",
     "next": "11.1.2",
     "next-pwa": "5.3.1",
     "next-themes": "0.0.15",
@@ -44,7 +44,7 @@
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "read-pkg": "7.0.0",
-    "sharp": "0.29.0",
+    "sharp": "0.29.1",
     "universal-cookie": "4.0.4"
   },
   "devDependencies": {
@@ -52,15 +52,15 @@
     "@commitlint/config-conventional": "13.1.0",
     "@lhci/cli": "0.8.1",
     "@saithodev/semantic-release-backmerge": "1.5.3",
-    "@semantic-release/git": "9.0.0",
+    "@semantic-release/git": "9.0.1",
     "@testing-library/jest-dom": "5.14.1",
     "@testing-library/react": "12.0.0",
     "@types/jest": "27.0.1",
-    "@types/node": "16.7.10",
+    "@types/node": "16.9.0",
-    "@types/react": "17.0.19",
+    "@types/react": "17.0.20",
-    "@typescript-eslint/eslint-plugin": "4.30.0",
+    "@typescript-eslint/eslint-plugin": "4.31.0",
-    "autoprefixer": "10.3.3",
+    "autoprefixer": "10.3.4",
-    "babel-jest": "27.1.0",
+    "babel-jest": "27.1.1",
     "cypress": "8.3.1",
     "dockerfilelint": "1.8.0",
     "editorconfig-checker": "4.0.2",
@@ -74,15 +74,15 @@
     "eslint-plugin-promise": "5.1.0",
     "eslint-plugin-unicorn": "35.0.0",
     "husky": "7.0.2",
-    "jest": "27.1.0",
+    "jest": "27.1.1",
     "lint-staged": "11.1.2",
     "markdownlint-cli": "0.28.1",
     "next-secure-headers": "2.2.0",
     "postcss": "8.3.6",
     "prettier": "2.3.2",
     "semantic-release": "17.4.7",
-    "start-server-and-test": "1.13.1",
+    "start-server-and-test": "1.14.0",
-    "tailwindcss": "2.2.9",
+    "tailwindcss": "2.2.14",
     "typescript": "4.4.2",
     "vercel": "23.1.2"
   }

pages/_app.tsx

@@ -13,7 +13,7 @@ const universalCookie = new UniversalCookie()
 /** how long in seconds, until the cookie expires (10 years) */
 const COOKIE_MAX_AGE = 10 * 365.25 * 24 * 60 * 60
 
-const MyApp = ({ Component, pageProps }: AppProps): JSX.Element => {
+const Application = ({ Component, pageProps }: AppProps): JSX.Element => {
   const { lang } = useTranslation()
 
   useEffect(() => {
@@ -30,4 +30,4 @@ const MyApp = ({ Component, pageProps }: AppProps): JSX.Element => {
   )
 }
 
-export default MyApp
+export default Application

pages/_document.tsx

@@ -1,31 +1,15 @@
-import Document, {
+import { Html, Head, Main, NextScript } from 'next/document'
-  Html,
-  Head,
-  Main,
-  NextScript,
-  DocumentContext,
-  DocumentInitialProps
-} from 'next/document'
 
-class MyDocument extends Document {
+const Document: React.FC = () => {
-  static async getInitialProps(
+  return (
-    context: DocumentContext
+    <Html>
-  ): Promise<DocumentInitialProps> {
+      <Head />
-    const initialProps = await Document.getInitialProps(context)
+      <body className='bg-white dark:bg-black text-black dark:text-white font-headline'>
-    return initialProps
+        <Main />
-  }
+        <NextScript />
-
+      </body>
-  render(): JSX.Element {
+    </Html>
-    return (
+  )
-      <Html>
-        <Head />
-        <body className='bg-white dark:bg-black text-black dark:text-white font-headline'>
-          <Main />
-          <NextScript />
-        </body>
-      </Html>
-    )
-  }
 }
 
-export default MyDocument
+export default Document