creating time line component

This commit is contained in:
Manuel Ernesto Garcia 2022-09-22 15:36:33 -04:00
parent 8878ea3828
commit cea602c041
7 changed files with 78 additions and 12 deletions

View file

@ -4,7 +4,7 @@ const { title, img, desc, url, badge } = 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 m-6 hover:scale-105"> <div class="card bg-base-100 transition ease-in-out hover:shadow-xl mx-6 my-2 hover:scale-105">
<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

@ -1,11 +1,3 @@
---
import HeaderLink from "./HeaderLink.astro";
import { SITE_TITLE } from "../config";
---
<!-- <h2>
{SITE_TITLE}
</h2> -->
<div <div
class="sticky lg:hidden top-0 z-30 flex h-16 w-full justify-center bg-opacity-90 backdrop-blur transition-all duration-100 bg-base-100 text-base-content shadow-sm" class="sticky lg:hidden top-0 z-30 flex h-16 w-full justify-center bg-opacity-90 backdrop-blur transition-all duration-100 bg-base-100 text-base-content shadow-sm"
> >

View file

@ -10,10 +10,10 @@
</div> </div>
<ul> <ul>
<!-- Sidebar content here --> <!-- Sidebar content here -->
<li><a href="/">About</a></li> <li><a href="/">Home</a></li>
<li><a>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>CV</a></li> <li><a href="/cv">CV</a></li>
<li><a>Comunity</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>

View file

@ -0,0 +1,17 @@
---
const { title, subtitle, desc } = Astro.props;
---
<div class="flex">
<div class="education__time">
<span class="w-4 h-4 bg-primary block rounded-full mt-1"></span>
<span class="education__line bg-primary block h-full w-[2px] translate-x-[7px]"></span>
</div>
<div class="experience__data bd-grid px-5">
<h3 class="font-semibold mb-1">{title}</h3>
<span class="font-light text-sm">{subtitle}</span>
<p class="my-2">
{desc}
</p>
</div>
</div>

19
src/pages/cv.astro Normal file
View file

@ -0,0 +1,19 @@
---
import PageLayout from "../layouts/Page.astro";
import TimeLineElement from "../components/cv/TimeLine.astro";
---
<PageLayout>
<div class="time-line-container grid gap-4">
<TimeLineElement
title="Web Developer at Integral Oil Drilling System 2.0"
subtitle="From 2015 to 2016 at CEDIN, UCI, Habana, Cuba"
desc="System of steps of process of perforation of oil wells. Outspread in the direction of Intervención of Wells and various wells of drilling of the Occident of the country. Generate reports and graphs of process of perforation making use of data mining. Technologies: Php,Symfony 2.7 , Subversión, PostgreSQL, HigthChart, Ireport, Boostrap 2, JQuery, HTML,CSS, JavaScript"
/>
<TimeLineElement
title="Full Stack Dev, Software Architect and Project Leader at Integral Oil Drilling System 3.0"
subtitle="From 2016 to 2017 at CEDIN, UCI, Habana, Cuba"
desc="System of steps of process of perforation of oil wells. Outspread in the direction of Intervención of Wells and various wells of drilling of the Occident of the country. Generate reports and graphs of process of perforation making use of data mining. Technologies: Php,Symfony 2.8 , Gitlab, PostgreSQL, HigthChart, Boostrap 2, JQuery, HTML,CSS, JavaScript"
/>
</div>
</PageLayout>

View file

@ -0,0 +1,35 @@
---
import PageLayout from "../layouts/Page.astro";
import Card from "../components/Card.astro";
---
<PageLayout>
<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"
/>
<Card
title="Qvalive"
img="https://qvalive.com/assets/images/qvalive-splash.jpg"
desc="El espacio de transmisiones cubanas en vivo por internet."
url="https://qvalive.com/"
/>
</div>
</PageLayout>

View file

@ -0,0 +1,3 @@
.time-line-container > div:last-child .education__time > .education__line{
display: none;
}