Add infos for campustour

1 files changed, 68 insertions, 28 deletions

diff --git a/index.html b/index.html
index 72371ec..c80af13 100644
--- a/index.html
+++ b/index.html
@@ -14,26 +14,37 @@
     <div class="w3-top">
         <div class="w3-bar w3-green w3-card w3-left-align w3-large">
             <button onclick="myFunction()" class="w3-bar-item w3-button w3-padding-large w3-white">Home</button>
-            <a href="https://youtu.be/gusAH25c5Zk" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" target="_blank">Trailer</a>
-            <a href="./map" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" target="_blank">Live-Map</a>
-            <a href="./sg" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" target="_blank">Neu: Survival
+            <a href="https://youtu.be/gusAH25c5Zk"
+                class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" target="_blank">Trailer</a>
+            <a href="./map" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white"
+                target="_blank">Live-Map</a>
+            <a href="https://discord.gg/dFGcb4jUd4"
+                class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" target="_blank">Neu:
+                Survival
                 Games</a>
-            <a href="https://discord.gg/dFGcb4jUd4" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" target="_blank">Event: Campusführung (18.11. um 18 Uhr)</a>
-            <a href="https://discord.gg/dFGcb4jUd4" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" target="_blank">Discord</a>
+            <a href="#campusfuehrung" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white">Event:
+                Campusführung (18.11. um 18 Uhr)</a>
+            <a href="https://discord.gg/dFGcb4jUd4"
+                class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" target="_blank">Discord</a>
         </div>
 
         <!-- Navbar on small screens -->
         <div id="navDemo" class="w3-bar-block w3-white w3-hide w3-hide-large w3-hide-medium w3-large" target="_blank">
-            <a href="https://youtu.be/gusAH25c5Zk" class="w3-bar-item w3-button w3-padding-large" target="_blank">Trailer</a>
+            <a href="https://youtu.be/gusAH25c5Zk" class="w3-bar-item w3-button w3-padding-large"
+                target="_blank">Trailer</a>
             <a href="./dynmap" class="w3-bar-item w3-button w3-padding-large" target="_blank">Live-Map</a>
-            <a href="https://discord.gg/dFGcb4jUd4" class="w3-bar-item w3-button w3-padding-large" target="_blank">Neu: Survival Games</a>
-            <a href="https://discord.gg/dFGcb4jUd4" class="w3-bar-item w3-button w3-padding-large" target="_blank">Event: Campusführung (18.11. um 18 Uhr)</a>
-            <a href="https://discord.gg/dFGcb4jUd4" class="w3-bar-item w3-button w3-padding-large" target="_blank">Discord</a>
+            <a href="https://discord.gg/dFGcb4jUd4" class="w3-bar-item w3-button w3-padding-large" target="_blank">Neu:
+                Survival Games</a>
+            <a href="#campusfuehrung" class="w3-bar-item w3-button w3-padding-large">Event:
+                Campusführung (18.11. um 18 Uhr)</a>
+            <a href="https://discord.gg/dFGcb4jUd4" class="w3-bar-item w3-button w3-padding-large"
+                target="_blank">Discord</a>
         </div>
     </div>
 
     <!-- Header -->
-    <header class="w3-container w3-black w3-center" style="padding:56px 16px 56px 16px; background-image: url('./schloss.png'); background-repeat: no-repeat; background-position: center; background-size: cover;">
+    <header class="w3-container w3-black w3-center"
+        style="padding:56px 16px 56px 16px; background-image: url('./schloss.png'); background-repeat: no-repeat; background-position: center; background-size: cover;">
         <h1 class="w3-margin w3-jumbo mctitle">Der Minecraft Campus<br><br><br></h1>
         <p class="w3-xlarge mcfont" style="color: rgb(234, 235, 243);">Besuche den KIT-Campus in Minecraft!</p>
 
@@ -43,11 +54,12 @@
         <div class="w3-content">
             <div class="w3-twothird">
                 <h1>Der KIT-Campus als Minecraft-Welt</h1>
-                <div class="w3-padding-32 w3-text mcfont">Um sich den virtuellen Campus anzusehen, benötigst du die Minecraft Java Edition. So kommst du auf den Campus:
+                <div class="w3-padding-32 w3-text mcfont">Um sich den virtuellen Campus anzusehen, benötigst du die
+                    Minecraft Java Edition. So kommst du auf den Campus:
                     <ol>
                         <li>Starte Minecraft in der Version 1.16.3 oder neuer</li>
                         <li>Gehe auf Multiplayer > Server hinzufügen</li>
-                        <li>Server-Adresse: "kobert.dev"</li>
+                        <li>Server-Adresse: "campus-kit.de"</li>
                     </ol>
                 </div>
             </div>
@@ -61,25 +73,47 @@
         <div class="w3-content">
             <h1>Was erwartet dich auf dem Campus?</h1>
             <div class="w3-padding-64 w3-third w3-center">
-                <div style="display: block; margin:auto; position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; width: 100%; height: auto;" class="w3-half">
+                <div style="display: block; margin:auto; position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; width: 100%; height: auto;"
+                    class="w3-half">
                     <iframe style="position: absolute; 
                     top: 0; 
                     left: 0; 
                     width: 100%; 
-                    height: 100%;" width="718" height="303" src="https://www.youtube-nocookie.com/embed/gusAH25c5Zk" frameborder="0" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+                    height: 100%;" width="718" height="303" src="https://www.youtube-nocookie.com/embed/gusAH25c5Zk"
+                        frameborder="0"
+                        allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+                        allowfullscreen></iframe>
                 </div>
             </div>
             <div class="w3-twothird">
