feat(important): Add important information for Hackaburg 2024

src/routes/+page.svelte

@@ -4,6 +4,9 @@
 	import 'flowbite/dist/flowbite.css';
 	import Hero from './landing/Hero.svelte';
 	import About from './landing/About.svelte';
+	import Supporters from './landing/Supporters.svelte';
+	import Venue from './landing/Venue.svelte';
+	import FAQ from './landing/FAQ.svelte';
 	import Behind from './landing/Behind.svelte';
 
 	import Footer from './components/Footer.svelte';
@@ -16,9 +19,12 @@
 <div class="container mx-auto">
 	<Hero />
 	<Timeline />
+	<Supporters />
 	<Team />
-	<About />
 	<Behind />
+	<About />
+	<Venue />
+	<FAQ />
 </div>
 <Footer />
 

src/routes/components/Event.svelte

@@ -2,7 +2,7 @@
 	export let hours: number;
 	export let minutes: number;
 	export let food: boolean | undefined = undefined;
-	export let hidden: boolean | undefined = undefined;
+	// export let hidden: boolean | undefined = undefined;
 	export let special: boolean | undefined = undefined;
 	export let time: string;
 	export let title: string;

src/routes/components/Nav.svelte

@@ -43,6 +43,9 @@
 				<li class="mt-2 hover:text-hackaburg-900">
 					<a href="/#timeline" class="nav-element-base">Timeline</a>
 				</li>
+				<li class="mt-2 hover:text-hackaburg-900">
+					<a href="/#supporters" class="nav-element-base">Supporters</a>
+				</li>
 				<li class="mt-2 hover:text-hackaburg-900">
 					<a href="/#team" class="nav-element-base">Team</a>
 				</li>
@@ -52,6 +55,12 @@
 				<li class="mt-2 hover:text-hackaburg-900">
 					<a href="/#behind" class="nav-element-base">Behind Hackaburg</a>
 				</li>
+				<li class="mt-2 hover:text-hackaburg-900">
+					<a href="/#venue" class="nav-element-base">Venue</a>
+				</li>
+				<li class="mt-2 hover:text-hackaburg-900">
+					<a href="/#faq" class="nav-element-base">FAQ</a>
+				</li>
 			</ul>
 		</div>
 	</div>

src/routes/landing/About.svelte

