CTT
/
tdf-webseite
forked from cal/tdf-2023-webseite
13
0
Fork 1
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

Floorplan

Browse Source
main
Martin Braun 2 days ago
parent 1edac0adbb
commit ba5482d462
7 changed files with 92 additions and 72 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 56
      en/venue.html
  2. BIN
      image/Etagen_2. OG.png
  3. BIN
      image/Etagen_6. OG.png
  4. BIN
      image/Etagen_7. OG.png
  5. BIN
      image/Etagen_EG.png
  6. 54
      styles-5.5.css
  7. 54
      venue.html

56
en/venue.html
Unescape View File

@ -69,27 +69,31 @@
<div style="display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1em;"> <div style="display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1em;">
<div> <div>
<ul> <ul>
<li><a href="#floor-eg" class="location-link" data-target="bar-foyer">Bar in Foyer</a></li> <li><a href="#floor-eg" class="location-link" data-target="bar">Bar</a></li>
<li><a href="#floor-eg" class="location-link" data-target="buehne-1">Stage 1</a></li> <li><a href="#floor-eg" class="location-link" data-target="kasse">Cash</a></li>
<li><a href="#floor-6" class="location-link" data-target="buehne-2">Stage 2</a></li> <li><a href="#floor-eg" class="location-link" data-target="chaospost">Chaospost</a></li>
<li><a href="#floor-6" class="location-link" data-target="cafeteria">Cafeteria</a></li> <li><a href="#floor-6" class="location-link" data-target="kaffee">Coffee</a></li>
<li><a href="#floor-eg" class="location-link" data-target="elfenhain">Elfenhain</a></li>
<li><a href="#floor-eg" class="location-link" data-target="ewiges-fruehstueck">Eternal Breakfast</a></li>
</ul> </ul>
</div> </div>
<div> <div>
<ul> <ul>
<li><a href="#floor-eg" class="location-link" data-target="elfenhain">Elfenhain</a></li> <li><a href="#floor-eg" class="location-link" data-target="hackcenter">Hackcenter</a></li>
<li><a href="#floor-eg" class="location-link" data-target="foyer">Foyer</a></li>
<li><a href="#floor-eg" class="location-link" data-target="hackspace">Hackcenter</a></li>
<li><a href="#floor-eg" class="location-link" data-target="infodesk">Infodesk</a></li> <li><a href="#floor-eg" class="location-link" data-target="infodesk">Infodesk</a></li>
<li><a href="#floor-6" class="location-link" data-target="kaffee">Coffee</a></li> <li><a href="#floor-6" class="location-link" data-target="kids-space">Kids Space</a></li>
<li><a href="#floor-eg" class="location-link" data-target="kasse">Cashier</a></li> <li><a href="#floor-eg" class="location-link" data-target="vortraege-1">Lectures in BOOL</a></li>
<li><a href="#floor-6" class="location-link" data-target="vortraege-2">Lectures in ENUM</a></li>
<li><a href="#floor-6" class="location-link" data-target="projekte">Projects</a></li>
</ul> </ul>
</div> </div>
<div> <div>
<ul> <ul>
<li><a href="#floor-6" class="location-link" data-target="projekte">Projects</a></li> <li><a href="#floor-eg" class="location-link" data-target="spuelkueche">Scullery</a></li>
<li><a href="#floor-7" class="location-link" data-target="skybar">SKYBAR</a></li> <li><a href="#floor-eg" class="location-link" data-target="siggi-11">Siggi 11</a></li>
<li><a href="#floor-7" class="location-link" data-target="skybar">Skybar</a></li>
<li><a href="#floor-6" class="location-link" data-target="waffeln">Waffles</a></li> <li><a href="#floor-6" class="location-link" data-target="waffeln">Waffles</a></li>
<li><a href="#floor-eg" class="location-link" data-target="workshops">Workshops</a></li>
</ul> </ul>
</div> </div>
</div> </div>
@ -97,27 +101,31 @@
<div class="box floor-plan" id="floor-eg"> <div class="box floor-plan" id="floor-eg">
<img src="../image/Etagen_EG.png" alt="Ground floor plan" class="floor-plan-image" /> <img src="../image/Etagen_EG.png" alt="Ground floor plan" class="floor-plan-image" />
<div class="location-marker" data-location="bar-foyer" style="top: 40%; left: 36%;"></div> <div class="location-marker" data-location="bar" style="top: 40%; left: 34%;"></div>
<div class="location-marker" data-location="buehne-1" style="top: 36%; left: 85%;"></div> <div class="location-marker" data-location="chaospost" style="top: 34%; left: 28%;"></div>
<div class="location-marker" data-location="elfenhain" style="top: 60%; left: 93%;"></div> <div class="location-marker" data-location="infodesk" style="top: 30%; left: 35%;"></div>
<div class="location-marker" data-location="foyer" style="top: 28%; left: 36%;"></div> <div class="location-marker" data-location="kasse" style="top: 34%; left: 28%;"></div>
<div class="location-marker" data-location="hackspace" style="top: 36%; left: 60%;"></div> <div class="location-marker" data-location="ewiges-fruehstueck" style="top: 34%; left: 28%;"></div>
<div class="location-marker" data-location="infodesk" style="top: 20%; left: 29%;"></div> <div class="location-marker" data-location="siggi-11" style="top: 34%; left: 28%;"></div>
<div class="location-marker" data-location="kasse" style="top: 40%; left: 36%;"></div> <div class="location-marker" data-location="hackcenter" style="top: 27%; left: 52%;"></div>
<div class="location-marker" data-location="vortraege-1" style="top: 19%; left: 72%;"></div>
<div class="location-marker" data-location="elfenhain" style="top: 27%; left: 88%;"></div>
<div class="location-marker" data-location="spuelkueche" style="top: 44%; left: 58%;"></div>
<div class="location-marker" data-location="workshops" style="top: 89%; left: 19%;"></div>
</div> </div>
<div class="box floor-plan" id="floor-6"> <div class="box floor-plan" id="floor-6">
<img src="../image/Etagen_6. OG.png" alt="6th floor plan" class="floor-plan-image" /> <img src="../image/Etagen_6. OG.png" alt="6th floor plan" class="floor-plan-image" />
<div class="location-marker" data-location="projekte" style="top: 75%; left: 64%;"></div> <div class="location-marker" data-location="vortraege-2" style="top: 78%; left: 23%;"></div>
<div class="location-marker" data-location="buehne-2" style="top: 41%; left: 20%;"></div> <div class="location-marker" data-location="kids-space" style="top: 88%; left: 44%;"></div>
<div class="location-marker" data-location="cafeteria" style="top: 58%; left: 82%;"></div> <div class="location-marker" data-location="projekte" style="top: 84%; left: 77%;"></div>
<div class="location-marker" data-location="kaffee" style="top: 58%; left: 82%;"></div> <div class="location-marker" data-location="kaffee" style="top: 57%; left: 85%;"></div>
<div class="location-marker" data-location="waffeln" style="top: 58%; left: 82%;"></div> <div class="location-marker" data-location="waffeln" style="top: 49%; left: 84%;"></div>
</div> </div>
<div class="box floor-plan" id="floor-7"> <div class="box floor-plan" id="floor-7">
<img src="../image/Etagen_7. OG.png" alt="7th floor plan" class="floor-plan-image" /> <img src="../image/Etagen_7. OG.png" alt="7th floor plan" class="floor-plan-image" />
<div class="location-marker" data-location="skybar" style="top: 35%; left: 36%;"></div> <div class="location-marker" data-location="skybar" style="top: 78%; left: 48%;"></div>
</div> </div>
</div> </div>

