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"> <div class="md:w-1/3 w-full">
<a href={url} target="_blank"> <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> <figure><img src={img} alt="Shoes" /></figure>
<div class="card-body"> <div class="card-body">
<h2 class="card-title"> <h2 class="card-title">

View file

@ -2,7 +2,7 @@
const today = new Date(); 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"> <div class="pb-2">
&copy; {today.getFullYear()} Manuel Ernesto &copy; {today.getFullYear()} Manuel Ernesto
</div> </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%]"> <div class="rounded-lg bg-base-100 hover:shadow-xl transition ease-in-out hover:scale-[102%]">
<a href={url} target="_blank"> <a href={url} target="_blank">
<div class="hero-content flex-col lg:flex-row"> <div class="hero-content flex-col md:flex-row">
<img src={img} class="max-w-xs md:max-w-[12rem] rounded-lg" /> <img src={img} class="max-w-full md:max-w-[12rem] rounded-lg" />
<div class="grow"> <div class="grow">
<h1 class="text-1xl font-bold"> <h1 class="text-1xl font-bold">
{title} {title}

View file

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

View file

@ -1,6 +1,6 @@
--- ---
import PageLayout from "../layouts/Page.astro"; 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"; import { SITE_TITLE, SITE_DESCRIPTION } from "../config";
--- ---
@ -15,37 +15,36 @@ import { SITE_TITLE, SITE_DESCRIPTION } from "../config";
</div> </div>
<div class="py-2"> <div class="py-2">
<text> <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 I am a cuban Software Engineer and entrepreneurship. I work creating software solutions that solve problems in a
minimalism, Open-Source, good music and masareales.</text simple way and sharing what I learn along the way. I like minimalism, Open-Source, good music and masareales.</text
> >
</div> </div>
</div> </div>
<div> <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">My last projects {"</>"}</div>
</div>
<div class="flex flex-wrap mb-5 mt-3">
<Card
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
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
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> </div>
<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"
/>
<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/"
/>
<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"
/>
</PageLayout> </PageLayout>

View file

@ -5,7 +5,7 @@ import HorizontalCard from "../components/HorizontalCard.astro";
<PageLayout> <PageLayout>
<div> <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> </div>
<HorizontalCard <HorizontalCard
@ -22,13 +22,24 @@ import HorizontalCard from "../components/HorizontalCard.astro";
desc="Discover the best productivity apps in the market." desc="Discover the best productivity apps in the market."
url="https://www.productiveness.net/" url="https://www.productiveness.net/"
/> />
<div class="divider my-0"></div> <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 <HorizontalCard
title="Zen Twitter" title="Zen Twitter"
img="https://lh3.googleusercontent.com/NGt846Flv6wyBSlYzfJkFHAJ8mcG1pf4M-InYeZnp4VsIk6JKk8nZ2ZKskDlvHDAEYr_biSO8jtXIWI83OXD5RNXWg=w640-h400-e365-rj-sc0x00ffffff" img="https://lh3.googleusercontent.com/NGt846Flv6wyBSlYzfJkFHAJ8mcG1pf4M-InYeZnp4VsIk6JKk8nZ2ZKskDlvHDAEYr_biSO8jtXIWI83OXD5RNXWg=w640-h400-e365-rj-sc0x00ffffff"
desc="Disable Twitter vanity metrics, notifications and distractions." desc="Disable Twitter vanity metrics, notifications and distractions."
url="https://chrome.google.com/webstore/detail/zen-twitter/nlkendkabgopehmlmohfbkgkjjdjepnb" url="https://chrome.google.com/webstore/detail/zen-twitter/nlkendkabgopehmlmohfbkgkjjdjepnb"
badge="FOSS" badge="FOSS"
tags={["Chrome Extension", "Free"]}
/> />
</PageLayout> </PageLayout>