@@ -62,7 +62,7 @@
 		{#each events as event, i}
 			<div class="glow bg-black rounded-2xl dark:bg-gray-800 ml-4 relative">
 				<div class="relative">
-					<img class="rounded-ss-xl rounded-se-xl w-full" src={event.img} />
+					<img class="rounded-ss-xl rounded-se-xl w-full" alt="event" src={event.img} />
 				</div>
 				<div class="p-5">
 					<h5 class="mb-2 text-2xl font-bold tracking-tight text-white dark:text-white">

src/routes/landing/Behind.svelte

@@ -17,7 +17,7 @@
 				we organize other IT events in the Regensburg region in addition to Hackaburg.
 			</p>
 			<div>
-				<a href="https://ratisbona-coding.org/" target="_blank">
+				<a href="https://ratisbona-coding.org/" target="_blank" rel="noreferrer">
 					<div class="relative group">
 						{#if glowVisible}
 							<div
@@ -26,6 +26,9 @@
 						{/if}
 
 						<button
+							on:focus={() => {
+								return;
+							}}
 							on:mouseover={() => {
 								glowVisible = true;
 							}}
@@ -46,7 +49,7 @@
 			class="absolute -inset-0.5 -mt-1 -mb-1 bg-gradient-to-r from-primary to-primary rounded-lg blur opacity-75 group-hover:opacity-100"
 		/>
 		<div class="relative">
-			<img class="mt-8 rounded-2xl w-full" src={ratisbonacoding} />
+			<img class="mt-8 rounded-2xl w-full" alt="ratisbona coding" src={ratisbonacoding} />
 		</div>
 	</div>
 </BaseComponent>

src/routes/landing/FAQ.svelte

@@ -0,0 +1,97 @@
+<script>
+	import BaseComponent from '../components/BaseComponent.svelte';
+	import Button from '../components/Button.svelte';
+
+	const faq = [
+		{
+			question: 'What exactly is a hackathon?',
+			answer: `A hackathon is an event in which software developers, designers and entrepreneurs come
+				together and work on an idea for a few days. The event will be sponsored by companies, that
+				means we have exciting prizes and planned key notes for you! There is also a career fair
+				waiting for you to be checked out and of course free food and drinks.`
+		},
+		{
+			question: 'How many people will be there?',
+			answer: `We re planning with 120 attendees, 90% students and 10% professionals! Just apply here!`
+		},
+		{
+			question: 'What can I build?',
+			answer: `Anything your heart desires! Hardware, web, mobile, gaming; you name it, we'll support it.`
+		},
+		{
+			question: 'How do I find a team?',
+			answer: `A team has to be smaller than 5 people. On the first day, we will have a short pitch event.
+        That means, you can come with an idea and tell everyone what you're looking for or you get inspired
+        by other people. Maximum team size is 5 but of course you also can work in projects on smaller teams.
+        The minimum team size is 3 people.`
+		},
+		{
+			question: 'Overnight stay?',
+			answer: `Sure! We'll provide beds at the event location.
+        Please contact us if you are in need of a place to sleep, as we only have limited availability.`
+		},
+		{
+			question: 'Do I have to be a programmer to attend?',
+			answer: `<b>No!</b> We're looking for a diverse group of people who want to work on an idea for a few days.
+        You're a designer? Help create the user interface. You're a business rockstar?
+        Help create a business or customer plan. You want to try coding for the first time?
+        We will have introduction workshops that will give you a first glance into programming.`
+		},
+		{
+			question: 'What about hardware?',
+			answer: `We'll have a hardware lounge with plenty of boards, tools, and gadgets for you to check out!`
+		},
+		{
+			question: 'Headstart?',
+			answer: `Only projects started at the hackathon will be eligible for prizes.`
+		},
+		{
+			question: 'What should I bring to the event?',
+			answer: `Your computer (laptop or desktop), any electronics want to use, chargers, toiletries and a
+      sleeping bag or blanket and pillow if you're planning to stay over night and we hope you will!
+      And of course, a valid ID.`
+		},
+		{
+			question: 'Will there be travel reimbursements available?',
+			answer: `Yes! If you're coming from outside the Oberpfalz area, it s possible to apply for reimbursement
+      to cover some of your travel expenses. This also includes an overnight stay from Saturday to Sunday if
+      you can't reasonably get home after the event. Depending on where you come from, the reimbursement can be up to:
+      <ul class="m-2">
+      <li>Bavaria (outside of the Oberpfalz area): 32€</li>
+      <li>Germany: 50€</li>
+      <li>Rest of Europe (SEPA area): 90€</li>
+      </ul>
+      <div><b>We only support transport by train and carpools of 2 people minimum.</b></div>
+      Important note: We can only transfer money in the SEPA area! Thus, be ready to provide your travel receipts and bank address (IBAN).
+      `
+		}
+	];
+</script>
+
+<BaseComponent
+	headline={'Frequently asked questions'}
+	subHeadline={'Questions and answers'}
+	id={'faq'}
+>
+	<div class="w-full max-w-3xl mx-auto">
+		<div class="-my-6 sm:p-10">
+			{#each faq as { question, answer }, i}
+				<div class="group my-2 mt-7">
+					<div class="font-caveat font-medium text-2xl text-primary mb-1 sm:mb-0">
+						{question}
+					</div>
+
+					<!-- Content -->
+					<div class="text-gray-300">
+						{@html answer}
+					</div>
+				</div>
+			{/each}
+		</div>
+	</div>
+	<div class="w-full flex justify-center">
+		<a href="mailto:[email protected]">
+			<Button label="Need support? Contact us!" />
+		</a>
+	</div>
+</BaseComponent>

src/routes/landing/Hero.svelte

@@ -12,12 +12,17 @@
 			</h1>
 
 			<p class="mb-6 font-light text-white lg:mb-8 text-xl dark:text-gray-400">
-				We are currently working on the next edition of Hackaburg. Stay tuned for more information.
+				The registration is NOW open! <br />Lets's connect the unconnected.
 			</p>
 			<p class="mb-6 font-bold text-white lg:mb-8 text-xl dark:text-gray-400">
 				<b class="text-primary">23.5. - 25.5.2024</b> | Techbase Regensburg
 			</p>
-			<div class="sm:flex md:space-x-4 -mt-10">
+			<div>
+				<a href="https://hackaburg.de/apply/" target="_blank" rel="noreferrer">
+					<Button label="APPLY NOW" />
+				</a>
+			</div>
+			<div class="sm:flex md:space-x-4">
 				<div>
 					<a
 						href="https://26490796.sibforms.com/serve/MUIFAPx4aKGKuMbU3UZxk_ODAxapOpxY9oApe-LFK48oC2HcUpuUDG5RfLrplRnzmlE2fhnxFsrLWAO1LoVerg8hegpCyxQDQ85Ac45SzhCZXZlT8m5RRT7wDfIbcv9GgTCPGWiw6QSSK2qQR2n6ST8ezKWg-QTn0tCj8LRENn-vhJpHafi3096LcWLZQXDIx_IzJZaOLL7Chfdk"

src/routes/landing/Supporters.svelte

@@ -0,0 +1,144 @@
+<script>
+	import BaseComponent from '../components/BaseComponent.svelte';
+
+	import continental from '$lib/images/supporters/conti.png';
+	import krones from '$lib/images/supporters/syskron.png';
+	import tcon from '$lib/images/supporters/tcon.png';
+	import trinnovative from '$lib/images/supporters/trinnovative.png';
+	import internetx from '$lib/images/supporters/internetx.png';
+	import rnext from '$lib/images/supporters/rnext.png';
+	import infineon from '$lib/images/supporters/infineon.png';
+	import intive from '$lib/images/supporters/intive.png';
+	import vector from '$lib/images/supporters/vector.png';
+	import edag from '$lib/images/supporters/edag.png';
+	import zollner from '$lib/images/supporters/zollner.png';
+	import msg from '$lib/images/supporters/msg.png';
+
+	let images = {
+		partners: [],
+		starter_1: [
+			{
+				src: msg,
+				alt: 'MSG Group',
+				link: 'https://www.msg.group'
+			},
+			{
+				src: trinnovative,
+				alt: 'Trinnovative',
+				link: 'https://www.trinnovative.de/'
+			},
+			{
+				src: edag,
+				alt: 'EDAG',
+				link: 'https://www.edag.com/de/'
+			},
+			{
+				src: intive,
+				alt: 'intive',
+				link: 'https://intive.com'
+			}
+		],
+		starter_2: [
+			{
+				src: internetx,
+				alt: 'InternetX',
+				link: 'https://www.internetx.com'
+			}
+		],
+		medium: [
+			{
+				src: infineon,
+				alt: 'Infineon',
+				link: 'https://www.infineon.com/cms/de/'
+			},
+			{
+				src: tcon,
+				alt: 'tcon',
+				link: 'https://careers.team-con.de'
+			},
+			{
+				src: vector,
+				alt: 'Vector',
+				link: 'https://jobs.vector.com'
+			},
+			{
+				src: krones,
+				alt: 'Syskron',
+				link: 'https://www.krones.com/en/career/krones.digital.php'
+			}
+		],
+		premium: [
+			{
+				src: continental,
+				alt: 'Continental',
+				link: 'https://www.continental.com/en/career/'
+			},
+			{
+				src: rnext,
+				alt: 'R-Next',
+				link: 'https://www.regensburg.de/r-next'
+			},
+			{
+				src: zollner,
+				alt: 'Zollner',
+				link: 'https://www.zollner.de/karriere',
+				class: 'md:ml-0'
+			}
+		]
+	};
+</script>
+
+<BaseComponent
+	headline={'Supporters'}
+	subHeadline={'Without them, Hackaburg would not be possible'}
+	id={'supporters'}
+>
+	<div class="bg-white md:mt-8 mt-4 sm:p-2 rounded-2xl glow">
+		<!--
+	<h2 class="text-2xl font-bold text-center text-black-800 mb-8 hackaburg">OUR PARTNERS</h2>
+
+	<div class="grid grid-cols-1 md:grid-cols-2">
+		{#each images.partners as partner}
+			<div class="p-3">
+				<img src={partner.src} alt={partner.alt} />
+			</div>
+		{/each}
+	</div>
+	-->
+
+		<h2 class="text-2xl font-bold text-center text-black-800 my-4 uppercase emerald">
+			Our Sponsors
+		</h2>
+
+		<div class="grid grid-cols-1 md:grid-cols-3">
+			{#each images.premium as image}
+				<a class="p-3 " href={image.link}>
+					<img src={image.src} alt={image.alt} />
+				</a>
+			{/each}
+		</div>
+		<hr />
+		<div class="grid grid-cols-1 md:grid-cols-4">
+			{#each images.medium as image}
+				<a class="p-3 m-auto" href={image.link}>
+					<img src={image.src} class="w-60" alt={image.alt} />
+				</a>
+			{/each}
+		</div>
+		<hr />
+		<div class="grid grid-cols-1 md:grid-cols-4">
+			{#each images.starter_1 as image}
+				<a class="p-3 m-auto" href={image.link}>
+					<img src={image.src} class="w-40" alt={image.alt} />
+				</a>
+			{/each}
+		</div>
+		<div class="grid grid-cols-1 md:grid-cols-3">
+			{#each images.starter_2 as image}
+				<a class="p-3 m-auto" href={image.link}>
+					<img src={image.src} class="w-40" alt={image.alt} />
+				</a>
+			{/each}
+		</div>
+	</div>
+</BaseComponent>

src/routes/landing/Timeline.svelte

@@ -3,7 +3,7 @@
 
 	const timeline = [
 		{
-			date: 'March 15, 2024',
+			date: 'March 17, 2024',
 			title: 'Registration opens',
 			content:
 				'At this day, you can fill your <b class="text-primary">profile form</b> (only takes 5min) and register for Hackaburg 2024. A <b class="text-primary">button</b> to our registration tool will appear on the website on that day, so you can not miss it.</b>'