quickcards, mainpage refactor, content fill

This commit is contained in:
matthieu42morin 2024-04-28 01:52:16 +02:00
parent dc948269b9
commit 2acd807a49
2 changed files with 33 additions and 54 deletions

View File

@ -3,24 +3,24 @@
<i class="fa-solid fa-screwdriver-wrench text-4xl text-primary-500" />
<h3 class="h3">Development</h3>
<p class="opacity-75">
I possess a wide range of skills that enable me to develop visually appealing and
interactive user interfaces for web applications.
I hone my problem solving and coding skills all the time. I try to learn the underlying
mechanics and use abstractions where relevant.
</p>
</div>
<div class="card variant-ringed-hollow p-4 md:p-8 space-y-4">
<i class="fa-solid fa-palette text-4xl text-primary-500" />
<h3 class="h3">Design</h3>
<h3 class="h3">Creativity & Presentation</h3>
<p class="opacity-75">
Over the years, I have honed my ability to create visually appealing interfaces that
are both user-friendly and intuitive.
I try to create better, novel ways to approach problems and give my best to present them
in a clear and concise manner.
</p>
</div>
<div class="card variant-ringed-hollow p-4 md:p-8 space-y-4">
<i class="fa-solid fa-users text-4xl text-primary-500" />
<h3 class="h3">User Experience</h3>
<h3 class="h3">Teamwork & Stakeholders</h3>
<p class="opacity-75">
I understand the importance of creating a seamless UX for end-users. Which includes
a solid understanding user behavior.
From my experience with a wide range of roles I understand the how to communication with
stakeholders across an organization.
</p>
</div>
</section>

View File

@ -1,48 +1,27 @@
<script lang="ts">
import SkillContainer from '$lib/components/SkillContainer.svelte';
import SkillContainer from '$lib/components/skills/SkillContainer.svelte';
import HeroSection from '$lib/components/home/HeroSection.svelte';
import QuickCards from '$lib/components/home/QuickCards.svelte';
import * as conf from '$lib/config';
import { website } from '$lib/config';
</script>
<svelte:head>
<title>Matt Morin</title>
<meta property="og:type" content="website" />
<meta name="description" content={conf.description} />
<meta property="og:title" content={conf.title} />
<meta name="description" content={website.description} />
<meta property="og:title" content={website.siteTitle} />
<meta property="og:type" content="article" />
<meta property="og:description" content={conf.description} />
<meta property="og:url" content={conf.url} />
<meta property="og:description" content={website.description} />
<meta property="og:url" content={website.url} />
<meta property="og:image" content="/images/profile-pic.png" />
</svelte:head>
<div class="mt-24 container h-full mx-auto flex-col justify-center items-center md:w-3/4">
<!-- <div class="space-y-10 mt-4 text-center flex flex-col items-center">
<h1 class="h1">I make the wheels turn.</h1>
<figure>
<section class="img-bg" />
<img
src="/images/profile-pic.png"
class="w-8 h-8 md:h-[200px] md:w-[200px]"
alt="Profile picture"
/>
</figure>
<img
src="/animations/infinity-loop-icon.svg"
alt="Icon"
class="w-16 md:w-32 lg:w-48 h-full rounded-full"
/>
<h2 class="h2">My github contributions</h2>
</div> -->
<div class="mt-24 container h-full mx-auto flex-col justify-center items-center md:w-3/4 space-y-8">
<HeroSection />
<SkillContainer />
<QuickCards />
<SkillContainer />
</div>