Skip to content

Commit

Permalink
Add more members info and put title on home page for members (#65)
Browse files Browse the repository at this point in the history
  • Loading branch information
@alicarpio
alicarpio authored Sep 24, 2024
1 parent e7980cd commit cdc2899
Show file tree
Hide file tree
Showing 6 changed files with 167 additions and 27 deletions.
6 changes: 3 additions & 3 deletions src/lib/components/Member.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,11 @@
</script>

<div class="flex flex-col items-center justify-center gap-2 pb-14">
<img class="inset-0 size-20 rounded-full md:size-24" src={photo} alt="Foto" />
<img class="inset-0 size-20 rounded-full md:size-32" src={photo} alt="Foto" />

<div class="flex flex-col items-center justify-center">
<h2 class="text-base text-lime-400">{name}</h2>
<p class="text-sm">{role}</p>
<h2 class="text-lg text-white">{name}</h2>
<p class="text-[0.85rem] text-lime-400">{role}</p>
</div>

<div class="flex flex-row justify-items-center gap-2 object-center">
Expand Down
33 changes: 21 additions & 12 deletions src/lib/components/Members_home.svelte
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,26 @@
<script lang="ts">
import Member from "$lib/components/Member.svelte";
import members from "$lib/data/members.json";
import Title from "$lib/components/Title.svelte";
</script>

<div
class="grid grid-cols-1 justify-center justify-items-center px-20 py-48 md:grid-cols-3 md:px-48"
>
{#each members as member}
<Member
name={member.name}
role={member.role}
photo={member.photo}
socialMedia={member.socialMedia}
></Member>
{/each}
</div>
<section>
<Title title="Chocomiembros" />
<div
class="grid grid-cols-2 justify-center justify-items-center pb-2 pt-16 md:grid-cols-3 md:px-40"
>
{#each members as member}
<Member
name={member.name}
role={member.role}
photo={member.photo}
socialMedia={member.socialMedia}
></Member>
{/each}
</div>
<div class="flex flex-col items-center pb-20">
<button class="py rounded-full bg-lime-500 px-8 font-fira font-semibold text-black">
<a href="/members"> Ver más </a>
</button>
</div>
</section>
3 changes: 3 additions & 0 deletions src/lib/components/layout/Navbar.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,12 +58,14 @@
height: 150px;
margin-bottom: 2%;
}
.nav-background {
background-image: url("$lib/assets/forms/line.svg");
background-repeat: no-repeat;
top: 20px;
background-size: 97% auto;
}
.links {
margin-right: 70px;
}
Expand Down Expand Up @@ -101,6 +103,7 @@
nav img {
margin-bottom: 5rem;
}
.links.open {
display: flex; /* Mostrar el menú cuando esté abierto */
}
Expand Down
143 changes: 134 additions & 9 deletions src/lib/data/members.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,62 +4,187 @@
"role": "Presidente",
"photo": "https://avatars.githubusercontent.com/u/72272077?v=4",
"directiva": "si",
"socialMedia": [{ "nombre": "github", "link": "https://github.com/alicarpio" }]
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/alicarpio"
},
{
"nombre": "linkedin",
"link": "https://www.linkedin.com/in/alina-carpio/"
}
]
},
{
"name": "Melissa Ayllon",
"role": "Vicepresidente",
"photo": "https://avatars.githubusercontent.com/u/116417470?v=4",
"directiva": "si",
"socialMedia": [{ "nombre": "github", "link": "https://github.com/MelissaAyllon" }]
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/MelissaAyllon"
},
{
"nombre": "linkedin",
"link": "https://www.linkedin.com/in/melissa-ayllon-193558221/"
}
]
},
{
"name": "Michael Estrada",
"role": "Secretario",
"photo": "https://avatars.githubusercontent.com/u/98861990?v=4",
"directiva": "si",
"socialMedia": [{ "nombre": "github", "link": "https://github.com/BryanEstrada003" }]
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/BryanEstrada003"
},
{
"nombre": "linkedin",
"link": "https://www.linkedin.com/in/maiestrada/"
}
]
},
{
"name": "Alexander Goussas",
"role": "Miembro",
"photo": "https://avatars.githubusercontent.com/u/84427521?v=4",
"directiva": "no",
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/aloussase/"
},
{
"nombre": "linkedin",
"link": "https://www.linkedin.com/in/alexander-goussas/"
}
]
},
{
"name": "Adrian Delgado",
"role": "Miembro",
"photo": "https://avatars.githubusercontent.com/u/11708972?v=4",
"directiva": "no",
"socialMedia": [{ "nombre": "github", "link": "https://github.com/adriandelgado" }]
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/adriandelgado"
}
]
},
{
"name": "Braulio Rivas",
"role": "Miembro",
"photo": "https://avatars.githubusercontent.com/u/61257604?v=4",
"directiva": "no",
"socialMedia": [{ "nombre": "github", "link": "https://github.com/brauliorivas" }]
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/brauliorivas"
},
{
"nombre": "linkedin",
"link": "https://www.linkedin.com/in/braulio-rivas-abad/"
}
]
},
{
"name": "Daniel Cortez",
"role": "Miembro",
"photo": "https://avatars.githubusercontent.com/u/112514991?v=4",
"directiva": "no",
"socialMedia": [{ "nombre": "github", "link": "https://github.com/DanRCM" }]
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/DanRCM"
},
{
"nombre": "linkedin",
"link": "https://www.linkedin.com/in/daniel-cortez-manzano-384041253/"
}
]
},
{
"name": "Adair Abrigo",
"role": "Miembro",
"photo": "https://avatars.githubusercontent.com/u/93391519?v=4",
"directiva": "no",
"socialMedia": [{ "nombre": "github", "link": "https://github.com/adairaxe" }]
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/adairaxe"
},
{
"nombre": "linkedin",
"link": "https://www.linkedin.com/in/adair-abrigo-amay/"
}
]
},
{
"name": "Anthony Herrera",
"role": "Miembro",
"photo": "https://avatars.githubusercontent.com/u/137233273?v=4",
"directiva": "no",
"socialMedia": [{ "nombre": "github", "link": "https://github.com/AnthonyyHL" }]
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/AnthonyyHL"
},
{
"nombre": "linkedin",
"link": "https://www.linkedin.com/in/anthonyyhl/"
}
]
},
{
"name": "John Cañarte",
"role": "Miembro",
"photo": "https://avatars.githubusercontent.com/u/70679514?v=4",
"directiva": "no",
"socialMedia": [{ "nombre": "github", "link": "https://github.com/Jecanart" }]
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/Jecanart"
},
{
"nombre": "linkedin",
"link": "https://www.linkedin.com/in/john-ca%C3%B1arte-7728a62b6/"
}
]
},
{
"name": "Noelia Pasaca",
"role": "Miembro",
"photo": "https://avatars.githubusercontent.com/u/91957504?v=4",
"directiva": "no",
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/noeliapasaca"
},
{
"nombre": "linkedin",
"link": "https://www.linkedin.com/in/noelia-pasaca-paladines-058a4a221/"
}
]
},
{
"name": "María Jose Moyano",
"role": "Miembro",
"photo": "https://avatars.githubusercontent.com/u/93271608?v=4",
"directiva": "no",
"socialMedia": [
{
"nombre": "github",
"link": "https://github.com/majomoyano"
},
{
"nombre": "linkedin",
"link": "https://www.linkedin.com/in/mjmoyanotamayo/"
}
]
}
]
4 changes: 3 additions & 1 deletion src/routes/Hero.svelte
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
<section class="mt-24 flex flex-col items-center justify-between gap-y-12 sm:flex-row lg:flex-row">
<section
class="flex flex-col items-center justify-between gap-y-12 sm:flex-row lg:mt-24 lg:flex-row"
>
<div class="relative">
<img
src="https://images.unsplash.com/photo-1601933470096-0e34634ffcde?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"
Expand Down
5 changes: 3 additions & 2 deletions src/routes/members/+page.svelte
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
<script lang="ts">
import Member from "$lib/components/Member.svelte";
let { data } = $props();
</script>

<h1 class=" pb-8 pt-5 text-center font-fira text-4xl text-slate-200">Directiva</h1>
<h1 class=" pb-8 pt-5 text-center font-fira text-3xl text-slate-200 lg:mt-28">Directiva</h1>
<div
class="grid grid-cols-1 justify-center justify-items-center px-20 py-3 md:grid-cols-3 md:px-48"
>
Expand All @@ -19,7 +20,7 @@
{/each}
</div>

<h1 class=" pb-8 pt-5 text-center font-fira text-4xl text-slate-200">Miembros</h1>
<h1 class=" pb-8 pt-5 text-center font-fira text-3xl text-slate-200">Miembros</h1>
<div
class="grid grid-cols-1 justify-center justify-items-center px-20 py-3 md:grid-cols-3 md:px-48"
>
Expand Down

0 comments on commit cdc2899

Please sign in to comment.