diff options
| author | secondl1ght <[email protected]> | 2022-09-15 18:11:12 -0600 |
|---|---|---|
| committer | secondl1ght <[email protected]> | 2022-09-15 18:11:12 -0600 |
| commit | c17cf8d8c7a8ed252aa6895f03dae15a3fcd0c12 (patch) | |
| tree | 99775a842a2c8d81db01f972ac4b967970ff95d4 /src/components/About.svelte | |
| parent | f8de16cd01251d608853a83a2ba7877462833d69 (diff) | |
| download | coinos-ui-c17cf8d8c7a8ed252aa6895f03dae15a3fcd0c12.tar.gz coinos-ui-c17cf8d8c7a8ed252aa6895f03dae15a3fcd0c12.zip | |
format
Diffstat (limited to 'src/components/About.svelte')
| -rw-r--r-- | src/components/About.svelte | 84 |
1 files changed, 43 insertions, 41 deletions
diff --git a/src/components/About.svelte b/src/components/About.svelte index 704e425a..7af1e896 100644 --- a/src/components/About.svelte +++ b/src/components/About.svelte @@ -10,10 +10,10 @@ { type: 'github', url: 'https://github.com/asoltys', color: 'bg-gray-800' } ] }, - { name: 'cole', socials: [] }, + { name: 'cole', socials: [] }, { name: 'john', - socials: [ ] + socials: [] }, { name: 'secondl1ght', @@ -26,11 +26,13 @@ name: 'shauna', socials: [ { type: 'twitter', url: 'https://twitter.com/ShaunaCollister', color: 'bg-[#1D9BF0]' }, - { type: 'linkedin', url: 'https://www.linkedin.com/in/shauna-collister-32905214', color: 'bg-[#0a66c2]' } + { + type: 'linkedin', + url: 'https://www.linkedin.com/in/shauna-collister-32905214', + color: 'bg-[#0a66c2]' + } ] - }, - - + } ]; </script> @@ -52,45 +54,45 @@ <Image image="swoosh" style="w-32 absolute -bottom-20 lg:bottom-0 right-0 md:right-10" /> </div> -<div class='flex justify-center'> -<div class="container mt-40 lg:mt-20"> - <h3 class="text-5xl font-medium mb-10 text-center"> - {$t('about.team.header')} - </h3> -<div class='space-y-10 2xl:space-y-0 2xl:grid gap-y-10 grid-cols-2'> - {#each team as member} -<div class='md:flex justify-center items-center 2xl:items-start md:space-x-10'> - <div> - <Image image={member.name} style="rounded-full mx-auto w-40 h-40 mb-5 object-cover" /> +<div class="flex justify-center"> + <div class="container mt-40 lg:mt-20"> + <h3 class="text-5xl font-medium mb-10 text-center"> + {$t('about.team.header')} + </h3> + <div class="space-y-10 2xl:space-y-0 2xl:grid gap-y-10 grid-cols-2"> + {#each team as member} + <div class="md:flex justify-center items-center 2xl:items-start md:space-x-10"> + <div> + <Image image={member.name} style="rounded-full mx-auto w-40 h-40 mb-5 object-cover" /> - <div class="space-y-2"> - <span class="text-2xl text-center font-semibold block" - >{$t(`about.team.${member.name}.name`)}</span - > - <span class="text-xl text-center text-secondary block" - >{$t(`about.team.${member.name}.position`)}</span - > - </div> + <div class="space-y-2"> + <span class="text-2xl text-center font-semibold block" + >{$t(`about.team.${member.name}.name`)}</span + > + <span class="text-xl text-center text-secondary block" + >{$t(`about.team.${member.name}.position`)}</span + > + </div> - <div class="mt-2 flex justify-center items-center space-x-5"> - {#each member.socials as social} - <a - href={social.url} - target="_blank" - rel="noreferrer" - class={`rounded-full p-2 ${social.color}`}><Icon icon={social.type} style="w-6" /></a - > - {/each} + <div class="mt-2 flex justify-center items-center space-x-5"> + {#each member.socials as social} + <a + href={social.url} + target="_blank" + rel="noreferrer" + class={`rounded-full p-2 ${social.color}`} + ><Icon icon={social.type} style="w-6" /></a + > + {/each} + </div> + </div> + <div class="mt-5 md:mt-0 text-secondary text-xl w-full md:w-[450px]"> + {$t(`about.team.${member.name}.bio`)} + </div> </div> - + {/each} </div> - <div class="mt-5 md:mt-0 text-secondary text-xl w-full md:w-[450px]"> - {$t(`about.team.${member.name}.bio`)} - </div> -</div> - {/each} -</div> -</div> + </div> </div> <div class="mt-20"> |