BIN
image/Etagen_2. OG.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 37 KiB

BIN
image/Etagen_6. OG.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 58 KiB

After

Width:  |  Height:  |  Size: 58 KiB

BIN
image/Etagen_7. OG.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 46 KiB

After

Width:  |  Height:  |  Size: 38 KiB

BIN
image/Etagen_EG.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 68 KiB

After

Width:  |  Height:  |  Size: 99 KiB

54
styles-5.5.css
Unescape View File

@ -543,40 +543,44 @@ b {
.location-marker { .location-marker {
position: absolute; position: absolute;
width: 40px; width: 72px;
height: 40px; height: 72px;
border: 6px solid #00ff66;
border-radius: 50%;
background: rgba(0, 255, 102, 0.6);
display: none; display: none;
z-index: 10; z-index: 10;
animation: pulse 2s infinite;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
box-shadow: 0 0 20px #00ff66, 0 0 40px #00ff66, 0 0 60px #00ff66; background: transparent;
animation: crosshair-pulse 2s infinite;
filter: drop-shadow(0 0 5px #ff00cc) drop-shadow(0 0 12px #ff00cc);
} }
.location-marker.active { .location-marker.active {
display: block; display: block;
} }
@keyframes pulse { /* Two rotated bars with a gap in the middle form a diagonal crosshair */
0% { .location-marker::before,
transform: translate(-50%, -50%) scale(1); .location-marker::after {
opacity: 1; content: '';
box-shadow: 0 0 20px #00ff66, 0 0 40px #00ff66, 0 0 60px #00ff66; position: absolute;
} top: 50%;
left: 0;
50% { width: 100%;
transform: translate(-50%, -50%) scale(1.3); height: 3px;
opacity: 0.8; margin-top: -1.5px;
box-shadow: 0 0 30px #00ff66, 0 0 60px #00ff66, 0 0 90px #00ff66; background: linear-gradient(to right,
} #ff00cc 0%, #ff00cc 33%,
transparent 33%, transparent 67%,
100% { #ff00cc 67%, #ff00cc 100%
transform: translate(-50%, -50%) scale(1); );
opacity: 1; }
box-shadow: 0 0 20px #00ff66, 0 0 40px #00ff66, 0 0 60px #00ff66;
} .location-marker::before { transform: rotate(45deg); }
.location-marker::after { transform: rotate(-45deg); }
@keyframes crosshair-pulse {
0% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
50% { opacity: 0.6; transform: translate(-50%, -50%) scale(1.3); }
100% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
} }

54
venue.html
Unescape View File

@ -71,27 +71,31 @@
<div style="display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1em;"> <div style="display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1em;">
<div> <div>
<ul> <ul>
<li><a href="#floor-eg" class="location-link" data-target="bar-foyer">Bar im Foyer</a></li> <li><a href="#floor-eg" class="location-link" data-target="bar">Bar</a></li>
<li><a href="#floor-eg" class="location-link" data-target="buehne-1">Bühne 1</a></li> <li><a href="#floor-eg" class="location-link" data-target="chaospost">Chaospost</a></li>
<li><a href="#floor-6" class="location-link" data-target="buehne-2">Bühne 2</a></li> <li><a href="#floor-eg" class="location-link" data-target="elfenhain">Elfenhain</a></li>
<li><a href="#floor-6" class="location-link" data-target="cafeteria">Cafeteria</a></li> <li><a href="#floor-eg" class="location-link" data-target="ewiges-fruehstueck">Ewiges Frühstück</a></li>
<li><a href="#floor-eg" class="location-link" data-target="hackcenter">Hackcenter</a></li>
<li><a href="#floor-eg" class="location-link" data-target="infodesk">Infodesk</a></li>
</ul> </ul>
</div> </div>
<div> <div>
<ul> <ul>
<li><a href="#floor-eg" class="location-link" data-target="elfenhain">Elfenhain</a></li>
<li><a href="#floor-eg" class="location-link" data-target="foyer">Foyer</a></li>
<li><a href="#floor-eg" class="location-link" data-target="hackspace">Hackcenter</a></li>
<li><a href="#floor-eg" class="location-link" data-target="infodesk">Infodesk</a></li>
<li><a href="#floor-6" class="location-link" data-target="kaffee">Kaffee</a></li> <li><a href="#floor-6" class="location-link" data-target="kaffee">Kaffee</a></li>
<li><a href="#floor-eg" class="location-link" data-target="kasse">Kasse</a></li> <li><a href="#floor-eg" class="location-link" data-target="kasse">Kasse</a></li>
<li><a href="#floor-6" class="location-link" data-target="kids-space">Kids Space</a></li>
<li><a href="#floor-6" class="location-link" data-target="projekte">Projekte</a></li>
<li><a href="#floor-eg" class="location-link" data-target="siggi-11">Siggi 11</a></li>
<li><a href="#floor-7" class="location-link" data-target="skybar">Skybar</a></li>
</ul> </ul>
</div> </div>
<div> <div>
<ul> <ul>
<li><a href="#floor-6" class="location-link" data-target="projekte">Projekte</a></li> <li><a href="#floor-eg" class="location-link" data-target="spuelkueche">Spülküche</a></li>
<li><a href="#floor-7" class="location-link" data-target="skybar">SKYBAR</a></li> <li><a href="#floor-eg" class="location-link" data-target="vortraege-1">Vorträge in BOOL</a></li>
<li><a href="#floor-6" class="location-link" data-target="vortraege-2">Vorträge in ENUM</a></li>
<li><a href="#floor-6" class="location-link" data-target="waffeln">Waffeln</a></li> <li><a href="#floor-6" class="location-link" data-target="waffeln">Waffeln</a></li>
<li><a href="#floor-eg" class="location-link" data-target="workshops">Workshops</a></li>
</ul> </ul>
</div> </div>
</div> </div>
@ -99,27 +103,31 @@
<div class="box floor-plan" id="floor-eg"> <div class="box floor-plan" id="floor-eg">
<img src="image/Etagen_EG.png" alt="Grundriss Erdgeschoss" class="floor-plan-image" /> <img src="image/Etagen_EG.png" alt="Grundriss Erdgeschoss" class="floor-plan-image" />
<div class="location-marker" data-location="bar-foyer" style="top: 40%; left: 36%;"></div> <div class="location-marker" data-location="bar" style="top: 40%; left: 34%;"></div>
<div class="location-marker" data-location="buehne-1" style="top: 36%; left: 85%;"></div> <div class="location-marker" data-location="chaospost" style="top: 34%; left: 28%;"></div>
<div class="location-marker" data-location="elfenhain" style="top: 60%; left: 93%;"></div> <div class="location-marker" data-location="infodesk" style="top: 30%; left: 35%;"></div>
<div class="location-marker" data-location="foyer" style="top: 28%; left: 36%;"></div> <div class="location-marker" data-location="kasse" style="top: 34%; left: 28%;"></div>
<div class="location-marker" data-location="hackspace" style="top: 36%; left: 60%;"></div> <div class="location-marker" data-location="ewiges-fruehstueck" style="top: 34%; left: 28%;"></div>
<div class="location-marker" data-location="infodesk" style="top: 20%; left: 29%;"></div> <div class="location-marker" data-location="siggi-11" style="top: 34%; left: 28%;"></div>
<div class="location-marker" data-location="kasse" style="top: 40%; left: 36%;"></div> <div class="location-marker" data-location="hackcenter" style="top: 27%; left: 52%;"></div>
<div class="location-marker" data-location="vortraege-1" style="top: 19%; left: 72%;"></div>
<div class="location-marker" data-location="elfenhain" style="top: 27%; left: 88%;"></div>
<div class="location-marker" data-location="spuelkueche" style="top: 44%; left: 58%;"></div>
<div class="location-marker" data-location="workshops" style="top: 89%; left: 19%;"></div>
</div> </div>
<div class="box floor-plan" id="floor-6"> <div class="box floor-plan" id="floor-6">
<img src="image/Etagen_6. OG.png" alt="Grundriss 6. Obergeschoss" class="floor-plan-image" /> <img src="image/Etagen_6. OG.png" alt="Grundriss 6. Obergeschoss" class="floor-plan-image" />
<div class="location-marker" data-location="projekte" style="top: 75%; left: 64%;"></div> <div class="location-marker" data-location="vortraege-2" style="top: 78%; left: 23%;"></div>
<div class="location-marker" data-location="buehne-2" style="top: 41%; left: 20%;"></div> <div class="location-marker" data-location="kids-space" style="top: 88%; left: 44%;"></div>
<div class="location-marker" data-location="cafeteria" style="top: 58%; left: 82%;"></div> <div class="location-marker" data-location="projekte" style="top: 84%; left: 77%;"></div>
<div class="location-marker" data-location="kaffee" style="top: 58%; left: 82%;"></div> <div class="location-marker" data-location="kaffee" style="top: 57%; left: 85%;"></div>
<div class="location-marker" data-location="waffeln" style="top: 58%; left: 82%;"></div> <div class="location-marker" data-location="waffeln" style="top: 49%; left: 84%;"></div>
</div> </div>
<div class="box floor-plan" id="floor-7"> <div class="box floor-plan" id="floor-7">
<img src="image/Etagen_7. OG.png" alt="Grundriss 7. Obergeschoss" class="floor-plan-image" /> <img src="image/Etagen_7. OG.png" alt="Grundriss 7. Obergeschoss" class="floor-plan-image" />
<div class="location-marker" data-location="skybar" style="top: 35%; left: 36%;"></div> <div class="location-marker" data-location="skybar" style="top: 78%; left: 48%;"></div>
</div> </div>
</div> </div>

Write Preview
Loading…
Cancel
Save