Merge pull request #71 from Codeon-org/dev

Dev

Author: MrAnyx

.eslintrc.js

@@ -14,5 +14,6 @@ module.exports = {
   rules: {
     "prettier/prettier": "error",
     "no-unused-vars": "off",
+    "vue/multi-word-component-names": "off",
   },
 };

.github/workflows/cd.yml

@@ -19,7 +19,7 @@ jobs:
         uses: actions/checkout@master
 
       - name: Setup node env
-        uses: actions/setup-node@v2.1.2
+        uses: actions/setup-node@v2.5.1
         with:
           node-version: ${{ matrix.node }}
 

.github/workflows/ci.yml

@@ -24,13 +24,13 @@ jobs:
         uses: actions/checkout@master
 
       - name: Setup node env 🏗
-        uses: actions/setup-node@v2.4.1
+        uses: actions/setup-node@v2.5.1
         with:
           node-version: ${{ matrix.node }}
           check-latest: true
 
       - name: Cache node_modules 📦
-        uses: actions/cache@v2.1.6
+        uses: actions/cache@v2.1.7
         with:
           path: ~/.npm
           key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}

.prettierrc

@@ -1,4 +1,5 @@
 {
   "semi": true,
-  "singleQuote": false
+  "singleQuote": false,
+  "endOfLine": "lf"
 }

components/Footer.vue

@@ -4,32 +4,40 @@
       <a href="https://github.com/MrAnyx" target="_blank"
         ><eva-icon name="github-outline" class="icon"></eva-icon
       ></a>
+
       <a href="https://twitter.com/MrAnyx" target="_blank"
         ><eva-icon name="twitter-outline" class="icon"></eva-icon>
       </a>
+
       <a
         href="https://www.linkedin.com/in/robin-bidanchon-62020119a/"
         target="_blank"
         ><eva-icon name="linkedin-outline" class="icon"></eva-icon>
       </a>
+
       <a href="https://www.instagram.com/rob.bch/" target="_blank"
         ><eva-icon name="camera-outline" class="icon"></eva-icon>
       </a>
+
       <a href="mailto:robin@codeon.fr" target="_blank"
         ><eva-icon name="at-outline" class="icon"></eva-icon>
       </a>
     </div>
+
     <div id="footer-credits">
       Made with <a href="https://nuxtjs.org/" class="accent">NuxtJS</a>
+
       <br />
 
       Licensed under
+
       <a
         href="https://github.com/Codeon-org/codeon.fr/blob/master/LICENSE"
         class="accent"
         target="_blank"
         >CC-BY-SA-4.0</a
       >
+
       © {{ year }} <nuxt-link to="/" class="accent">Codeon</nuxt-link>
     </div>
   </div>
@@ -42,6 +50,7 @@ export default {
       year: 2021,
     };
   },
+
   mounted() {
     this.year = new Date().getFullYear();
   },
@@ -51,35 +60,50 @@ export default {
 <style lang="scss" scoped>
 #footer-wrapper {
   margin-top: 75px;
+
   height: 140px;
+
   display: flex;
+
   align-items: center;
+
   flex-direction: column;
 
   & #footer-links {
     display: flex;
+
     justify-content: center;
+
     align-items: center;
+
     column-gap: 12px;
 
     & a {
       color: $light;
+
       text-decoration: none;
+
       padding: 8px 8px 4px 8px;
+
       border-radius: 6px;
+
       transition: background-color 0.12s ease-in-out;
 
       &:hover {
         background-color: $semi-dark-transparent;
+
         transition: background-color 0.3s ease-in-out;
       }
     }
   }
 
   & #footer-credits {
     text-align: center;
+
     margin-top: 15px;
+
     font-size: 12px;
+
     line-height: 30px;
   }
 }

components/Navbar.vue

