final state, rollout to public

static/css/style.css

@@ -1,7 +1,7 @@
 html{box-sizing:border-box}*,:after{box-sizing:inherit}
+.dc-wrapper{min-height:100%;display:grid;grid-template-rows:auto 1fr auto;}
 html,body{box-sizing:border-box;height:100%;padding:0;margin:0}
 .wrapper{box-sizing:border-box;min-height:100%;display:flex;flex-direction:column}
-.dc-wrapper{min-height:100%;display:grid;grid-template-rows:auto 1fr auto;}
 .dc-top-header,.dc-footer{flex-grow:0;flex-shrink:0}
 .dc-body{flex-grow:1}
 img{max-width:100%;height:auto;border-style:none}
@@ -19,15 +19,11 @@ button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[
 fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}
 legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}
 [type=checkbox],[type=radio]{padding:0}
-[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
-[type=search]{-webkit-appearance:textfield;outline-offset:-2px}
-[type=search]::-webkit-search-decoration{-webkit-appearance:none}
-::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
-body,html{font-family:"Liberation Serif",serif;font-size:15px;line-height:1.5em;padding-top:32px;height:100%;}html,body,div{overflow-x:hidden}
+html,body,div{overflow-x:hidden}
+body,html{font-family:"Liberation Serif",serif;font-size:1vw;line-height:1.5em;padding-top:32px;height:100%;}
 h1{font-size:36px}h2{font-size:30px}h3{font-size:24px}h4{font-size:20px}h5{font-size:18px}h6{font-size:16px}
 a,b,body,div,h1,h2,h3,h4,h5,h6,html,i,img,p,span {margin: 0;padding: 0;border: 0;line-height:1.5em}
 
-
 .dc-background{background-repeat:no-repeat;background-position:top;background-size:cover;background-attachment:fixed;position:absolute;width:100%;height:100%;overflow:hidden;bottom:0;left:0;display:block}
 h1,h2,h3,h4,h5,h6{font-family:"Liberation Serif",serif;font-weight:400;margin:10px 0}.dc-wide{letter-spacing:4px}
 hr{border:0;border-top:1px solid #eee;margin:20px 0}
@@ -35,9 +31,11 @@ hr{border:0;border-top:1px solid #eee;margin:20px 0}
 .dc-table,.dc-table-all{border-collapse:collapse;border-spacing:0;width:100%;display:table}.dc-table-all{border:1px solid #ccc}
 .dc-round{border-radius:5px}
 .dc-page-container{width:80%;margin:auto}
+div.gallery{margin:5px;border:1px solid #ccc;float:left;height:50vh;width:15vw;}
+div.gallery:hover{border:1px solid #777;}
+div.gallery img {width:100%;height:auto;}
+div.desc{padding:15px;text-align:center;}
 .dc-flex-container{display:flex;align-items:flex-end;flex-wrap:nowrap;justify-content:space-between}
-.dc-background-header{padding:50px 0;position:relative;background-position:50%;background-size:cover;z-index:3;width:80%;max-width:1080px;margin-left:auto;margin-right:auto}
-.dc-main-title{font-weight:700;font-size:70px;line-height:1.1em;text-align:center}
 .dc-bordered tr,.dc-table-all tr{border-bottom:1px solid #ddd}.dc-striped tbody tr:nth-child(even){background-color:#f1f1f1}
 .dc-table-all tr:nth-child(odd){background-color:#fff}.dc-table-all tr:nth-child(even){background-color:#f1f1f1}
 .dc-hoverable tbody tr:hover,.dc-ul.dc-hoverable li:hover{background-color:#ccc}.dc-centered tr th,.dc-centered tr td{text-align:center}
@@ -84,20 +82,9 @@ hr{border:0;border-top:1px solid #eee;margin:20px 0}
 @media (min-width:993px){.dc-col.l1{width:8.33333%}.dc-col.l2{width:16.66666%}.dc-col.l3{width:24.99999%}.dc-col.l4{width:33.33333%}
 .dc-col.l5{width:41.66666%}.dc-col.l6{width:49.99999%}.dc-col.l7{width:58.33333%}.dc-col.l8{width:66.66666%}
 .dc-col.l9{width:74.99999%}.dc-col.l10{width:83.33333%}.dc-col.l11{width:91.66666%}.dc-col.l12{width:99.99999%}}
+.dc-row-padding,.dc-row-padding>.dc-half,.dc-row-padding>.dc-third,.dc-row-padding>.dc-twothird,.dc-row-padding>.dc-threequarter,.dc-row-padding>.dc-quarter,.dc-row-padding>.dc-col{padding:0 8px}
+
 .dc-rest{overflow:hidden}.dc-stretch{margin-left:-16px;margin-right:-16px}
-.dc-content,.dc-auto{margin-left:auto;margin-right:auto}.dc-content{max-width:980px}.dc-auto{max-width:1140px}
-.dc-cell-row{display:table;width:100%}.dc-cell{display:table-cell}
-.dc-cell-top{vertical-align:top}.dc-cell-middle{vertical-align:middle}.dc-cell-bottom{vertical-align:bottom}
-.dc-hide{display:none!important}.dc-show-block,.dc-show{display:block!important}.dc-show-inline-block{display:inline-block!important}
-@media (max-width:1205px){.dc-auto{max-width:95%}}
-@media (max-width:600px){.dc-modal-content{margin:0 10px;width:auto!important}.dc-modal{padding-top:30px}
-.dc-dropdown-hover.dc-mobile .dc-dropdown-content,.dc-dropdown-click.dc-mobile .dc-dropdown-content{position:relative}	
-.dc-hide-small{display:none!important}.dc-mobile{display:block;width:100%!important}.dc-bar-item.dc-mobile,.dc-dropdown-hover.dc-mobile,.dc-dropdown-click.dc-mobile{text-align:center}
-.dc-dropdown-hover.dc-mobile,.dc-dropdown-hover.dc-mobile .dc-btn,.dc-dropdown-hover.dc-mobile .dc-button,.dc-dropdown-click.dc-mobile,.dc-dropdown-click.dc-mobile .dc-btn,.dc-dropdown-click.dc-mobile .dc-button{width:100%}}
-@media (max-width:768px){.dc-modal-content{width:500px}.dc-modal{padding-top:50px}}
-@media (min-width:993px){.dc-modal-content{width:900px}.dc-hide-large{display:none!important}.dc-sidebar.dc-collapse{display:block!important}}
-@media (max-width:992px) and (min-width:601px){.dc-hide-medium{display:none!important}}
-@media (max-width:992px){.dc-sidebar.dc-collapse{display:none}.dc-main{margin-left:0!important;margin-right:0!important}.dc-auto{max-width:100%}}
 .dc-top,.dc-bottom{position:fixed;width:100%;z-index:1}.dc-top{top:0}.dc-bottom{bottom:0}
 .dc-overlay{position:fixed;display:none;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:2}
 .dc-display-topleft{position:absolute;left:0;top:0}.dc-display-topright{position:absolute;right:0;top:0}
@@ -108,10 +95,8 @@ hr{border:0;border-top:1px solid #eee;margin:20px 0}
 .dc-display-topmiddle{position:absolute;left:50%;top:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
 .dc-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
 .dc-display-container:hover .dc-display-hover{display:block}.dc-display-container:hover span.dc-display-hover{display:inline-block}.dc-display-hover{display:none}
-.dc-display-position{position:absolute}
 .dc-circle{border-radius:50%}
 .dc-round-small{border-radius:2px}.dc-round,.dc-round-medium{border-radius:4px}.dc-round-large{border-radius:8px}.dc-round-xlarge{border-radius:16px}.dc-round-xxlarge{border-radius:32px}
-.dc-row-padding,.dc-row-padding>.dc-half,.dc-row-padding>.dc-third,.dc-row-padding>.dc-twothird,.dc-row-padding>.dc-threequarter,.dc-row-padding>.dc-quarter,.dc-row-padding>.dc-col{padding:0 8px}
 .dc-container,.dc-panel{padding:0.01em 16px}.dc-panel{margin-top:16px;margin-bottom:16px}
 .dc-code,.dc-codespan{font-family:Consolas,"courier new";font-size:16px}
 .dc-code{width:auto;background-color:#fff;padding:8px 12px;border-left:4px solid #4CAF50;word-wrap:break-word}
@@ -128,11 +113,8 @@ hr{border:0;border-top:1px solid #eee;margin:20px 0}
 .dc-animate-input{transition:width 0.4s ease-in-out}.dc-animate-input:focus{width:100%!important}
 .dc-opacity,.dc-hover-opacity:hover{opacity:0.60}.dc-opacity-off,.dc-hover-opacity-off:hover{opacity:1}
 .dc-opacity-max{opacity:0.25}.dc-opacity-min{opacity:0.75}
-.dc-greyscale-max,.dc-grayscale-max,.dc-hover-greyscale:hover,.dc-hover-grayscale:hover{filter:grayscale(100%)}
-.dc-greyscale,.dc-grayscale{filter:grayscale(75%)}.dc-greyscale-min,.dc-grayscale-min{filter:grayscale(50%)}
-.dc-sepia{filter:sepia(75%)}.dc-sepia-max,.dc-hover-sepia:hover{filter:sepia(100%)}.dc-sepia-min{filter:sepia(50%)}
-.dc-tiny{font-size:10px!important}.dc-small{font-size:12px!important}.dc-medium{font-size:15px!important}.dc-large{font-size:18px!important}
-.dc-xlarge{font-size:24px!important}.dc-xxlarge{font-size:36px!important}.dc-xxxlarge{font-size:48px!important}.dc-jumbo{font-size:10vw!important}
+.dc-tiny{font-size:10px!important}.dc-small{font-size:12px!important}.dc-medium{font-size:1vw!important}.dc-large{font-size:1,5vw!important}
+.dc-xlarge{font-size:2vw!important}.dc-xxlarge{font-size:36px!important}.dc-xxxlarge{font-size:48px!important}.dc-jumbo{font-size:64px!important}
 .dc-left-align{text-align:left!important}.dc-right-align{text-align:right!important}.dc-justify{text-align:justify!important}.dc-center{text-align:center!important}
 .dc-border-0{border:0!important}.dc-border{border:1px solid #ccc!important}
 .dc-border-top{border-top:1px solid #ccc!important}.dc-border-bottom{border-bottom:1px solid #ccc!important}
@@ -194,9 +176,10 @@ hr{border:0;border-top:1px solid #eee;margin:20px 0}
 .dc-border-grey,.dc-hover-border-grey:hover,.dc-border-gray,.dc-hover-border-gray:hover{border-color:#9e9e9e!important}
 .dc-border-light-grey,.dc-hover-border-light-grey:hover,.dc-border-light-gray,.dc-hover-border-light-gray:hover{border-color:#f1f1f1!important}
 .dc-border-dark-grey,.dc-hover-border-dark-grey:hover,.dc-border-dark-gray,.dc-hover-border-dark-gray:hover{border-color:#616161!important}
+.dc-main-title{font-weight:700;font-size:5vw !important;line-height:1.1em;text-align:center}
+.dc-subtitle{font-weight:500;font-size:3vw !important;line-height:1.1em;text-align:center}
 
 .dc-parallax {background-repeat: no-repeat;background-position: top;background-size: 100%;position: absolute;bottom: 0;left: 0;width: 100%;height: 100%;display: block}
-.dc-header {padding: 10vw 0;position: relative;background-position: 50%;background-size: cover}
-.dc-header {position: relative;z-index: 3;width: 100%;max-width: 1080px;margin-left: auto;margin-right: auto}
-.dc-header,.dc-parallax {background-repeat: no-repeat;background-position: top;background-size: cover;background-attachment: fixed;position: absolute;width: 100%;height: 100%;overflow: hidden}
-
+.dc-header {padding: 7vw 0;position: relative;background-position: 50%;background-size: cover}
+.dc-header {position: relative;z-index: 3;width: 100%;margin-left: auto;margin-right: auto}
+.dc-header .dc-parallax {background-repeat: no-repeat;background-position: top;background-size: cover;background-attachment: fixed;position: absolute;width: 100%;height: 100%;overflow: hidden}

templates/anmeldung.html

@@ -2,11 +2,11 @@
 {% include static %}
 {% block content %}
 
-<section class="dc-page-container dc-padding">
+<section class="dc-container dc-padding">
 <h1 class="dc-xxlarge dc-center">Anmelden</h1>
 <div class="dc-container dc-padding dc-deep-purple">
 <div class="dc-container dc-half dc-deep-purple dc-round-small">
-<h2 class="dc-center dc-large dc-text-white">Essensanmeldung</h2>
+<h2 class="dc-center dc-xlarge dc-text-white">Essensanmeldung</h2>
 <form action=""  style="margin:auto" class="dc-container dc-form" method="post">
 {% csrf_token %}
 <input type="hidden" name="form_type" value="essen">
@@ -21,13 +21,13 @@
 <div class="dc-half">{{essen_form.mail }}</div></div>
 <div class="dc-container dc-padding-top">
 {{ essen_form.auswahl.errors }}
-<label class="dc-half" for="{{ essen_form.auswahl.id_for_label }}">Auswahl:</label>
+<label class="dc-half" for="{{ essen_form.auswahl.id_for_label }}">Ort der Aufführung:</label>
 <div style="padding-bottom:7px" class="dc-half">{{essen_form.auswahl }}</div></div>
 <input style="width:100%" class="dc-deep-purple dc-padding-small dc-border-small dc-button dc-border-white" type="submit" value="Senden">
 </form>
 </div>
 <div class="dc-container dc-half dc-deep-purple dc-round-small">
-<h2 class="dc-center dc-large dc-text-white">Sitzplatzreservierung</h2>
+<h2 class="dc-center dc-xlarge dc-text-white">Sitzplatzreservierung</h2>
 <form action=""  style="margin:auto" class="dc-container dc-form" method="post">
 {% csrf_token %}
 <input type="hidden" name="form_type" value="reservierung">

templates/base.html

@@ -10,8 +10,8 @@
 <link rel='icon' href='{% static 'pictures/sigil-new.webp' %}'>
 </head>
 
-<body class="dc-body">
-<div class="wrapper dc-wrapper dc-responsive">
+<body>
+<div class="dc-wrapper">
 {% include 'navbar.html' %}
 {% block content %}
 {% endblock content %}

templates/homepage.html

@@ -6,15 +6,15 @@
 <section class="dc-header dc-text-white">
 <span class="dc-parallax" style="background-image:url({% static 'pictures/curtain.webp' %});width:100%"></span>
 <div class="dc-header dc-center">
-<h1 class="dc-jumbo dc-main-title">Jugendgruppe Mysteriendrama</h1>
-<span class="dc-xlarge">Aufführung des Mysteriendramas:<br> "Die Pforte der Einweihung" <br> ein Rosenkreuzermysterium durch Rudolf Steiner</span>
+<h1 class="dc-xxlarge dc-main-title">Jugendgruppe Mysteriendrama</h1>
+<span class="dc-xlarge dc-subtitle">Aufführung des Mysteriendramas:<br> "Die Pforte der Einweihung" <br> ein Rosenkreuzermysterium durch Rudolf Steiner</span>
 </div>
 </section>
 
-<div class="dc-medium dc-page-container dc-padding">
-<p class="dc-center dc-large dc-padding"><b>Liebe Freunde des Mysteriendramas,</b></p>
+<div class="dc-page-container dc-padding">
+<p class="dc-center dc-padding"><b>Liebe Freunde des Mysteriendramas,</b></p>
 <p>nach 3 Jahren bringt nun endlich eine Gruppe junger Erwachsener aus Deutschland, der Schweiz und anderen Ländern das zweite durch Rudolf Steiner geschaffene Mysteriendrama, <i>Die Prüfung der Seele</i>, dreimalig auf die Bühne.<br>Durch den ganzen August und in den September hinein soll ein gemeinsames Leben in der Suche nach echt menschlicher Erkenntnis und der Arbeit am durch Rudolf Steiner geschaffenen Mysteriendrama versucht werden.</p>
-<div class="dc-center dc-padding dc-large dc-deep-purple dc-round-small"><b>Aufführungstermine für die Tournee 2023</b><br>
+<div class="dc-center dc-padding dc-deep-purple dc-round-small"><b>Aufführungstermine für die Tournee 2023</b><br>
 Samstag, 26. August, Freie Waldorfschule Böblingen von 10 Uhr bis ca. 18 Uhr<br>
 Mittwoch, 30. August, Rudolf-Steiner-Schule Wuppertal von 14 Uhr bis ca. 22 Uhr<br>
 Samstag, 2. September, Freie Waldorfschule Lübeck von 10 Uhr bis ca. 18 Uhr<br>

templates/ueber.html

@@ -2,29 +2,6 @@
 {% load static %}
 {% block title %}Über uns{% endblock title %}
 {% block content %}
-<style>
-div.gallery {
-  margin: 5px;
-  border: 1px solid #ccc;
-  float: left;
-  height: 200px;
-  width: 180px;
-}
-
-div.gallery:hover {
-  border: 1px solid #777;
-}
-
-div.gallery img {
-  width: 100%;
-  height: auto;
-}
-
-div.desc {
-  padding: 15px;
-  text-align: center;
-}
-</style>
 <section class="dc-page-container">
 <div class="dc-container">
 <img src="{% static 'pictures/Gruppe_alt.webp' %}" title="Gruppenfoto"></div>
@@ -42,9 +19,9 @@ div.desc {
 </div>
 <div class="dc-medium dc-padding">Wir sind eine Gruppe von etwa 30 Jugendlichen im Alter von etwa 20 bis 26 Jahren, die sich teils schon seit Anfang 2019 mit dem Einstudieren der Mysteriendramen von Rudolf Steiner beschäftigt. Aus allen Ecken von Deutschland und manchmal sogar darüber hinaus treffen wir uns um das Mysteriendrama kennenzulernen und an diesem Projekt zu arbeiten. Das Ziel ist es, im Ende August und Anfang September 2023 Aufführungen des Dramas präsentieren zu können.</div>
 </div>
-<p class=" dc-medium dc-padding-top-24">Bereits im August 2020 konnte ein Teil unserer Gruppe das 1. Mysteriendrama erfolgreich vier mal zur Aufführung bringen.<br>Von diesem Erfolg und der erfüllenden Zeit gestärkt freuen wir uns nun auf eine weitere Runde, großartige Aufführungen und natürlich die Zuschauer!</p>
+<p class=" dc-medium dc-padding-top-24 dc-center">Bereits im August 2020 konnte ein Teil unserer Gruppe das 1. Mysteriendrama erfolgreich vier mal zur Aufführung bringen.<br>Von diesem Erfolg und der erfüllenden Zeit gestärkt freuen wir uns nun auf eine weitere Runde, großartige Aufführungen und natürlich die Zuschauer!</p>
 
-<p class="dc-center dc-large">Einige Eindrücke aus der Aufführung 2019 in Nürnberg:</p>
+<p class="dc-center dc-large dc-padding">Einige Eindrücke aus der Aufführung 2019 in Nürnberg:</p>
 
 <section class="dc-container dc-center">
 <div class='gallery'>

templates/unterstuetzen.html

@@ -3,10 +3,10 @@
 {% block title %}Unterstützen{% endblock title %}
 {% block content %}
 
-<section class="dc-page-container">
+<section class="dc-page-container dc-center">
 <img src="{% static 'pictures/Unterstuetzen.webp' %}">
-<div class="dc-medium dc-padding-top" style="text-align:justify;">Für Proben, Requisiten, Kostüme und schlussendlich die Aufführung hoffen wir auf Ihre Spenden.<br>
-<div class="dc-container dc-light-gray dc-padding dc-border-black dc-round-small">
+<div class="dc-padding-top">Für Proben, Requisiten, Kostüme und schlussendlich die Aufführung hoffen wir auf Ihre Spenden.<br>
+<div class="dc-container dc-light-gray dc-padding dc-border-black dc-round-large">
 <span>Kontoinhaberin: Selbstbestimmt Studieren e.V.<br></span>
 <span>IBAN: DE39 4306 0967 1062 5063 00<br></span>
 <span>BIC: GENODEM1GLS<br></span>

website/migrations/0007_alter_essen_auswahl.py

@@ -0,0 +1,18 @@
+# Generated by Django 4.2.3 on 2023-07-24 22:29
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('website', '0006_reservierung_timestamp'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='essen',
+            name='auswahl',
+            field=models.CharField(choices=[('ESSEN_B', 'Böblingen'), ('ESSEN_W', 'Wuppertal'), ('ESSEN_L', 'Lübeck')], max_length=12),
+        ),
+    ]

website/models.py

@@ -17,7 +17,7 @@ class ContactForm(ModelForm):
         model = Contact
         fields = ["name", "mail", "message"]
 
-EssenWahl = [ ("choice1","Essen 1"), ("choice2","Essen 2"), ("choice3","Essen 3"),]
+EssenWahl = [ ("ESSEN_B","Böblingen"), ("ESSEN_W","Wuppertal"), ("ESSEN_L","Lübeck"),]
 
 class Essen(models.Model):
     name = models.CharField(max_length=250)