feat(about): add new knowledge icons

mateusfg7 · Jun 6, 2024 · 0567011 · 0567011
1 parent c5567fa
commit 0567011
Show file tree

Hide file tree

Showing 11 changed files with 619 additions and 35 deletions.
diff --git a/src/app/about/sections/knowledge/knowledge-categories.tsx b/src/app/about/sections/knowledge/knowledge-categories.tsx
@@ -50,7 +50,14 @@ import {
   MicrosoftOfficeIcon,
   OnlyOfficeIcon,
   ThunderbirdIcon,
-  FastApiIcon
+  FastApiIcon,
+  GitIcon,
+  GithubActionsIcon,
+  VSCodeIcon,
+  CodespacesIcon,
+  GitpodIcon,
+  VimIcon,
+  GlpiIcon
 } from '~/components/icons'
 
 type IconType = (props: SVGProps<SVGSVGElement>) => JSX.Element
@@ -302,7 +309,7 @@ export const knowledgeCategories: {
     ]
   },
   {
-    title: 'Infrastructure and DevOps',
+    title: 'Infrastructure and cloud',
     knowledgeList: [
       {
         title: 'Heroku',
@@ -334,12 +341,6 @@ export const knowledgeCategories: {
         icon: AWSIcon,
         color: '#232F3E'
       },
-      {
-        title: 'Github',
-        status: 'god',
-        icon: GithubIcon,
-        color: '#181717'
-      },
       {
         title: 'Vercel',
         status: 'god',
@@ -367,25 +368,56 @@ export const knowledgeCategories: {
     ]
   },
   {
-    title: 'Design',
+    title: 'Misc Tools',
     knowledgeList: [
       {
-        title: 'Figma',
+        title: 'GIT',
         status: 'god',
-        icon: FigmaIcon,
-        color: '#F24E1E'
+        icon: GitIcon,
+        color: '#F34F29'
       },
       {
-        title: 'Photoshop',
+        title: 'Github',
         status: 'god',
-        icon: PhotoShopIcon,
-        color: '#31A8FF'
-      }
-    ]
-  },
-  {
-    title: 'Office',
-    knowledgeList: [
+        icon: GithubIcon,
+        color: '#181717'
+      },
+      {
+        title: 'Github Actions',
+        status: 'god',
+        icon: GithubActionsIcon,
+        color: '#2088ff'
+      },
+      {
+        title: 'VSCode',
+        status: 'god',
+        icon: VSCodeIcon,
+        color: '#0065A9'
+      },
+      {
+        title: 'Codespaces',
+        status: 'god',
+        icon: CodespacesIcon,
+        color: '#181717'
+      },
+      {
+        title: 'GitPod',
+        status: 'god',
+        icon: GitpodIcon,
+        color: '#ff8a00'
+      },
+      {
+        title: 'Vim',
+        status: 'god',
+        icon: VimIcon,
+        color: '#019833'
+      },
+      {
+        title: 'GLPI',
+        status: 'bad',
+        icon: GlpiIcon,
+        color: '#01A4F7'
+      },
       {
         title: 'Google Workspace',
         status: 'god',
@@ -415,6 +447,18 @@ export const knowledgeCategories: {
         status: 'god',
         icon: WindowsIcon,
         color: '#0078D6'
+      },
+      {
+        title: 'Figma',
+        status: 'god',
+        icon: FigmaIcon,
+        color: '#F24E1E'
+      },
+      {
+        title: 'Photoshop',
+        status: 'god',
+        icon: PhotoShopIcon,
+        color: '#31A8FF'
       }
     ]
   }

diff --git a/src/components/icons/index.tsx b/src/components/icons/index.tsx
@@ -51,3 +51,10 @@ export { ThunderbirdIcon } from './svgs/thunderbird'
 export { ViteIcon } from './svgs/vite'
 export { MarkdownIcon } from './svgs/markdown'
 export { FastApiIcon } from './svgs/fastapi'
+export { GitIcon } from './svgs/git'
+export { GithubActionsIcon } from './svgs/github-actions'
+export { VSCodeIcon } from './svgs/vscode'
+export { GitpodIcon } from './svgs/gitpod'
+export { CodespacesIcon } from './svgs/codespaces'
+export { VimIcon } from './svgs/vim'
+export { GlpiIcon } from './svgs/glpi'
diff --git a/src/components/icons/svgs/codespaces.tsx b/src/components/icons/svgs/codespaces.tsx
@@ -0,0 +1,62 @@
+import { SVGProps } from 'react'
+
+export function CodespacesIcon(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg width="1em" height="1em" viewBox="0 0 128 128" {...props}>
+      <defs>
+        <linearGradient
+          id="codespaces_a"
+          x1="11.622"
+          x2="11.622"
+          y1="7.023"
+          y2="13.825"
+          gradientTransform="translate(.5 .592) scale(7.9375)"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop offset="0" stop-color="#0196CA"></stop>
+          <stop offset="1" stop-color="#0065A9"></stop>
+        </linearGradient>
+        <linearGradient
+          id="codespaces_b"
+          x1="11.622"
+          x2="11.622"
+          y1="8.675"
+          y2="15.977"
+          gradientTransform="translate(.5 .592) scale(7.9375)"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop offset="0" stop-color="#01A7DE"></stop>
+          <stop offset="1" stop-color="#007ACC"></stop>
+        </linearGradient>
+        <linearGradient
+          id="codespaces_c"
+          x1="14.594"
+          x2="14.594"
+          y1="7.023"
+          y2="15.977"
+          gradientTransform="translate(.5 .592) scale(7.9375)"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop offset="0" stop-color="#2EC2F6"></stop>
+          <stop offset="1" stop-color="#1F9CF0"></stop>
+        </linearGradient>
+      </defs>
+      <path
+        fill="#24292e"
+        d="M.5 64.092C.5 29.008 28.916.592 64 .592c29.601 0 54.457 20.23 61.501 47.625h-24.065a25.436 25.436 0 0 0-3.305-4.524c.635-1.588 2.857-8.097-.635-16.828 0 0-5.318-1.747-17.462 6.508-5.08-1.428-10.478-2.143-15.875-2.143s-10.795.715-15.875 2.143c-12.144-8.175-17.462-6.508-17.462-6.508-3.493 8.73-1.27 15.24-.635 16.828-4.048 4.445-6.509 10.16-6.509 17.066 0 17.057 7.281 24.836 16.51 28.507v12.959c-3.492-.284-7.264-1.992-10.16-6.858-1.19-1.905-4.762-6.588-9.763-6.51-5.318.08-2.143 3.017.08 4.208 2.698 1.508 5.794 7.143 6.508 8.97 1.024 2.878 3.903 7.87 13.335 8.162v12.767C16.906 113.541.501 90.788.501 64.093z"
+      ></path>
+      <path
+        fill="url(#codespaces_a)"
+        d="m124.97 63.867-14.719-7.087a4.45 4.45 0 0 0-5.077.863l-46.2 39.965a2.977 2.977 0 0 0 .003 4.402l7.904 7.547a2.977 2.977 0 0 0 3.801.169l40.941-31.744 9.647-10.638c.988-1.09 2.1-2.382 3.563-2.23 1.412.148 2.665 1.31 2.665 2.946v-.17a4.465 4.465 0 0 0-2.528-4.023z"
+      ></path>
+      <path
+        fill="url(#codespaces_b)"
+        d="m124.97 119.88-14.719 7.087a4.449 4.449 0 0 1-5.077-.863l-46.2-43.933a2.977 2.977 0 0 1 .003-4.403l7.904-7.546a2.977 2.977 0 0 1 3.801-.17l40.941 35.713 9.647 10.639c.988 1.09 2.1 2.382 3.563 2.23 1.413-.149 2.665-1.311 2.665-2.947v.171a4.465 4.465 0 0 1-2.528 4.023z"
+      ></path>
+      <path
+        fill="url(#codespaces_c)"
+        d="M110.25 126.97a4.451 4.451 0 0 1-5.078-.864c1.648 1.647 6.45.48 6.45-1.85V59.494c0-2.33-4.802-3.497-6.45-1.85a4.452 4.452 0 0 1 5.078-.863l14.717 5.093a4.465 4.465 0 0 1 2.53 4.023v51.956c0 1.716-.984 3.28-2.53 4.024z"
+      ></path>
+    </svg>
+  )
+}
diff --git a/src/components/icons/svgs/git.tsx b/src/components/icons/svgs/git.tsx
@@ -0,0 +1,12 @@
+import { SVGProps } from 'react'
+
+export function GitIcon(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg width="1em" height="1em" viewBox="0 0 128 128" {...props}>
+      <path
+        fill="#F34F29"
+        d="M124.737 58.378L69.621 3.264c-3.172-3.174-8.32-3.174-11.497 0L46.68 14.71l14.518 14.518c3.375-1.139 7.243-.375 9.932 2.314 2.703 2.706 3.461 6.607 2.294 9.993l13.992 13.993c3.385-1.167 7.292-.413 9.994 2.295 3.78 3.777 3.78 9.9 0 13.679a9.673 9.673 0 01-13.683 0 9.677 9.677 0 01-2.105-10.521L68.574 47.933l-.002 34.341a9.708 9.708 0 012.559 1.828c3.778 3.777 3.778 9.898 0 13.683-3.779 3.777-9.904 3.777-13.679 0-3.778-3.784-3.778-9.905 0-13.683a9.65 9.65 0 013.167-2.11V47.333a9.581 9.581 0 01-3.167-2.111c-2.862-2.86-3.551-7.06-2.083-10.576L41.056 20.333 3.264 58.123a8.133 8.133 0 000 11.5l55.117 55.114c3.174 3.174 8.32 3.174 11.499 0l54.858-54.858a8.135 8.135 0 00-.001-11.501z"
+      ></path>
+    </svg>
+  )
+}
diff --git a/src/components/icons/svgs/github-actions.tsx b/src/components/icons/svgs/github-actions.tsx
@@ -0,0 +1,16 @@
+import { SVGProps } from 'react'
+
+export function GithubActionsIcon(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg width="1em" height="1em" viewBox="0 0 128 128" {...props}>
+      <path
+        fill="#2088ff"
+        d="M26.666 0C11.97 0 0 11.97 0 26.666c0 12.87 9.181 23.651 21.334 26.13v37.87c0 11.77 9.68 21.334 21.332 21.334h.195c1.302 9.023 9.1 16 18.473 16C71.612 128 80 119.612 80 109.334s-8.388-18.668-18.666-18.668c-9.372 0-17.17 6.977-18.473 16h-.195c-8.737 0-16-7.152-16-16V63.779a18.514 18.514 0 0 0 13.24 5.555h2.955c1.303 9.023 9.1 16 18.473 16 9.372 0 17.169-6.977 18.47-16h11.057c1.303 9.023 9.1 16 18.473 16 10.278 0 18.666-8.39 18.666-18.668C128 56.388 119.612 48 109.334 48c-9.373 0-17.171 6.977-18.473 16H79.805c-1.301-9.023-9.098-16-18.471-16s-17.171 6.977-18.473 16h-2.955c-6.433 0-11.793-4.589-12.988-10.672 14.58-.136 26.416-12.05 26.416-26.662C53.334 11.97 41.362 0 26.666 0zm0 5.334A21.292 21.292 0 0 1 48 26.666 21.294 21.294 0 0 1 26.666 48 21.292 21.292 0 0 1 5.334 26.666 21.29 21.29 0 0 1 26.666 5.334zm-5.215 7.541C18.67 12.889 16 15.123 16 18.166v17.043c0 4.043 4.709 6.663 8.145 4.533l13.634-8.455c3.257-2.02 3.274-7.002.032-9.045l-13.635-8.59a5.024 5.024 0 0 0-2.725-.777zm-.117 5.291 13.635 8.588-13.635 8.455V18.166zm40 35.168a13.29 13.29 0 0 1 13.332 13.332A13.293 13.293 0 0 1 61.334 80 13.294 13.294 0 0 1 48 66.666a13.293 13.293 0 0 1 13.334-13.332zm48 0a13.29 13.29 0 0 1 13.332 13.332A13.293 13.293 0 0 1 109.334 80 13.294 13.294 0 0 1 96 66.666a13.293 13.293 0 0 1 13.334-13.332zm-42.568 6.951a2.667 2.667 0 0 0-1.887.78l-6.3 6.294-2.093-2.084a2.667 2.667 0 0 0-3.771.006 2.667 2.667 0 0 0 .008 3.772l3.974 3.96a2.667 2.667 0 0 0 3.766-.001l8.185-8.174a2.667 2.667 0 0 0 .002-3.772 2.667 2.667 0 0 0-1.884-.78zm48 0a2.667 2.667 0 0 0-1.887.78l-6.3 6.294-2.093-2.084a2.667 2.667 0 0 0-3.771.006 2.667 2.667 0 0 0 .008 3.772l3.974 3.96a2.667 2.667 0 0 0 3.766-.001l8.185-8.174a2.667 2.667 0 0 0 .002-3.772 2.667 2.667 0 0 0-1.884-.78zM61.334 96a13.293 13.293 0 0 1 13.332 13.334 13.29 13.29 0 0 1-13.332 13.332A13.293 13.293 0 0 1 48 109.334 13.294 13.294 0 0 1 61.334 96zM56 105.334c-2.193 0-4 1.807-4 4 0 2.195 1.808 4 4 4s4-1.805 4-4c0-2.193-1.807-4-4-4zm10.666 0c-2.193 0-4 1.807-4 4 0 2.195 1.808 4 4 4s4-1.805 4-4c0-2.193-1.807-4-4-4zM56 108c.75 0 1.334.585 1.334 1.334 0 .753-.583 1.332-1.334 1.332-.75 0-1.334-.58-1.334-1.332 0-.75.585-1.334 1.334-1.334zm10.666 0c.75 0 1.334.585 1.334 1.334 0 .753-.583 1.332-1.334 1.332-.75 0-1.332-.58-1.332-1.332 0-.75.583-1.334 1.332-1.334z"
+      ></path>
+      <path
+        fill="#79b8ff"
+        d="M109.334 90.666c-9.383 0-17.188 6.993-18.477 16.031a2.667 2.667 0 0 0-.265-.011l-2.7.09a2.667 2.667 0 0 0-2.578 2.751 2.667 2.667 0 0 0 2.752 2.578l2.7-.087a2.667 2.667 0 0 0 .097-.006C92.17 121.029 99.965 128 109.334 128c10.278 0 18.666-8.388 18.666-18.666s-8.388-18.668-18.666-18.668zm0 5.334a13.293 13.293 0 0 1 13.332 13.334 13.29 13.29 0 0 1-13.332 13.332A13.293 13.293 0 0 1 96 109.334 13.294 13.294 0 0 1 109.334 96z"
+      ></path>
+    </svg>
+  )
+}
diff --git a/src/components/icons/svgs/gitpod.tsx b/src/components/icons/svgs/gitpod.tsx
@@ -0,0 +1,36 @@
+import { SVGProps } from 'react'
+
+export function GitpodIcon(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg width="1em" height="1em" viewBox="0 0 128 128" {...props}>
+      <defs>
+        <linearGradient
+          id="gitpod_gradient"
+          gradientUnits="userSpaceOnUse"
+          x1="60.966"
+          y1="13.48"
+          x2="19.202"
+          y2="78.93"
+          gradientTransform="matrix(1.58024 0 0 1.42222 0 .61)"
+        >
+          <stop
+            offset="0"
+            style={{ stopColor: '#ffb45b', stopOpacity: 1 }}
+          ></stop>
+          <stop
+            offset="1"
+            style={{ stopColor: '#ff8a00', stopOpacity: 1 }}
+          ></stop>
+        </linearGradient>
+      </defs>
+      <path
+        style={{
+          fill: 'url(#gitpod_gradient)',
+          stroke: 'none',
+          fillRule: 'evenodd'
+        }}
+        d="M76.047 6.922c3.8 6.008 1.488 13.66-5.164 17.094L29.52 45.356c-1.098.566-1.77 1.613-1.77 2.75v33.507c0 1.137.672 2.188 1.77 2.75l32.726 16.887a3.857 3.857 0 0 0 3.508 0L98.48 84.363c1.098-.562 1.77-1.613 1.77-2.75V60.777L70.816 75.77c-6.671 3.398-15.132 1.27-18.898-4.754-3.766-6.024-1.41-13.664 5.266-17.067l42.113-21.453C112.129 25.961 128 34.328 128 47.63v36.527c0 8.555-5.078 16.453-13.305 20.7L77.102 124.25c-8.118 4.188-18.086 4.188-26.204 0l-37.593-19.395C5.078 100.61 0 92.711 0 84.156v-38.59c0-8.554 5.078-16.457 13.305-20.699L57.117 2.262c6.653-3.43 15.125-1.344 18.93 4.66Zm0 0"
+      ></path>
+    </svg>
+  )
+}