Add macros for chip, add tasks for creating job and skill

assets/views/website/index.html

@@ -1,4 +1,5 @@
-{% extends "website/base.html" %} {% block content %}
+{% import "website/macros/chip.html" as chip %} {% extends "website/base.html"
+%} {% block content %}
 <div class="w-full mt-8"></div>
 <h3 class="mt-4 mb-2 text-5xl font-bold tracking-tight">Who am I? 🤔</h3>
 <section
@@ -11,17 +12,11 @@
   💾.
 </section>
 <h3 class="mt-4 mb-2 text-5xl font-bold tracking-tight">Skills 🛠️</h3>
-{% for skill in skills %}
-<p
-  class="text-base text-center rounded-2xl font-semibold tracking-tight text-black shadow-lg bg-yellow-400 p-2 min-w-[4rem] max-w-[12rem]"
->
-  {{ skill.name }}
-</p>
-{%endfor%}
+{% for skill in skills %} {{ chip::chip(text=skill.name) }} {%endfor%}
 <section class="flex flex-wrap justify-center w-1/2 gap-4"></section>
 <h3 class="mt-4 mb-2 text-5xl font-bold tracking-tight">Experience 📈</h3>
 {% for job in jobs %}
-<div class="bg-gray-100 rounded-lg p-4 text-black flex flex-col gap-2">
+<div class="flex flex-col gap-2 p-4 text-black bg-gray-100 rounded-lg">
   <h4 class="text-2xl">
     <span class="fas fa-user-circle"></span> {{ job.position }}
   </h4>
@@ -40,13 +35,8 @@
   </h6>
   {% endif %}
   <p class="font-bold"><span class="fas fa-microchip"></span> Technologies</p>
-  {% for technology in job.technologies %}
-  <p
-    class="text-base text-center rounded-2xl font-semibold tracking-tight text-black shadow-lg bg-yellow-400 p-2 min-w-[4rem] max-w-[12rem]"
-  >
-    {{ technology }}
-  </p>
-  {% endfor %}
+  {% for technology in job.technologies %} {{ chip::chip(text=technology.name)
+  }} {% endfor %}
 </div>
 {%endfor%}
 <section class="flex flex-col flex-wrap justify-center gap-4 m-4"></section>