Update

postcss.config.cjs

@@ -1,6 +1,6 @@
 module.exports = {
 	plugins: {
 		tailwindcss: {},
-    autoprefixer: {},
-  },
+		autoprefixer: {}
 	}
+};

src/app.css

@@ -1,4 +1,3 @@
-
 @import url('https://fonts.googleapis.com/css2?family=Ubuntu+Mono&display=swap');
 
 @tailwind base;
@@ -6,7 +5,6 @@
 @tailwind utilities;
 
 @layer components {
-
 	body {
 		@apply bg-[#0d1117];
 	}
@@ -15,7 +13,8 @@
 		@apply font-mono;
 	}
 
-    footer a, .markdown a {
+	footer a,
+	.markdown a {
 		@apply underline hover:no-underline;
 	}
 
@@ -43,7 +42,8 @@
 	table.table-custom {
 		@apply text-base;
 	}
-    .table-custom td, .table-custom th {
+	.table-custom td,
+	.table-custom th {
 		@apply px-2 py-3 md:px-4 md:py-4 align-top;
 	}
 	.table-custom th {

src/lib/components/PeopleList.svelte

@@ -0,0 +1,25 @@
+<script>
+	export let items;
+	export let people;
+
+	function getPerson(id) {
+		return people.find((p) => p.id === id);
+	}
+	function twitterLink(handle) {
+		return `https://twitter.com/${handle}`;
+	}
+</script>
+
+{#each items.map(getPerson) as item}
+	<div>
+		<div>
+			<a href={twitterLink(item.twitter)}
+				><img src="/people/{item.img}" class="grayscale hover:grayscale-0" /></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>
+	</div>
+{/each}

src/lib/config.js

@@ -3,11 +3,11 @@ import yaml from 'js-yaml';
 const CONFIG = yaml.load(`
 
 title: Web3Privacy Prague 2023
-shortname: Web3Privacy Summit
+shortname: "Web3Privacy Summit #1"
 date: Monday, 5. June 2023
 venue: X10, Prague
 slogan: |
-  We need to protect our privacy, and that's why we're coming together on June 5 to Prague to sit down and discuss different aspects of privacy in the Web3 industry - how we can help shape it and make it more accessible - building a shared culture. Conference was created to complement the [Web3Privacy Now](http://web3privacy.info/) research project.
+  We need to protect our privacy, and that's why we're coming together on June 5 to Prague to sit down and discuss different aspects of privacy in the Web3 industry - how we can help shape it and make it more accessible - building a shared culture. The conference complements the research project [Web3Privacy Now](http://web3privacy.info/) and was created by joining forces with the production team of the privacy hackathon [ETHBrno](https://ethbrno.cz/).
 themes:
 - title: Human rights DAOs (pro-privacy)
 - title: Identity (ID)
@@ -52,8 +52,18 @@ faq:
   text: Yes, we plan do both. Livestream of the whole conference and recordings of the lectures will be publicly available.
 - title: How do I get to the venue?
   text: Venue X10 (full name "[Divadlo X10](https://divadlox10.cz)") is located in the centre of Prague near the metro station *Národní Třída* (Line B) and *Můstek* (Line A,C). The address is [Charvátova 10/39, Prague 1, 110 00](https://goo.gl/maps/Yh8qWagnqB1DvK676) ([Google Maps](https://goo.gl/maps/Yh8qWagnqB1DvK676)).
-- title: Will there be any food or drink?
-  text: We don't know, but we'll do our best. This unfortunately depends on the sponsors.
+people:
+- id: mykola
+  name: Mykola Siusko
+  twitter: nicksvyaznoy
+  img: mykola.png
+- id: tree
+  name: Tree
+  twitter: treecz
+  img: tree.jpeg
+hosts:
+- mykola
+- tree
 program:
 - time: 9:00 - 9:30
   title: Registration & networking

src/routes/+layout.js

@@ -3,5 +3,5 @@ import config from '$lib/config';
 export async function load({ params, url, fetch }) {
 	return {
 		config
-    }
+	};
 }

src/routes/+layout.svelte

@@ -1,5 +1,5 @@
 <script>
-  import "../app.css";
+	import '../app.css';
 	export let data;
 
 	const menu = [
@@ -8,10 +8,9 @@
 		{ title: 'Program', url: '#program' },
 		{ title: 'Sponsors', url: '#sponsors' },
 		{ title: 'Ticket', url: '#ticket', class: 'button' }
-  ]
+	];
 </script>
 
-
 <div class="relative w-full min-h-screen text-white">
 	<div class="fixed w-full h-18 bg-black pt-6 md:pt-2 pb-2">
 		<div class="middle-pane-big bg-black">
@@ -33,15 +32,23 @@
 	<div class="w-full h-screen">
 		<div class="w-full h-full flex items-center text-center">
 			<div class="mx-auto">
-        <div class="text-5xl md:text-8xl font-bold uppercase mb-4 md:mb-8">{data.config.shortname}</div>
+				<div class="text-5xl md:text-8xl font-bold uppercase mb-4 md:mb-8">
+					{data.config.shortname}
+				</div>
 				<div class="text-3xl md:text-5xl md:mb-4">{data.config.date}</div>
-        <div class="text-3xl md:text-5xl">{data.config.venue}</div>
+				<div class="text-3xl md:text-5xl uppercase">{data.config.venue}</div>
 				<div class="mt-8 text-lg text-mild mx-4">
 					<p>Diving into the culture of the Web3 privacy industry</p>
-          <p><a href="https://prgblockweek.com" class="underline hover:no-underline external external-mild">Prague Blockchain Week 2023</a></p>
+					<p>
+						<a
+							href="https://prgblockweek.com"
+							target="_blank"
+							class="underline hover:no-underline external external-mild"
+							>Prague Blockchain Week 2023</a
+						>
+					</p>
 				</div>
 			</div>
-
 		</div>
 	</div>
 
@@ -59,7 +66,10 @@
 					<div class="">
 						<a class="inline-block w-5 mr-1" href="https://twitter.com/web3privacy">
 							<svg viewBox="0 0 29 26" fill="none" xmlns="http://www.w3.org/2000/svg">
-                <path d="M28.0266 3.12733C26.9955 3.62938 25.8872 3.96853 24.7242 4.12112C25.9113 3.34005 26.8231 2.10325 27.2524 0.629411C26.1413 1.35279 24.9107 1.87791 23.6009 2.16092C22.5522 0.934264 21.0578 0.167969 19.4039 0.167969C16.2285 0.167969 13.6538 2.99367 13.6538 6.47907C13.6538 6.97373 13.7047 7.45548 13.8028 7.91738C9.02398 7.6542 4.78719 5.14151 1.95117 1.3231C1.45622 2.25521 1.17259 3.33929 1.17259 4.49596C1.17259 6.68564 2.18771 8.61738 3.73058 9.74913C2.78804 9.71637 1.90142 9.43244 1.1262 8.95977C1.12555 8.98607 1.12555 9.01252 1.12555 9.03913C1.12555 12.0969 3.1076 14.6476 5.73804 15.2278C5.25556 15.3721 4.74758 15.4491 4.2232 15.4491C3.85268 15.4491 3.49255 15.4095 3.14137 15.3359C3.87315 17.8432 5.99658 19.6679 8.51282 19.7187C6.54493 21.4115 4.06569 22.4206 1.37163 22.4206C0.907503 22.4206 0.449828 22.3906 0 22.3323C2.54468 24.1231 5.56708 25.168 8.81424 25.168C19.3905 25.168 25.1742 15.5511 25.1742 7.21076C25.1742 6.93712 25.1686 6.66503 25.1576 6.39416C26.2809 5.50451 27.2556 4.39306 28.0265 3.12733H28.0266Z" fill="white"/>
+								<path
+									d="M28.0266 3.12733C26.9955 3.62938 25.8872 3.96853 24.7242 4.12112C25.9113 3.34005 26.8231 2.10325 27.2524 0.629411C26.1413 1.35279 24.9107 1.87791 23.6009 2.16092C22.5522 0.934264 21.0578 0.167969 19.4039 0.167969C16.2285 0.167969 13.6538 2.99367 13.6538 6.47907C13.6538 6.97373 13.7047 7.45548 13.8028 7.91738C9.02398 7.6542 4.78719 5.14151 1.95117 1.3231C1.45622 2.25521 1.17259 3.33929 1.17259 4.49596C1.17259 6.68564 2.18771 8.61738 3.73058 9.74913C2.78804 9.71637 1.90142 9.43244 1.1262 8.95977C1.12555 8.98607 1.12555 9.01252 1.12555 9.03913C1.12555 12.0969 3.1076 14.6476 5.73804 15.2278C5.25556 15.3721 4.74758 15.4491 4.2232 15.4491C3.85268 15.4491 3.49255 15.4095 3.14137 15.3359C3.87315 17.8432 5.99658 19.6679 8.51282 19.7187C6.54493 21.4115 4.06569 22.4206 1.37163 22.4206C0.907503 22.4206 0.449828 22.3906 0 22.3323C2.54468 24.1231 5.56708 25.168 8.81424 25.168C19.3905 25.168 25.1742 15.5511 25.1742 7.21076C25.1742 6.93712 25.1686 6.66503 25.1576 6.39416C26.2809 5.50451 27.2556 4.39306 28.0265 3.12733H28.0266Z"
+									fill="white"
+								/>
 							</svg>
 						</a>
 						<a href="https://twitter.com/web3privacy" class="text-2xl no-underline hover:underline">
@@ -67,7 +77,10 @@
 						</a>
 					</div>
 					<div class="mt-4 text-mild">
-            💛 Collaboration of <a href="https://web3privacy.info" class="external external-mild">Web3Privacy Now</a> & <a href="https://ethbrno.cz" class="external external-mild">ETHBrno</a> team
+						💛 Collaboration of <a href="https://web3privacy.info" class="external external-mild"
+							>Web3Privacy Now</a
+						>
+						& <a href="https://ethbrno.cz" class="external external-mild">ETHBrno</a> team
 					</div>
 				</div>
 			</div>

src/routes/+page.svelte

@@ -1,5 +1,6 @@
 <script>
 	import SvelteMarkdown from 'svelte-markdown';
+	import PeopleList from '$lib/components/PeopleList.svelte';
 
 	export let data;
 </script>
@@ -34,6 +35,17 @@
 	</div>
 </div>
 
+<div class="" id="hosts">
+	<div class="middle-pane-medium pt-16 text-xl text-center mx-auto">
+		<div class="section-header">Hosts</div>
+		<div class="mx-auto sm:w-1/3">
+			<div class="pb-16 grid grid-cols-2 gap-4 sm:gap-10">
+				<PeopleList items={data.config.hosts} people={data.config.people} />
+			</div>
+		</div>
+	</div>
+</div>
+
 <div class="bg-black" id="program">
 	<div class="middle-pane-medium pt-16 text-xl text-center mx-auto pb-32">
 		<div class="section-header">Program</div>
@@ -47,7 +59,12 @@
 			<tbody>
 				{#each data.config.program as pi}
 					<tr class="">
-                        <td class="text-right time xl:whitespace-nowrap sm:w-16 xl:w-36">{@html pi.time.split('-').map(x => x).join('<div class="xl:inline-block hidden mx-1">-</div>')} </td>
+						<td class="text-right time xl:whitespace-nowrap sm:w-16 xl:w-36"
+							>{@html pi.time
+								.split('-')
+								.map((x) => x)
+								.join('<div class="xl:inline-block hidden mx-1">-</div>')}
+						</td>
 						<td class="text-left">
 							<div class="text-xl">{pi.title} {pi.speakers ? '― ' + pi.speakers[0]?.name : ''}</div>
 							{#if pi.desc}
@@ -67,7 +84,12 @@
 	<div class="middle-pane-medium pt-16 text-xl text-center mx-auto pb-32">
 		<div class="section-header">Sponsors</div>
 		<div>
-            <a href="https://matrix.to/#/@tree:gwei.cz" target="_blank"><button class="py-2 px-5 bg-white text-black hover:bg-black border border-bg-white hover:text-white">Become a Sponsor</button></a>
+			<a href="https://matrix.to/#/@tree:gwei.cz" target="_blank"
+				><button
+					class="py-2 px-5 bg-white text-black hover:bg-black border border-bg-white hover:text-white"
+					>Become a Sponsor</button
+				></a
+			>
 		</div>
 	</div>
 </div>
@@ -75,9 +97,14 @@
 <div class="bg-black" id="ticket">
 	<div class="middle-pane-medium pt-16 text-xl text-center mx-auto pb-32">
 		<div class="section-header">Ticket</div>
+		<div class="mb-8 text-lg text-mild">Be a part of the first Web3Privacy Summit experience…</div>
 		<div class="grid lg:grid-cols-2 gap-10 md:w-2/3 mx-auto">
 			{#each data.config.tickets as tt}
-                <div class="bg-[#0d1117] hover:border-0 py-10 hover:text-black hover:bg-white px-10 cursor-pointer">
+				<div
+					class="bg-[#0d1117] hover:border-0 py-10 px-10 {false
+						? 'hover:text-black hover:bg-white cursor-pointer'
+						: ''}"
+				>
 					<div class="text-3xl uppercase">{tt.title}</div>
 					<div class="text-xl mt-6">{tt.price}</div>
 					<ul class="mt-6 text-lg text-left list-disc px-6">
@@ -94,6 +121,7 @@
 				</div>
 			{/each}
 		</div>
+		<div class="mt-8 text-xl">Tickets will go on sale in early March 2023.</div>
 	</div>
 </div>
 

tailwind.config.cjs

@@ -8,9 +8,9 @@ module.exports = {
 		extend: {
 			fontFamily: {
 				mono: ['Ubuntu Mono', ...defaultTheme.fontFamily.mono]
-			},
-    },
+			}
+		}
 	},
 	plugins: [],
-  darkMode: ['class'],
-}
+	darkMode: ['class']
+};