diff --git a/src/routes/abtme/+page.svelte b/src/routes/abtme/+page.svelte index 6b7c501..b4945ba 100644 --- a/src/routes/abtme/+page.svelte +++ b/src/routes/abtme/+page.svelte @@ -3,20 +3,31 @@ import Title from '$lib/title.svelte'; import Ubication from '$lib/ubication.svelte'; -
- - <p>I'm a <strong>fullstack</strong> developer, focused on <strong>front-end</strong>, and also a <strong>bioinformatician</strong>.</p> - <div class="pb-3"> - <p class="text-3xl font-semibold py-3">Education</p> - <p>I've studied Web Development, with a specialization in bioinformatics.</p> - <ul class="list-disc"> - <li>Higher Proefssional Degree on Web Development - Bioinformatics Specialization<br>@ <Link {...{link: 'https://proven.cat', text: 'Institut Provençana', underline: true}} /></li> - <li>Middle Professional Defree on Information Systems & Networks<br>@ <Link link="https://escoladeltreball.org" text="Insitut - Escola del Treball de Barcelona" underline={true} /></li> - </ul> - </div> - <div class="subsection pb-3" id="status"> - <p class="text-3xl font-semibold py-3">Curent status</p> - <p>Based in: <Ubication>L'Hospitalet de Llobregat</Ubication></p> - <p>Employment: <span>Unemployed <span class="fa-solid fa-circle text-red-500"></span></span></p> - </div> +<section class="grid grid-cols-8 gap-2"> + <grid-section id="main" class="col-span-6"> + <Title title="Who am I?"/> + <p>I'm a <strong>fullstack</strong> developer (don't mind either front or back), and also a <strong>bioinformatician</strong>.</p> + <div class="pb-3"> + <p class="text-3xl font-semibold py-3">Education</p> + <p>I've studied Web Development, with a specialization in bioinformatics.</p> + <ul class="list-disc"> + <li>Higher Proefssional Degree on Web Development - Bioinformatics Specialization<br>@ <Link {...{link: 'https://proven.cat', text: 'Institut Provençana', underline: true}} /></li> + <li>Middle Professional Defree on Information Systems & Networks<br>@ <Link link="https://escoladeltreball.org" text="Insitut - Escola del Treball de Barcelona" underline={true} /></li> + </ul> + </div> + <div class="subsection pb-3" id="status"> + <p class="text-3xl font-semibold py-3">Curent status</p> + <p>Based in: <Ubication>L'Hospitalet de Llobregat</Ubication></p> + <p>Employment: Backend Developer @ <Link link="https://taclia.es" text="Taclia" asCode underline/></p> + </div> + </grid-section> + <grid-section id="lateral"> + <p class="text-2xl font-semibold">Technologies</p> + <div class="flex"> + <img src="/tech/ts/ts-logo-512.svg" alt="TypeScript logo" class="w-6"> + <img src="/tech/js/js-logo-512.svg" alt="JavaScript logo" class="w-6"> + <img src="/tech/react/react-logo-512.svg" alt="React logo" class="w-6"> + <img src="/tech/svelte/svelte-logo.svg" alt="Svelte logo" class="w-6"> + </div> + </grid-section> </section> diff --git a/src/routes/styles.css b/src/routes/styles.css index 411f489..00ada34 100644 --- a/src/routes/styles.css +++ b/src/routes/styles.css @@ -13,3 +13,10 @@ section { margin-top: 1.25rem; margin-bottom: 1.25rem; } + +grid-section { + margin-left: auto; + margin-right: auto; + margin-top: 1.25rem; + margin-bottom: 1.25rem; +}