Creating horizontal Card and Project Page

This commit is contained in:
Manuel Ernesto Garcia 2022-09-23 14:01:26 -04:00
parent 24e6ffeacd
commit 55197a00b4
6 changed files with 43 additions and 34 deletions

View file

@ -4,7 +4,7 @@ const { title, img, desc, url, badge, tags } = Astro.props;
<div class="md:w-1/3 w-full">
<a href={url} target="_blank">
<div class="card bg-base-100 transition ease-in-out hover:shadow-xl mx-6 my-2 hover:scale-105">
<div class="card bg-base-100 transition ease-in-out hover:shadow-xl mx-6 my-2 hover:scale-[102%]">
<figure><img src={img} alt="Shoes" /></figure>
<div class="card-body">
<h2 class="card-title">

View file

@ -2,7 +2,7 @@
const today = new Date();
---
<footer class="footer footer-center block mb-5">
<footer class="footer footer-center block mb-5 pt-10">
<div class="pb-2">
&copy; {today.getFullYear()} Manuel Ernesto
</div>

View file

@ -4,8 +4,8 @@ const { title, img, desc, url, badge, tags } = Astro.props;
<div class="rounded-lg bg-base-100 hover:shadow-xl transition ease-in-out hover:scale-[102%]">
<a href={url} target="_blank">
<div class="hero-content flex-col lg:flex-row">
<img src={img} class="max-w-xs md:max-w-[12rem] rounded-lg" />
<div class="hero-content flex-col md:flex-row">
<img src={img} class="max-w-full md:max-w-[12rem] rounded-lg" />
<div class="grow">
<h1 class="text-1xl font-bold">
{title}

View file

@ -14,7 +14,6 @@
<li><a href="/projects">Projects</a></li>
<li><a href="/blog">Blog</a></li>
<li><a href="/cv">CV</a></li>
<li><a>Comunity</a></li>
<li><a>Support my Work</a></li>
<li><a>Contact</a></li>
</ul>

View file

@ -1,6 +1,6 @@
---
import PageLayout from "../layouts/Page.astro";
import Card from "../components/Card.astro";
import HorizontalCard from "../components/HorizontalCard.astro";
import { SITE_TITLE, SITE_DESCRIPTION } from "../config";
---
@ -15,8 +15,8 @@ import { SITE_TITLE, SITE_DESCRIPTION } from "../config";
</div>
<div class="py-2">
<text>
I am a cuban Software Engineer and entrepreneurship. I work creating software solutions that solve problems in a simple way and sharing what I learn along the way. I like
minimalism, Open-Source, good music and masareales.</text
I am a cuban Software Engineer and entrepreneurship. I work creating software solutions that solve problems in a
simple way and sharing what I learn along the way. I like minimalism, Open-Source, good music and masareales.</text
>
</div>
</div>
@ -25,27 +25,26 @@ import { SITE_TITLE, SITE_DESCRIPTION } from "../config";
<div class="text-3xl w-full font-bold mb-5">My last projects {"</>"}</div>
</div>
<div class="flex flex-wrap mb-5 mt-3">
<Card
<HorizontalCard
title="WeekTodo"
img="https://weektodo.me/assets/images/weektodo-opengraph-1200x630.png"
desc="Free minimalist weektly planner focused in privacy."
url="https://weektodo.me/"
badge="NEW"
/>
<Card
<div class="divider my-0"></div>
<HorizontalCard
title="Productiveness"
img="https://softr-prod.imgix.net/applications/f988aa05-d312-4aa6-812e-832bdc75388d/assets/d2c87a17-4fc7-455f-a656-5e4cdbe7aa71.png"
desc="Discover the best productivity apps in the market."
url="https://www.productiveness.net/"
/>
<Card
<div class="divider my-0"></div>
<HorizontalCard
title="Zen Twitter"
img="https://lh3.googleusercontent.com/NGt846Flv6wyBSlYzfJkFHAJ8mcG1pf4M-InYeZnp4VsIk6JKk8nZ2ZKskDlvHDAEYr_biSO8jtXIWI83OXD5RNXWg=w640-h400-e365-rj-sc0x00ffffff"
desc="Disable Twitter vanity metrics, notifications and distractions."
url="https://chrome.google.com/webstore/detail/zen-twitter/nlkendkabgopehmlmohfbkgkjjdjepnb"
badge="FOSS"
/>
</div>
</PageLayout>

View file

@ -5,7 +5,7 @@ import HorizontalCard from "../components/HorizontalCard.astro";
<PageLayout>
<div>
<div class="text-3xl w-full font-bold mb-5">My last projects {"</>"}</div>
<div class="text-3xl w-full font-bold mb-5">Applications</div>
</div>
<HorizontalCard
@ -22,13 +22,24 @@ import HorizontalCard from "../components/HorizontalCard.astro";
desc="Discover the best productivity apps in the market."
url="https://www.productiveness.net/"
/>
<div class="divider my-0"></div>
<HorizontalCard
title="Qvalive"
img="https://qvalive.com/assets/images/qvalive-splash.jpg"
desc="QvaLive es el espacio de las transmisiones cuabanas en vivo por internet."
url="https://qvalive.com/"
/>
<div>
<div class="text-3xl w-full font-bold mb-5 mt-10">Chrome Extensions</div>
</div>
<HorizontalCard
title="Zen Twitter"
img="https://lh3.googleusercontent.com/NGt846Flv6wyBSlYzfJkFHAJ8mcG1pf4M-InYeZnp4VsIk6JKk8nZ2ZKskDlvHDAEYr_biSO8jtXIWI83OXD5RNXWg=w640-h400-e365-rj-sc0x00ffffff"
desc="Disable Twitter vanity metrics, notifications and distractions."
url="https://chrome.google.com/webstore/detail/zen-twitter/nlkendkabgopehmlmohfbkgkjjdjepnb"
badge="FOSS"
tags={["Chrome Extension", "Free"]}
/>
</PageLayout>