@@ -18,27 +18,41 @@ export default {
       links: [
         {
           icon: "🏡",
+
           text: "Home",
+
           link: "/",
         },
+
         {
           icon: "📚",
+
           text: "Blog",
+
           link: "/blog",
         },
+
         {
           icon: "💡",
+
           text: "Projects",
+
           link: "/projects",
         },
+
         {
           icon: "💻",
+
           text: "Tools",
+
           link: "/tools",
         },
+
         {
           icon: "📝",
+
           text: "About",
+
           link: "/about",
         },
       ],
@@ -50,17 +64,29 @@ export default {
 <style lang="scss" scoped>
 #container {
   width: 100%;
+
   height: 70px;
+
   background-color: $dark-transparent;
+
   backdrop-filter: blur(10px);
+
   position: fixed;
+
   z-index: 5;
+
   top: 0;
+
   left: 0;
+
   display: flex;
+
   flex-direction: row;
+
   justify-content: center;
+
   align-items: center;
+
   column-gap: 12px;
 
   @include xs-screen {
@@ -69,20 +95,28 @@ export default {
 
   & a {
     color: $light;
+
     text-decoration: none;
+
     font-size: 16px;
+
     padding: 8px 12px;
+
     border-radius: 6px;
+
     transition: background-color 0.12s ease-in-out;
 
     @include xs-screen {
       font-size: 14px;
+
       padding: 6px 8px;
+
       border-radius: 4px;
     }
 
     &:hover {
       background-color: $semi-dark-transparent;
+
       transition: background-color 0.3s ease-in-out;
     }
 
@@ -95,10 +129,12 @@ export default {
 
   & a.active {
     color: $accent;
+
     transition: background-color 0.3s ease-in-out;
 
     &:hover {
       background-color: $accent-semi-transparent;
+
       transition: background-color 0.3s ease-in-out;
     }
   }

data/tools.js

@@ -80,6 +80,11 @@ const tools = [
         description:
           "Simply the best tool to organize projects, ideas, meetings, ...",
       },
+      {
+        name: "Standard Notes",
+        link: "https://standardnotes.com/",
+        description: "A secure note taking app.",
+      },
       {
         name: "Pomotroid",
         link: "https://splode.github.io/pomotroid/",
@@ -122,9 +127,9 @@ const tools = [
         description: "Organize conversations, communities, servers, ...",
       },
       {
-        name: "Mailspring",
-        link: "https://getmailspring.com/",
-        description: "Beautiful email client.",
+        name: "Thunderbird",
+        link: "https://www.thunderbird.net/fr/",
+        description: "Customizable email client.",
       },
       {
         name: "Signal",
@@ -193,8 +198,8 @@ const tools = [
     anchor: "design",
     items: [
       {
-        name: "Adobe XD",
-        link: "https://www.adobe.com/products/xd.html",
+        name: "Figma",
+        link: "https://www.figma.com/",
         description: "Excellent for creation and prototyping.",
       },
       {
@@ -240,6 +245,11 @@ const tools = [
         description:
           "Allow you to use windows and linux at the same time. Best of both worlds.",
       },
+      {
+        name: "Docker",
+        link: "https://www.docker.com/",
+        description: "Accelerate the way to build apps.",
+      },
       {
         name: "TablePlus",
         link: "https://www.tableplus.io/",
@@ -378,6 +388,11 @@ const tools = [
         link: "https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-wsl",
         description: "Develop a project on WSL using VSCode.",
       },
+      {
+        name: "Docker",
+        link: "https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-docker",
+        description: "Create a complete development environment.",
+      },
       {
         name: "Vetur",
         link: "https://marketplace.visualstudio.com/items?itemName=octref.vetur",
@@ -399,11 +414,6 @@ const tools = [
         link: "https://www.javascript.com/",
         description: "Dynamize websites",
       },
-      {
-        name: "Typescript",
-        link: "https://www.typescriptlang.org/",
-        description: "Create stable apps with types",
-      },
       {
         name: "PHP",
         link: "https://www.php.net/",
@@ -428,7 +438,12 @@ const tools = [
       {
         name: "Symfony",
         link: "https://symfony.com/",
-        description: "To create websites with a string PHP backend.",
+        description: "To create websites with a strong PHP backend.",
+      },
+      {
+        name: "Laravel",
+        link: "https://laravel.com/",
+        description: "A very pleasant backend framework.",
       },
       {
         name: "VueJS",