Browse Source

fix gothic cella vibe

heck 4 weeks ago
parent
commit
798f677607
  1. 96
      html/index.html

96
html/index.html

@ -80,8 +80,8 @@
<style> <style>
body { body {
background-color: #030303; background-color: #121212;
opacity: 0.93; opacity: 0.999;
} }
#hecksshader { #hecksshader {
@ -92,12 +92,12 @@
top: 0; top: 0;
left: 0; left: 0;
z-index: -999; z-index: -999;
opacity: 0.24999; opacity: 0.524999;
} }
.container { .container {
background-color: #090909; background-color: #161616;
width: 100%; width: 55%;
border-left: 0px none #dee2e6 !important; border-left: 0px none #dee2e6 !important;
border-right: 0px none #dee2e6 !important; border-right: 0px none #dee2e6 !important;
margin-right: auto; margin-right: auto;
@ -118,22 +118,22 @@
width: 100%; width: 100%;
margin-top: 1vh; margin-top: 1vh;
margin-bottom: 1vh; margin-bottom: 1vh;
background-color: #080808; background-color: #181818;
border: 0px solid #dee2e6 !important; border: 0px solid #dee2e6 !important;
opacity: 0.9999; opacity: 0.9999;
} }
.card-body { .card-body {
border-style: solid; border-style: solid;
border-top: 1px solid #333333 !important; border-top: 1px solid #444444 !important;
border-bottom: 1px none #dee2e6 !important; border-bottom: 1px none #dee2e6 !important;
border-left: 0; border-left: 0;
border-right: 0; border-right: 0;
opacity: 0.74; opacity: 0.999;
} }
.flyer { .flyer {
opacity: 0.9; opacity: 0.97;
} }
.logo { .logo {
@ -146,24 +146,35 @@
.card-title { .card-title {
font-family: 'Lato black', sans-serif; font-family: 'Lato black', sans-serif;
color: #aa2222; color: #ef3333;
font-size: 1.5rem; font-size: 1.3rem;
}
.osmmap {
opacity: 0.78;
} }
h2 { h2 {
font-family: 'Lato black', sans-serif; font-family: 'Lato black', sans-serif;
font-size: 2.0rem; font-size: 1.32rem;
text-transform: uppercase; text-transform: uppercase;
color: #dd2222; color: #c00606;
margin-top: 1vh; margin-top: 3vh;
margin-bottom: 1vh; margin-bottom: 2vh;
}
h5 {
text-transform: uppercase;
font-size: 0.1rem;
color: #c00606;
} }
p, li { p, li {
font-family: 'Lato', sans-serif; font-family: 'Lato', sans-serif;
letter-spacing: 0.05em; letter-spacing: 0.05em;
font-size: 1.4em; font-size: 1.13em;
color: #aa2828; color: #e01111;
hyphens: auto; hyphens: auto;
} }
@ -173,19 +184,19 @@
a:link { a:link {
color: grey; color: #dddddd;
} }
a:visited { a:visited {
color: grey; color: #dddddd;
} }
a:hover { a:hover {
color: aliceblue; color: #dddddd;
} }
a:active { a:active {
color: grey; color: #dddddd;
} }
@ -200,7 +211,7 @@
} }
.fas, .fab { .fas, .fab {
color: #aa2828; color: #dddddd;
font-size: 2em; font-size: 2em;
} }
@ -216,13 +227,11 @@
<canvas id="hecksshader"></canvas> <canvas id="hecksshader"></canvas>
<div class="container"> <div class="container">
<div class="cardcontainer pt-2"> <br>
<div class="card">
<div class="img flyer"> <div class="img flyer">
<img src="resources/Sub_Factory_2025.webp" alt="Subfactory Banner"> <img src="resources/Sub_Factory_2025.webp" alt="Subfactory Banner">
</div> </div>
</div>
</div>
<div class="cardcontainer pt-2"> <div class="cardcontainer pt-2">
<h2 class="text-center">Präsentiert von</h2> <h2 class="text-center">Präsentiert von</h2>
@ -231,7 +240,7 @@
<div class="card shadow-none"> <div class="card shadow-none">
<div class="card-body text-center"> <div class="card-body text-center">
<div class="fix_height"> <div class="fix_height">
<h5 class="card-title">Eulachbass</h5> <h2>Eulachbass</h2>
</div> </div>
<img class="logo" src="resources/eulachbass_logo_white.webp" alt="Eulachbass Logo"> <img class="logo" src="resources/eulachbass_logo_white.webp" alt="Eulachbass Logo">
<a href="https://eulachbass.ch/" target="_blank" class="card-link"> <a href="https://eulachbass.ch/" target="_blank" class="card-link">
@ -252,7 +261,7 @@
<div class="card shadow-none"> <div class="card shadow-none">
<div class="card-body text-center"> <div class="card-body text-center">
<div class="fix_height"> <div class="fix_height">
<h5 class="card-title">Sector B</h5> <h2>Sector B</h2>
</div> </div>
<img class="logo" src="resources/sectorb_logo_white.webp" alt="Sector B Logo"> <img class="logo" src="resources/sectorb_logo_white.webp" alt="Sector B Logo">
<a href="https://www.instagram.com/sectorbevents/" target="_blank" class="card-link"> <a href="https://www.instagram.com/sectorbevents/" target="_blank" class="card-link">
@ -267,7 +276,7 @@
<div class="card shadow-none"> <div class="card shadow-none">
<div class="card-body text-center"> <div class="card-body text-center">
<div class="fix_height"> <div class="fix_height">
<h5 class="card-title">Subsanity Soundystem</h5> <h2>Subsanity Soundystem</h2>
</div> </div>
<img class="logo" src="resources/subsanity_logo.webp" alt="Subsanity Logo"> <img class="logo" src="resources/subsanity_logo.webp" alt="Subsanity Logo">
<a href="https://www.instagram.com/subsanitysoundsystem" target="_blank" class="card-link"> <a href="https://www.instagram.com/subsanitysoundsystem" target="_blank" class="card-link">
@ -321,7 +330,7 @@
<h2 class="text-center ">Anreise</h2> <h2 class="text-center ">Anreise</h2>
<p> <p>
Einfach "Gleiserei" in dein navi of choice eingeben. Einfach "Gleiserei" in dein navi of choice eingeben.
<iframe width="1000" height="350" <iframe width="100%" height="350" class="osmmap"
src="https://www.openstreetmap.org/export/embed.html?bbox=8.723748028278353%2C47.50513122763665%2C8.727449476718904%2C47.507049991528696&amp;layer=mapnik&amp;marker=47.506090618350065%2C8.725598752498627" src="https://www.openstreetmap.org/export/embed.html?bbox=8.723748028278353%2C47.50513122763665%2C8.727449476718904%2C47.507049991528696&amp;layer=mapnik&amp;marker=47.506090618350065%2C8.725598752498627"
style="border: 1px solid black"></iframe> style="border: 1px solid black"></iframe>
<br/><small><a <br/><small><a
@ -340,20 +349,20 @@
<p>Mit der Teilnahme an der Sub Factory übernimmst du Verantwortung für dein Verhalten und <p>Mit der Teilnahme an der Sub Factory übernimmst du Verantwortung für dein Verhalten und
gestaltest den Anlass aktiv mit:</p> gestaltest den Anlass aktiv mit:</p>
<ul> <ul>
<li><h5 class="card-title">Konsens - nur ja heisst ja</h5></li> <li>Konsens - nur ja heisst ja</li>
<p>Respektiere physische und emotionale Grenzen. Die Grenzen aller Menschen sind individuell <p>Respektiere physische und emotionale Grenzen. Die Grenzen aller Menschen sind individuell
und können sich jederzeit ändern. Frage immer nach Zustimmung. Das gilt auch beim und können sich jederzeit ändern. Frage immer nach Zustimmung. Das gilt auch beim
Fotografieren.</p> Fotografieren.</p>
<li><h5 class="card-title">Füreinander da</h5></li> <li>Füreinander da</li>
<p>Wir kümmern uns um unsere Freund:innen, die Menschen um uns herum und um uns selbst. <p>Wir kümmern uns um unsere Freund:innen, die Menschen um uns herum und um uns selbst.
Siehst du eine Situation, in der du denkst, dass sich eine Person nicht wohl fühlt: Frag nach! Siehst du eine Situation, in der du denkst, dass sich eine Person nicht wohl fühlt: Frag nach!
Jede Person definiert für sich selbst, wann eine Grenze überschritten ist. Falls du selbst mit Jede Person definiert für sich selbst, wann eine Grenze überschritten ist. Falls du selbst mit
der der
Situation überfordert bist, kannst du Hilfe beim Ordnungsdienst holen.</p> Situation überfordert bist, kannst du Hilfe beim Ordnungsdienst holen.</p>
<li><h5 class="card-title">Keine Annahmen</h5></li> <li>Keine Annahmen</li>
<p>Vermeide Annahmen und daraus entstehende Fragen und Urteile über die Geschlechtsidentität, <p>Vermeide Annahmen und daraus entstehende Fragen und Urteile über die Geschlechtsidentität,
sexuelle Orientierung, Herkunft oder soziale Zugehörigkeit einer Person.</p> sexuelle Orientierung, Herkunft oder soziale Zugehörigkeit einer Person.</p>
<li><h5 class="card-title">Kenne deine Grenzen</h5></li> <li>Kenne deine Grenzen</li>
<p>Sei achtsam, wenn du Alkohol und ander Rauschmittel konsumierst. Stelle sicher, dass du <p>Sei achtsam, wenn du Alkohol und ander Rauschmittel konsumierst. Stelle sicher, dass du
deine eigenen und die Grenzen anderer Personen noch wahrnehmen und respektieren kannst. deine eigenen und die Grenzen anderer Personen noch wahrnehmen und respektieren kannst.
<br> <br>
@ -370,16 +379,23 @@
<div class="card"> <div class="card">
<div class="card-body col-12 section"> <div class="card-body col-12 section">
<h2 class="text-center ">Partner</h2> <h2 class="text-center ">Partner</h2>
<li><a href="https://www.gleiserei.ch/" target="_blank">Gleiserei</a></li> <p class="text-center">
<li><a href="https://www.hakogetraenke.ch/" target="_blank">Hako Getränke</a></li> <a href="https://www.gleiserei.ch/" target="_blank">Gleiserei</a><br>
</ul> <a href="https://www.hakogetraenke.ch/" target="_blank">Hako Getränke</a>
</p>
</div> </div>
</div> </div>
</div> </div>
<div class="cardcontainer pt-2">
<div class="card-body col-12 section">
</div>
</div>
</div> </div>
<script> <!--<script>-->
document.getElementById("focus").focus(); <!-- document.getElementById("focus").focus();-->
</script> <!--</script>-->
<script type="module"> <script type="module">
import * as THREE from 'https://unpkg.com/three/build/three.module.js'; import * as THREE from 'https://unpkg.com/three/build/three.module.js';

Loading…
Cancel
Save