Add more skill

src/assets/DATA.ts

@@ -18,7 +18,7 @@ const Felix = {
         },
         {
             skillName: "C++",
-            skillLevel: 50,
+            skillLevel: 70,
         },
         {
             skillName: "Admin Système",
@@ -26,11 +26,23 @@ const Felix = {
         },
         {
             skillName: "Python",
-            skillLevel: 50,
+            skillLevel: 75,
         },
         {
             skillName: "PHP",
             skillLevel: 60,
+        },
+        {
+            skillName: "HTML/CSS",
+            skillLevel: 85,
+        },
+        {
+            skillName: "JS/TS",
+            skillLevel: 85,
+        },
+        {
+            skillName: "Linux",
+            skillLevel: 75,
         }
     ],
     projects: [

src/components/SkillCard.tsx

@@ -1,6 +1,6 @@
 // @ts-ignore
 import React from 'react';
-import { FaCuttlefish, FaPhp, FaPython, FaServer} from 'react-icons/fa';
+import {FaCuttlefish, FaHtml5, FaJs, FaLinux, FaPhp, FaPython, FaServer} from 'react-icons/fa';
 //@ts-ignore
 import ProgresBar from "./ProgresBar.tsx";
 
@@ -12,6 +12,9 @@ const iconMapping = {
     "Admin Système": <FaServer className={iconClassName} />,
     "Python": <FaPython className={iconClassName} />,
     "PHP": <FaPhp className={iconClassName} />,
+    "HTML/CSS": <FaHtml5 className={iconClassName} />,
+    "JS/TS": <FaJs className={iconClassName} />,
+    "Linux": <FaLinux className={iconClassName} />
 };
 
 interface SkillCardProps {

src/components/Skills.tsx

@@ -5,7 +5,7 @@ import SkillCard from './SkillCard.tsx';
 
 function Skills({skills}) {
     return(
-        <div className="flex flex-col sm:flex-row align-center justify-center max-w-2xl mx-auto mt-8 gap-5">
+        <div className="flex flex-col sm:flex-row align-center justify-center max-w-8xl mx-auto mt-8 gap-5 flex-wrap">
             {skills.map((skill) => {
                 return (
                     <SkillCard skillName={skill.skillName} skillLevel={skill.skillLevel}/>