refactor: cleanup, css fixes, add greeting

This commit is contained in:
Nicola Zambello 2023-06-01 17:18:57 +02:00
parent f56297d069
commit f5cd79475e
Signed by: nzambello
GPG key ID: 56E4A92C2C1E50BA
4 changed files with 86 additions and 66 deletions

View file

@ -49,6 +49,7 @@
display: inline-flex;
justify-content: center;
align-items: center;
margin-bottom: 1rem;
}
.contact-links a svg {
width: 1.5em;

View file

@ -0,0 +1,6 @@
---
const messages = ['Hi', 'Hello', 'Howdy', 'Hey there']
const randomMessage = messages[Math.floor(Math.random() * messages.length)]
---
<h1>{randomMessage}!</h1>

View file

@ -1,4 +1,6 @@
<div class="icons-tech" role="presentation">
<section>
<h2>My tech stack</h2>
<div class="icons-tech" role="presentation">
<figure>
<svg viewBox="0 0 128 128" aria-label="css"
><path
@ -37,7 +39,7 @@
<figcaption>Remix</figcaption>
</figure>
<figure>
<svg aria-label="plone" viewBox="0 0 41 41" fill="none" xmlns="http://www.w3.org/2000/svg">
<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"
@ -60,7 +62,17 @@
</svg>
<figcaption>Plone</figcaption>
</figure>
</div>
<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;
}

View file

@ -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>