From f5cd79475e73fbc65e82b854eae9dc972c20e053 Mon Sep 17 00:00:00 2001
From: nzambello <nzambello@protonmail.com>
Date: Thu, 1 Jun 2023 17:18:57 +0200
Subject: [PATCH] refactor: cleanup, css fixes, add greeting

---
 src/components/ContactLinks.astro |   1 +
 src/components/Greeting.astro     |   6 ++
 src/components/IconsTech.astro    | 142 ++++++++++++++++--------------
 src/pages/index.astro             |   3 +-
 4 files changed, 86 insertions(+), 66 deletions(-)
 create mode 100644 src/components/Greeting.astro

diff --git a/src/components/ContactLinks.astro b/src/components/ContactLinks.astro
index b79ca9d..e31903b 100644
--- a/src/components/ContactLinks.astro
+++ b/src/components/ContactLinks.astro
@@ -49,6 +49,7 @@
     display: inline-flex;
     justify-content: center;
     align-items: center;
+    margin-bottom: 1rem;
   }
   .contact-links a svg {
     width: 1.5em;
diff --git a/src/components/Greeting.astro b/src/components/Greeting.astro
new file mode 100644
index 0000000..4e9c026
--- /dev/null
+++ b/src/components/Greeting.astro
@@ -0,0 +1,6 @@
+---
+const messages = ['Hi', 'Hello', 'Howdy', 'Hey there']
+const randomMessage = messages[Math.floor(Math.random() * messages.length)]
+---
+
+<h1>{randomMessage}!</h1>
diff --git a/src/components/IconsTech.astro b/src/components/IconsTech.astro
index 2158f2b..1dfc971 100644
--- a/src/components/IconsTech.astro
+++ b/src/components/IconsTech.astro
@@ -1,66 +1,78 @@
-<div class="icons-tech" role="presentation">
-  <figure>
-    <svg viewBox="0 0 128 128" aria-label="css"
-      ><path
-        fill="currentColor"
-        d="m19.67 26 8.069 90.493 36.206 10.05 36.307-10.063L108.33 26H19.67zm69.21 50.488L86.53 98.38l.009 1.875L64 106.55v.001l-.018.015-22.719-6.225L39.726 83h11.141l.79 8.766 12.347 3.295-.004.015v-.032l12.394-3.495L77.702 77H51.795l-.222-2.355-.506-5.647L50.802 66h27.886l1.014-11H37.229l-.223-2.589-.506-6.03L36.235 43h55.597l-.267 3.334-2.685 30.154M89 14.374 81.851 6H89V1H73v4.363L81.39 13H73v5h16zm-19 0L63.193 6H70V1H55v4.363L62.733 13H55v5h15zM52 13h-8V6h8V1H38v17h14z"
-      ></path></svg
-    >
-    <figcaption>CSS</figcaption>
-  </figure>
-  <figure>
-    <svg viewBox="0 0 128 128" aria-label="typescript"
-      ><path
-        fill="currentColor"
-        d="M2 63.91v62.5h125v-125H2zm100.73-5a15.56 15.56 0 0 1 7.82 4.5 20.58 20.58 0 0 1 3 4c0 .16-5.4 3.81-8.69 5.85-.12.08-.6-.44-1.13-1.23a7.09 7.09 0 0 0-5.87-3.53c-3.79-.26-6.23 1.73-6.21 5a4.58 4.58 0 0 0 .54 2.34c.83 1.73 2.38 2.76 7.24 4.86 8.95 3.85 12.78 6.39 15.16 10 2.66 4 3.25 10.46 1.45 15.24-2 5.2-6.9 8.73-13.83 9.9a38.32 38.32 0 0 1-9.52-.1A23 23 0 0 1 80 109.19c-1.15-1.27-3.39-4.58-3.25-4.82a9.34 9.34 0 0 1 1.15-.73l4.6-2.64 3.59-2.08.75 1.11a16.78 16.78 0 0 0 4.74 4.54c4 2.1 9.46 1.81 12.16-.62a5.43 5.43 0 0 0 .69-6.92c-1-1.39-3-2.56-8.59-5-6.45-2.78-9.23-4.5-11.77-7.24a16.48 16.48 0 0 1-3.43-6.25 25 25 0 0 1-.22-8c1.33-6.23 6-10.58 12.82-11.87a31.66 31.66 0 0 1 9.49.26zm-29.34 5.24v5.12H57.16v46.23H45.65V69.26H29.38v-5a49.19 49.19 0 0 1 .14-5.16c.06-.08 10-.12 22-.1h21.81z"
-      ></path></svg
-    >
-    <figcaption>TypeScript</figcaption>
-  </figure>
-  <figure>
-    <svg viewBox="0 0 128 128" aria-label="react"
-      ><g fill="currentColor"
-        ><circle cx="64" cy="64" r="11.4"></circle><path
-          d="M107.3 45.2c-2.2-.8-4.5-1.6-6.9-2.3.6-2.4 1.1-4.8 1.5-7.1 2.1-13.2-.2-22.5-6.6-26.1-1.9-1.1-4-1.6-6.4-1.6-7 0-15.9 5.2-24.9 13.9-9-8.7-17.9-13.9-24.9-13.9-2.4 0-4.5.5-6.4 1.6-6.4 3.7-8.7 13-6.6 26.1.4 2.3.9 4.7 1.5 7.1-2.4.7-4.7 1.4-6.9 2.3C8.2 50 1.4 56.6 1.4 64s6.9 14 19.3 18.8c2.2.8 4.5 1.6 6.9 2.3-.6 2.4-1.1 4.8-1.5 7.1-2.1 13.2.2 22.5 6.6 26.1 1.9 1.1 4 1.6 6.4 1.6 7.1 0 16-5.2 24.9-13.9 9 8.7 17.9 13.9 24.9 13.9 2.4 0 4.5-.5 6.4-1.6 6.4-3.7 8.7-13 6.6-26.1-.4-2.3-.9-4.7-1.5-7.1 2.4-.7 4.7-1.4 6.9-2.3 12.5-4.8 19.3-11.4 19.3-18.8s-6.8-14-19.3-18.8zM92.5 14.7c4.1 2.4 5.5 9.8 3.8 20.3-.3 2.1-.8 4.3-1.4 6.6-5.2-1.2-10.7-2-16.5-2.5-3.4-4.8-6.9-9.1-10.4-13 7.4-7.3 14.9-12.3 21-12.3 1.3 0 2.5.3 3.5.9zM81.3 74c-1.8 3.2-3.9 6.4-6.1 9.6-3.7.3-7.4.4-11.2.4-3.9 0-7.6-.1-11.2-.4-2.2-3.2-4.2-6.4-6-9.6-1.9-3.3-3.7-6.7-5.3-10 1.6-3.3 3.4-6.7 5.3-10 1.8-3.2 3.9-6.4 6.1-9.6 3.7-.3 7.4-.4 11.2-.4 3.9 0 7.6.1 11.2.4 2.2 3.2 4.2 6.4 6 9.6 1.9 3.3 3.7 6.7 5.3 10-1.7 3.3-3.4 6.6-5.3 10zm8.3-3.3c1.5 3.5 2.7 6.9 3.8 10.3-3.4.8-7 1.4-10.8 1.9 1.2-1.9 2.5-3.9 3.6-6 1.2-2.1 2.3-4.2 3.4-6.2zM64 97.8c-2.4-2.6-4.7-5.4-6.9-8.3 2.3.1 4.6.2 6.9.2 2.3 0 4.6-.1 6.9-.2-2.2 2.9-4.5 5.7-6.9 8.3zm-18.6-15c-3.8-.5-7.4-1.1-10.8-1.9 1.1-3.3 2.3-6.8 3.8-10.3 1.1 2 2.2 4.1 3.4 6.1 1.2 2.2 2.4 4.1 3.6 6.1zm-7-25.5c-1.5-3.5-2.7-6.9-3.8-10.3 3.4-.8 7-1.4 10.8-1.9-1.2 1.9-2.5 3.9-3.6 6-1.2 2.1-2.3 4.2-3.4 6.2zM64 30.2c2.4 2.6 4.7 5.4 6.9 8.3-2.3-.1-4.6-.2-6.9-.2-2.3 0-4.6.1-6.9.2 2.2-2.9 4.5-5.7 6.9-8.3zm22.2 21-3.6-6c3.8.5 7.4 1.1 10.8 1.9-1.1 3.3-2.3 6.8-3.8 10.3-1.1-2.1-2.2-4.2-3.4-6.2zM31.7 35c-1.7-10.5-.3-17.9 3.8-20.3 1-.6 2.2-.9 3.5-.9 6 0 13.5 4.9 21 12.3-3.5 3.8-7 8.2-10.4 13-5.8.5-11.3 1.4-16.5 2.5-.6-2.3-1-4.5-1.4-6.6zM7 64c0-4.7 5.7-9.7 15.7-13.4 2-.8 4.2-1.5 6.4-2.1 1.6 5 3.6 10.3 6 15.6-2.4 5.3-4.5 10.5-6 15.5C15.3 75.6 7 69.6 7 64zm28.5 49.3c-4.1-2.4-5.5-9.8-3.8-20.3.3-2.1.8-4.3 1.4-6.6 5.2 1.2 10.7 2 16.5 2.5 3.4 4.8 6.9 9.1 10.4 13-7.4 7.3-14.9 12.3-21 12.3-1.3 0-2.5-.3-3.5-.9zM96.3 93c1.7 10.5.3 17.9-3.8 20.3-1 .6-2.2.9-3.5.9-6 0-13.5-4.9-21-12.3 3.5-3.8 7-8.2 10.4-13 5.8-.5 11.3-1.4 16.5-2.5.6 2.3 1 4.5 1.4 6.6zm9-15.6c-2 .8-4.2 1.5-6.4 2.1-1.6-5-3.6-10.3-6-15.6 2.4-5.3 4.5-10.5 6-15.5 13.8 4 22.1 10 22.1 15.6 0 4.7-5.8 9.7-15.7 13.4z"
-        ></path></g
-      ></svg
-    >
-    <figcaption>React</figcaption>
-  </figure>
-  <figure>
-    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 297" aria-label="remix"
-      ><path
-        fill="currentColor"
-        d="M141.675 0C218.047 0 256 36.35 256 94.414c0 43.43-26.707 71.753-62.785 76.474c30.455 6.137 48.259 23.604 51.54 58.065l.474 6.337l.415 5.924l.358 5.542l.249 4.179l.267 4.93l.138 2.814l.198 4.47l.159 4.222l.079 2.427l.107 3.888l.092 4.446l.033 2.148l.06 6.226l.02 6.496v3.885h-78.758l.004-1.62l.028-3.147l.047-3.065l.136-7.424l.035-2.489l.027-3.902l-.004-2.496l-.023-2.617l-.032-2.054l-.064-2.876l-.094-3.05l-.125-3.242l-.16-3.455l-.096-1.813l-.16-2.833l-.186-2.976l-.287-4.204l-.247-3.342a116.56 116.56 0 0 0-.247-3.02l-.202-1.934c-2.6-22.827-11.655-32.157-27.163-35.269l-1.307-.245a60.184 60.184 0 0 0-2.704-.408l-1.397-.164c-.236-.025-.472-.05-.71-.073l-1.442-.127l-1.471-.103l-1.502-.081l-1.514-.058l-1.544-.039l-1.574-.018L0 198.74V136.9h127.62c2.086 0 4.108-.04 6.066-.12l1.936-.095l1.893-.122l1.85-.15c.305-.028.608-.056.909-.086l1.785-.193a86.3 86.3 0 0 0 3.442-.475l1.657-.28c20.709-3.755 31.063-14.749 31.063-36.2c0-24.075-16.867-38.666-50.602-38.666H0V0h141.675ZM83.276 250.785c10.333 0 14.657 5.738 16.197 11.23l.203.79l.167.782l.109.617l.046.306l.078.603l.058.59l.023.29l.031.569l.01.278l.008.54v29.507H0v-46.102h83.276Z"
-      ></path></svg
-    >
-    <figcaption>Remix</figcaption>
-  </figure>
-  <figure>
-    <svg aria-label="plone" viewBox="0 0 41 41" fill="none" xmlns="http://www.w3.org/2000/svg">
-      <g clip-path="url(#clip0_1_2)">
-        <path
-          d="M17.717 15.963C20.1482 15.963 22.119 13.9922 22.119 11.561C22.119 9.12984 20.1482 7.159 17.717 7.159C15.2858 7.159 13.315 9.12984 13.315 11.561C13.315 13.9922 15.2858 15.963 17.717 15.963Z"
-          fill="#0083BE"></path>
-        <path
-          d="M31.069 20.355C31.069 22.791 29.1 24.756 26.669 24.756C24.239 24.756 22.269 22.786 22.269 20.355C22.269 17.922 24.247 15.957 26.669 15.957C29.101 15.954 31.069 17.924 31.069 20.355Z"
-          fill="#0083BE"></path>
-        <path
-          d="M17.702 33.578C20.1331 33.578 22.104 31.6071 22.104 29.176C22.104 26.7448 20.1331 24.774 17.702 24.774C15.2708 24.774 13.3 26.7448 13.3 29.176C13.3 31.6071 15.2708 33.578 17.702 33.578Z"
-          fill="#0083BE"></path>
-        <path
-          d="M20.343 0C9.108 0.001 0.001 9.107 0 20.343C0.001 31.577 9.105 40.684 20.343 40.686C31.578 40.684 40.684 31.582 40.686 20.343C40.684 9.107 31.578 0.001 20.343 0ZM31.792 31.792C28.854 34.726 24.816 36.534 20.341 36.535C15.862 36.534 11.828 34.723 8.891 31.792C5.958 28.854 4.15 24.816 4.149 20.343C4.15 15.865 5.96 11.83 8.892 8.893C11.83 5.959 15.864 4.151 20.342 4.15C24.82 4.151 28.855 5.962 31.792 8.893C34.727 11.831 36.534 15.869 36.536 20.343C36.535 24.819 34.726 28.854 31.792 31.792Z"
-          fill="#0083BE"></path>
-      </g>
-      <defs>
-        <clipPath id="clip0_1_2">
-          <rect width="40.686" height="40.686" fill="white"></rect>
-        </clipPath>
-      </defs>
-    </svg>
-    <figcaption>Plone</figcaption>
-  </figure>
-</div>
+<section>
+  <h2>My tech stack</h2>
+  <div class="icons-tech" role="presentation">
+    <figure>
+      <svg viewBox="0 0 128 128" aria-label="css"
+        ><path
+          fill="currentColor"
+          d="m19.67 26 8.069 90.493 36.206 10.05 36.307-10.063L108.33 26H19.67zm69.21 50.488L86.53 98.38l.009 1.875L64 106.55v.001l-.018.015-22.719-6.225L39.726 83h11.141l.79 8.766 12.347 3.295-.004.015v-.032l12.394-3.495L77.702 77H51.795l-.222-2.355-.506-5.647L50.802 66h27.886l1.014-11H37.229l-.223-2.589-.506-6.03L36.235 43h55.597l-.267 3.334-2.685 30.154M89 14.374 81.851 6H89V1H73v4.363L81.39 13H73v5h16zm-19 0L63.193 6H70V1H55v4.363L62.733 13H55v5h15zM52 13h-8V6h8V1H38v17h14z"
+        ></path></svg
+      >
+      <figcaption>CSS</figcaption>
+    </figure>
+    <figure>
+      <svg viewBox="0 0 128 128" aria-label="typescript"
+        ><path
+          fill="currentColor"
+          d="M2 63.91v62.5h125v-125H2zm100.73-5a15.56 15.56 0 0 1 7.82 4.5 20.58 20.58 0 0 1 3 4c0 .16-5.4 3.81-8.69 5.85-.12.08-.6-.44-1.13-1.23a7.09 7.09 0 0 0-5.87-3.53c-3.79-.26-6.23 1.73-6.21 5a4.58 4.58 0 0 0 .54 2.34c.83 1.73 2.38 2.76 7.24 4.86 8.95 3.85 12.78 6.39 15.16 10 2.66 4 3.25 10.46 1.45 15.24-2 5.2-6.9 8.73-13.83 9.9a38.32 38.32 0 0 1-9.52-.1A23 23 0 0 1 80 109.19c-1.15-1.27-3.39-4.58-3.25-4.82a9.34 9.34 0 0 1 1.15-.73l4.6-2.64 3.59-2.08.75 1.11a16.78 16.78 0 0 0 4.74 4.54c4 2.1 9.46 1.81 12.16-.62a5.43 5.43 0 0 0 .69-6.92c-1-1.39-3-2.56-8.59-5-6.45-2.78-9.23-4.5-11.77-7.24a16.48 16.48 0 0 1-3.43-6.25 25 25 0 0 1-.22-8c1.33-6.23 6-10.58 12.82-11.87a31.66 31.66 0 0 1 9.49.26zm-29.34 5.24v5.12H57.16v46.23H45.65V69.26H29.38v-5a49.19 49.19 0 0 1 .14-5.16c.06-.08 10-.12 22-.1h21.81z"
+        ></path></svg
+      >
+      <figcaption>TypeScript</figcaption>
+    </figure>
+    <figure>
+      <svg viewBox="0 0 128 128" aria-label="react"
+        ><g fill="currentColor"
+          ><circle cx="64" cy="64" r="11.4"></circle><path
+            d="M107.3 45.2c-2.2-.8-4.5-1.6-6.9-2.3.6-2.4 1.1-4.8 1.5-7.1 2.1-13.2-.2-22.5-6.6-26.1-1.9-1.1-4-1.6-6.4-1.6-7 0-15.9 5.2-24.9 13.9-9-8.7-17.9-13.9-24.9-13.9-2.4 0-4.5.5-6.4 1.6-6.4 3.7-8.7 13-6.6 26.1.4 2.3.9 4.7 1.5 7.1-2.4.7-4.7 1.4-6.9 2.3C8.2 50 1.4 56.6 1.4 64s6.9 14 19.3 18.8c2.2.8 4.5 1.6 6.9 2.3-.6 2.4-1.1 4.8-1.5 7.1-2.1 13.2.2 22.5 6.6 26.1 1.9 1.1 4 1.6 6.4 1.6 7.1 0 16-5.2 24.9-13.9 9 8.7 17.9 13.9 24.9 13.9 2.4 0 4.5-.5 6.4-1.6 6.4-3.7 8.7-13 6.6-26.1-.4-2.3-.9-4.7-1.5-7.1 2.4-.7 4.7-1.4 6.9-2.3 12.5-4.8 19.3-11.4 19.3-18.8s-6.8-14-19.3-18.8zM92.5 14.7c4.1 2.4 5.5 9.8 3.8 20.3-.3 2.1-.8 4.3-1.4 6.6-5.2-1.2-10.7-2-16.5-2.5-3.4-4.8-6.9-9.1-10.4-13 7.4-7.3 14.9-12.3 21-12.3 1.3 0 2.5.3 3.5.9zM81.3 74c-1.8 3.2-3.9 6.4-6.1 9.6-3.7.3-7.4.4-11.2.4-3.9 0-7.6-.1-11.2-.4-2.2-3.2-4.2-6.4-6-9.6-1.9-3.3-3.7-6.7-5.3-10 1.6-3.3 3.4-6.7 5.3-10 1.8-3.2 3.9-6.4 6.1-9.6 3.7-.3 7.4-.4 11.2-.4 3.9 0 7.6.1 11.2.4 2.2 3.2 4.2 6.4 6 9.6 1.9 3.3 3.7 6.7 5.3 10-1.7 3.3-3.4 6.6-5.3 10zm8.3-3.3c1.5 3.5 2.7 6.9 3.8 10.3-3.4.8-7 1.4-10.8 1.9 1.2-1.9 2.5-3.9 3.6-6 1.2-2.1 2.3-4.2 3.4-6.2zM64 97.8c-2.4-2.6-4.7-5.4-6.9-8.3 2.3.1 4.6.2 6.9.2 2.3 0 4.6-.1 6.9-.2-2.2 2.9-4.5 5.7-6.9 8.3zm-18.6-15c-3.8-.5-7.4-1.1-10.8-1.9 1.1-3.3 2.3-6.8 3.8-10.3 1.1 2 2.2 4.1 3.4 6.1 1.2 2.2 2.4 4.1 3.6 6.1zm-7-25.5c-1.5-3.5-2.7-6.9-3.8-10.3 3.4-.8 7-1.4 10.8-1.9-1.2 1.9-2.5 3.9-3.6 6-1.2 2.1-2.3 4.2-3.4 6.2zM64 30.2c2.4 2.6 4.7 5.4 6.9 8.3-2.3-.1-4.6-.2-6.9-.2-2.3 0-4.6.1-6.9.2 2.2-2.9 4.5-5.7 6.9-8.3zm22.2 21-3.6-6c3.8.5 7.4 1.1 10.8 1.9-1.1 3.3-2.3 6.8-3.8 10.3-1.1-2.1-2.2-4.2-3.4-6.2zM31.7 35c-1.7-10.5-.3-17.9 3.8-20.3 1-.6 2.2-.9 3.5-.9 6 0 13.5 4.9 21 12.3-3.5 3.8-7 8.2-10.4 13-5.8.5-11.3 1.4-16.5 2.5-.6-2.3-1-4.5-1.4-6.6zM7 64c0-4.7 5.7-9.7 15.7-13.4 2-.8 4.2-1.5 6.4-2.1 1.6 5 3.6 10.3 6 15.6-2.4 5.3-4.5 10.5-6 15.5C15.3 75.6 7 69.6 7 64zm28.5 49.3c-4.1-2.4-5.5-9.8-3.8-20.3.3-2.1.8-4.3 1.4-6.6 5.2 1.2 10.7 2 16.5 2.5 3.4 4.8 6.9 9.1 10.4 13-7.4 7.3-14.9 12.3-21 12.3-1.3 0-2.5-.3-3.5-.9zM96.3 93c1.7 10.5.3 17.9-3.8 20.3-1 .6-2.2.9-3.5.9-6 0-13.5-4.9-21-12.3 3.5-3.8 7-8.2 10.4-13 5.8-.5 11.3-1.4 16.5-2.5.6 2.3 1 4.5 1.4 6.6zm9-15.6c-2 .8-4.2 1.5-6.4 2.1-1.6-5-3.6-10.3-6-15.6 2.4-5.3 4.5-10.5 6-15.5 13.8 4 22.1 10 22.1 15.6 0 4.7-5.8 9.7-15.7 13.4z"
+          ></path></g
+        ></svg
+      >
+      <figcaption>React</figcaption>
+    </figure>
+    <figure>
+      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 297" aria-label="remix"
+        ><path
+          fill="currentColor"
+          d="M141.675 0C218.047 0 256 36.35 256 94.414c0 43.43-26.707 71.753-62.785 76.474c30.455 6.137 48.259 23.604 51.54 58.065l.474 6.337l.415 5.924l.358 5.542l.249 4.179l.267 4.93l.138 2.814l.198 4.47l.159 4.222l.079 2.427l.107 3.888l.092 4.446l.033 2.148l.06 6.226l.02 6.496v3.885h-78.758l.004-1.62l.028-3.147l.047-3.065l.136-7.424l.035-2.489l.027-3.902l-.004-2.496l-.023-2.617l-.032-2.054l-.064-2.876l-.094-3.05l-.125-3.242l-.16-3.455l-.096-1.813l-.16-2.833l-.186-2.976l-.287-4.204l-.247-3.342a116.56 116.56 0 0 0-.247-3.02l-.202-1.934c-2.6-22.827-11.655-32.157-27.163-35.269l-1.307-.245a60.184 60.184 0 0 0-2.704-.408l-1.397-.164c-.236-.025-.472-.05-.71-.073l-1.442-.127l-1.471-.103l-1.502-.081l-1.514-.058l-1.544-.039l-1.574-.018L0 198.74V136.9h127.62c2.086 0 4.108-.04 6.066-.12l1.936-.095l1.893-.122l1.85-.15c.305-.028.608-.056.909-.086l1.785-.193a86.3 86.3 0 0 0 3.442-.475l1.657-.28c20.709-3.755 31.063-14.749 31.063-36.2c0-24.075-16.867-38.666-50.602-38.666H0V0h141.675ZM83.276 250.785c10.333 0 14.657 5.738 16.197 11.23l.203.79l.167.782l.109.617l.046.306l.078.603l.058.59l.023.29l.031.569l.01.278l.008.54v29.507H0v-46.102h83.276Z"
+        ></path></svg
+      >
+      <figcaption>Remix</figcaption>
+    </figure>
+    <figure>
+      <svg aria-label="Plone" viewBox="0 0 41 41" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <g clip-path="url(#clip0_1_2)">
+          <path
+            d="M17.717 15.963C20.1482 15.963 22.119 13.9922 22.119 11.561C22.119 9.12984 20.1482 7.159 17.717 7.159C15.2858 7.159 13.315 9.12984 13.315 11.561C13.315 13.9922 15.2858 15.963 17.717 15.963Z"
+            fill="#0083BE"></path>
+          <path
+            d="M31.069 20.355C31.069 22.791 29.1 24.756 26.669 24.756C24.239 24.756 22.269 22.786 22.269 20.355C22.269 17.922 24.247 15.957 26.669 15.957C29.101 15.954 31.069 17.924 31.069 20.355Z"
+            fill="#0083BE"></path>
+          <path
+            d="M17.702 33.578C20.1331 33.578 22.104 31.6071 22.104 29.176C22.104 26.7448 20.1331 24.774 17.702 24.774C15.2708 24.774 13.3 26.7448 13.3 29.176C13.3 31.6071 15.2708 33.578 17.702 33.578Z"
+            fill="#0083BE"></path>
+          <path
+            d="M20.343 0C9.108 0.001 0.001 9.107 0 20.343C0.001 31.577 9.105 40.684 20.343 40.686C31.578 40.684 40.684 31.582 40.686 20.343C40.684 9.107 31.578 0.001 20.343 0ZM31.792 31.792C28.854 34.726 24.816 36.534 20.341 36.535C15.862 36.534 11.828 34.723 8.891 31.792C5.958 28.854 4.15 24.816 4.149 20.343C4.15 15.865 5.96 11.83 8.892 8.893C11.83 5.959 15.864 4.151 20.342 4.15C24.82 4.151 28.855 5.962 31.792 8.893C34.727 11.831 36.534 15.869 36.536 20.343C36.535 24.819 34.726 28.854 31.792 31.792Z"
+            fill="#0083BE"></path>
+        </g>
+        <defs>
+          <clipPath id="clip0_1_2">
+            <rect width="40.686" height="40.686" fill="white"></rect>
+          </clipPath>
+        </defs>
+      </svg>
+      <figcaption>Plone</figcaption>
+    </figure>
+    <figure>
+      <svg aria-label="Docker" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"
+        ><path
+          fill="currentColor"
+          d="M21.81 10.25c-.06-.04-.56-.43-1.64-.43c-.28 0-.56.03-.84.08c-.21-1.4-1.38-2.11-1.43-2.14l-.29-.17l-.18.27c-.24.36-.43.77-.51 1.19c-.2.8-.08 1.56.33 2.21c-.49.28-1.29.35-1.46.35H2.62c-.34 0-.62.28-.62.63c0 1.15.18 2.3.58 3.38c.45 1.19 1.13 2.07 2 2.61c.98.6 2.59.94 4.42.94c.79 0 1.61-.07 2.42-.22c1.12-.2 2.2-.59 3.19-1.16A8.3 8.3 0 0 0 16.78 16c1.05-1.17 1.67-2.5 2.12-3.65h.19c1.14 0 1.85-.46 2.24-.85c.26-.24.45-.53.59-.87l.08-.24l-.19-.14m-17.96.99h1.76c.08 0 .16-.07.16-.16V9.5c0-.08-.07-.16-.16-.16H3.85c-.09 0-.16.07-.16.16v1.58c.01.09.07.16.16.16m2.43 0h1.76c.08 0 .16-.07.16-.16V9.5c0-.08-.07-.16-.16-.16H6.28c-.09 0-.16.07-.16.16v1.58c.01.09.07.16.16.16m2.47 0h1.75c.1 0 .17-.07.17-.16V9.5c0-.08-.06-.16-.17-.16H8.75c-.08 0-.15.07-.15.16v1.58c0 .09.06.16.15.16m2.44 0h1.77c.08 0 .15-.07.15-.16V9.5c0-.08-.06-.16-.15-.16h-1.77c-.08 0-.15.07-.15.16v1.58c0 .09.07.16.15.16M6.28 9h1.76c.08 0 .16-.09.16-.18V7.25c0-.09-.07-.16-.16-.16H6.28c-.09 0-.16.06-.16.16v1.57c.01.09.07.18.16.18m2.47 0h1.75c.1 0 .17-.09.17-.18V7.25c0-.09-.06-.16-.17-.16H8.75c-.08 0-.15.06-.15.16v1.57c0 .09.06.18.15.18m2.44 0h1.77c.08 0 .15-.09.15-.18V7.25c0-.09-.07-.16-.15-.16h-1.77c-.08 0-.15.06-.15.16v1.57c0 .09.07.18.15.18m0-2.28h1.77c.08 0 .15-.07.15-.16V5c0-.1-.07-.17-.15-.17h-1.77c-.08 0-.15.06-.15.17v1.56c0 .08.07.16.15.16m2.46 4.52h1.76c.09 0 .16-.07.16-.16V9.5c0-.08-.07-.16-.16-.16h-1.76c-.08 0-.15.07-.15.16v1.58c0 .09.07.16.15.16"
+        ></path></svg
+      >
+      <figcaption>Docker</figcaption>
+    </figure>
+  </div>
+</section>
 <style>
   .icons-tech {
     margin: 3rem 0;
@@ -70,8 +82,8 @@
     justify-content: center;
   }
   .icons-tech svg {
-    width: 3rem;
-    height: 3rem;
+    width: 3.75rem;
+    height: 3.75rem;
     color: var(--text-color);
     opacity: 0.25;
   }
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 4295cd9..fc26914 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -3,11 +3,12 @@ import BaseLayout from '../layouts/BaseLayout.astro'
 import { SITE_TITLE, SITE_DESCRIPTION } from '../consts'
 import IconsTech from '../components/IconsTech.astro'
 import ContactLinks from '../components/ContactLinks.astro'
+import Greeting from '../components/Greeting.astro'
 ---
 
 <BaseLayout title={SITE_TITLE} description={SITE_DESCRIPTION}>
   <hgroup>
-    <h1>🧑‍🚀 Hello, Astronaut!</h1>
+    <Greeting />
     <p>I'm a web frontend developer, working as freelance consultant</p>
   </hgroup>