-            <div class="w3-padding-32 w3-text mcfont" style="margin-left:5%">
-                <ol>
-                    <li>Erkunde den Campus anhand der Live-Karte (oben verlinkt) und vergleiche ihn mit der Realität (ich empfehle google maps).</li>
-                    <li>Erfahre mehr über die Gebäude auf dem Campus - an einigen finden sich kleine Texte mit Hintergründen.</li>
-                    <li>Nimm teil an den Minigames auf dem Campus! Mehr Infos dazu gibt es auf Discord (oben verlinkt).</li>
-                    <li>Du hast immer noch nicht genug? Vielleicht gibt es noch eine live-Campusführung - ob dieses Event stattfindet, steht aber aktuell noch nicht fest.</li>
-                </ol>
+                <div class="w3-padding-32 w3-text mcfont" style="margin-left:5%">
+                    <ol>
+                        <li>Erkunde den Campus anhand der Live-Karte (oben verlinkt) und vergleiche ihn mit der Realität
+                            (wir empfehlen google maps).</li>
+                        <li>Erfahre mehr über die Gebäude auf dem Campus - an einigen finden sich kleine Texte mit
+                            Hintergründen.</li>
+                        <li>Nimm teil an den Minigames auf dem Campus! Mehr Infos dazu findest du auf Discord.</li>
+                        <li>Am 18.11. gibt es eine Campusführung um 18 Uhr.</li>
+                    </ol>
 
+                </div>
             </div>
+            <div id="campusfuehrung"></div>
+            <h1>Die Campusführung in Minecraft</h1>
+            <div class="w3-padding-32 w3-text mcfont">
+                Die Campusführung findet um 18 Uhr am 18.11. statt. <br>
+                Du kannst entweder in Minecraft mit herumlaufen während der Führung, oder du schaust einfach auf Zoom
+                zu.
+                <br>
+                Zoom-Zugangsdaten: <a
+                    href="https://kit-lecture.zoom.us/j/65375315081?pwd=Ky9ZM1NLcWxCS0s5c3pDRHQvSWV2dz09"
+                    target="_blank">https://kit-lecture.zoom.us/j/65375315081?pwd=Ky9ZM1NLcWxCS0s5c3pDRHQvSWV2dz09</a>
+                <br>
+
+                Meeting-ID: 653 7531 5081, Kenncode: 428117
             </div>
+
+
         </div>
     </div>
     <figure style="margin:0;">
@@ -91,10 +125,13 @@
             <div class="w3-padding-32 w3-text mcfont">
                 Im Wesentlichen teilt sich das Vorgehen in unserem Fall zwei Schritte auf:
                 <ol>
-                    <li>Man importiert vom Campus existierende 3D-Daten in Minecraft. Dann existieren die Gebäude, aber die Texturen fehlen noch.</li>
-                    <li>Man bearbeitet die Gebäude manuell, in unserem Fall mit "Worldedit". Dies benötigt sehr viel Zeit, deshalb sind wir auch noch lange nicht mit allen Gebäuden fertig.</li>
+                    <li>Man importiert vom Campus existierende 3D-Daten in Minecraft. Dann hat man schon mal die Umrisse
+                        der Gebäude, aber die Texturen fehlen noch.</li>
+                    <li>Man bearbeitet die Gebäude manuell, in unserem Fall mit "Worldedit". Dies benötigt sehr viel
+                        Zeit, deshalb sind wir auch noch lange nicht mit allen Gebäuden fertig.</li>
                 </ol>
-                Noch ein Tipp zum Schluss: Erfahre mehr über die Entstehungsgeschichte der Aktion und über das Studium am KIT aus der Sicht von Studierenden - in unserem neuen Podcast (oben verlinkt wenn verfügbar)!
+                Noch ein Tipp zum Schluss: Erfahre mehr über die Entstehungsgeschichte der Aktion und über das Studium
+                am KIT aus der Sicht von Studierenden - in unserem neuen Podcast (oben verlinkt wenn verfügbar)!
             </div>
 
         </div>
@@ -118,15 +155,18 @@
             <div class="w3-twothird">
                 <h1>Unser Discord-Server </h1>
 
-                <p class="w3-text-grey mcfont">Verpasse keine neue Aktion auf dem Server! Für Fragen, Feedback, gegenseitigen Austausch, Ankündigung von weiteren Aktionen, oder falls du Lust bekommen hast selbst mitzuhelfen. Zum Beitreten einfach oben auf "Discord" klicken.
+                <p class="w3-text-grey mcfont">Verpasse keine neue Aktion auf dem Server! Für Fragen, Feedback,
+                    gegenseitigen Austausch, Ankündigung von weiteren Aktionen, oder falls du Lust bekommen hast selbst
+                    mitzuhelfen. Zum Beitreten einfach oben auf "Discord" klicken.
                 </p>
             </div>
             <div class="w3-twothird">
                 <h1>Unser Podcast </h1>
 
-               <p class="w3-text-grey mcfont">
-               In der ersten Episode des Podcast Campus Life (WIP) erzählen wir euch die Entstehungsgeschichte des Minecraft Campus.
-               </p>
+                <p class="w3-text-grey mcfont">
+                    In der ersten Episode des Podcast Campus Life (WIP) erzählen wir euch die Entstehungsgeschichte des
+                    Minecraft Campus.
+                </p>
                 <audio controls="controls" src="audio/campus_live_0.mp3">
                     Your browser does not support the HTML5 Audio element.
                 </audio>