Update speakers description

src/app.css

@@ -78,7 +78,7 @@
 	.person-item:hover img {
 		@apply grayscale-0 invert-0 blur-none;
 	}
-	.person-item:hover .text-mild {
+	.person-item:hover .text-mild, .person-item:hover .text-supermild {
 		@apply text-black;
 	}
 }

src/lib/components/PeopleList.svelte

@@ -3,6 +3,8 @@
 	export let people;
     export let size = 'normal';
 
+	import SvelteMarkdown from 'svelte-markdown';
+
 	function getPerson(id) {
 		return people.find((p) => p.id === id);
 	}
@@ -12,15 +14,18 @@
 </script>
 
 {#each items.map(getPerson) as item}
-	<div class="hover:bg-white hover:text-black p-2 {size === 'small' ? 'w-48' : 'w-64'} person-item">
+	<div class="hover:bg-white hover:text-black p-2 {size === 'small' ? 'w-2/3 sm:w-48' : 'w-2/3 sm:w-64'} person-item">
 		<div>
 			<a href={twitterLink(item.twitter)} target="_blank"
-				><img src="/people/{item.img}" class="grayscale invert aspect-square object-cover" /></a
+				><img src="/people/{item.img}" class="grayscale invert aspect-square object-cover w-full" /></a
 			>
 		</div>
 		<div class="mt-4">{item.name}</div>
 		<div class="text-base text-mild">
 			<a href={twitterLink(item.twitter)} class="hover:underline">@{item.twitter}</a>
 		</div>
+		{#if item.caption}
+			<div class="mt-2 text-base text-supermild"><SvelteMarkdown source={item.caption} /></div>
+		{/if}
 	</div>
 {/each}

src/lib/config.yaml

@@ -23,11 +23,13 @@ themes:
 - title: Identity (ID)
 - title: Mixnets → Full-Stack Privacy
   desc: Imagine a Full-Stack Privacy -> how would it even look alike!
+- title: Private messaging protocols
+  desc: We need resilient privacy-preserving, p2p communication layers for Web3, that allows free and uncensored human-to-human, machine-to-machine or hybrid communication.
+- title: Solarpunk vs Lunarpunk
+  desc: For solarpunk to succeed it must integrate the lunarpunk unconscious. The only hope for solarpunk is to [go dark](https://www.egirlcapital.com/writings/107533289). Do you agree?
 - title: Cryptography
 - title: Tech journalists
   desc: Ethical crypto vs global cyberwars agenda
-- title: Asian community
-  desc: It's rare to see asians in Europe, but there are so many of them doing privacy solutions
 - title: Privacy wars
   desc: Why are privacy-blockchain socials so toxic? We should stop hating each other & work together
 - title: Privacy workforce
@@ -35,12 +37,8 @@ themes:
 - title: R&D (ZK, MPC)
 - title: Network states (with a privacy focus)
   desc: The network state-as-a-grassroots movement
-- title: Solarpunk vs Lunarpunk
-  desc: For solarpunk to succeed it must integrate the lunarpunk unconscious. The only hope for solarpunk is to [go dark](https://www.egirlcapital.com/writings/107533289). Do you agree?
 - title: Veksl
   desc: Easy onboarding to cryptocurrencies without KYC/AML using peer-to-peer tools is crucial for privacy. What options do we have today?
-- title: Private messaging protocols
-  desc: We need resilient privacy-preserving, p2p communication layers for Web3, that allows free and uncensored human-to-human, machine-to-machine or hybrid communication.
 ticketsIntro: Be a part of the first Web3Privacy Summit experience…
 ticketsNote: Tickets will go on sale in early March 2023.
 tickets:
@@ -85,22 +83,27 @@ people:
   name: Mykola Siusko
   twitter: nicksvyaznoy
   img: mykola.png
+  caption: Web3 privacy advocate
 - id: tree
   name: Tree
   twitter: treecz
   img: tree.jpeg
+  caption: Creator of lunarpunk hackathons & events
 - id: juraj-bednar
   name: Juraj Bednar
   twitter: jurbed
   img: juraj-bednar.jpeg
+  caption: Educator, writer, cryptoanarchist & biohacker
 - id: mario-havel
   name: Mario Havel
   twitter: TMIYChao
   img: mario-havel.jpeg
+  caption: Hacker, Co-Founder of [Bordel Hackerspace](https://bordel.paralelnipolis.cz/#/)
 - id: guy-zyskind
   name: Guy Zyskind
   twitter: GuyZys
   img: guy-zyskind.jpeg
+  caption: Founder of [Secret Network](https://scrt.network/), CEO SCRT Labs
 speakers:
 - guy-zyskind
 - juraj-bednar

src/routes/+page.svelte

@@ -38,7 +38,7 @@
 	<div class="middle-pane-medium pt-16 text-xl text-center mx-auto">
 		<div class="section-header">Speakers</div>
 		<div class="mx-auto">
-			<div class="pb-16 flex justify-center sm:gap-6">
+			<div class="pb-16 flex flex-wrap justify-center gap-6">
 				<PeopleList items={data.config.speakers} people={data.config.people} />
 			</div>
 		</div>
@@ -49,7 +49,7 @@
 	<div class="middle-pane-medium pt-0 text-xl text-center mx-auto">
 		<div class="section-header">Hosts</div>
 		<div class="mx-auto">
-			<div class="pb-16 flex justify-center sm:gap-6">
+			<div class="pb-16 flex flex-wrap justify-center gap-6">
 				<PeopleList items={data.config.hosts} people={data.config.people} size="small" />
 			</div>
 		</div>