important css changes to improve responsive design
This commit is contained in:
parent
73ae438f2a
commit
7d4396eb9d
@ -20,7 +20,7 @@ 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}
|
legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}
|
||||||
[type=checkbox],[type=radio]{padding:0}
|
[type=checkbox],[type=radio]{padding:0}
|
||||||
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%;}
|
body,html{font-family:"Liberation Serif",serif;font-size:15px;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}
|
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}
|
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}
|
||||||
|
|
||||||
@ -63,8 +63,9 @@ div.desc{padding:15px;text-align:center;}
|
|||||||
.dc-padding-top-large{padding-top:3%!Important}
|
.dc-padding-top-large{padding-top:3%!Important}
|
||||||
.dc-modal{z-index:3;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)}
|
.dc-modal{z-index:3;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)}
|
||||||
.dc-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:600px}
|
.dc-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:600px}
|
||||||
.dc-bar{width:100%;overflow:hidden}.dc-center .dc-bar{display:inline-block;width:auto}
|
.dc-bar{padding:1% 16px;float:left;width:100%;overflow:hidden;display:block;float:center}.dc-center .dc-bar{display:inline-block;width:auto}
|
||||||
.dc-bar .dc-bar-item{padding:1% 16px;float:left;width:auto;border:none;display:block;outline:0}
|
.dc-bar-item{padding:1% 16px;float:left;width:20%;border:none;display:block;outline:0}
|
||||||
|
@media (max-width:561px){.dc-bar-item{float:none;width:100%;}}
|
||||||
.dc-bar .dc-dropdown-hover,.dc-bar .dc-dropdown-click{position:static;float:left}
|
.dc-bar .dc-dropdown-hover,.dc-bar .dc-dropdown-click{position:static;float:left}
|
||||||
.dc-bar .dc-button{white-space:normal;padding:16px}
|
.dc-bar .dc-button{white-space:normal;padding:16px}
|
||||||
.dc-bar-block .dc-bar-item{width:100%;display:block;padding:8px 16px;text-align:left;border:none;white-space:normal;float:none;outline:0}
|
.dc-bar-block .dc-bar-item{width:100%;display:block;padding:8px 16px;text-align:left;border:none;white-space:normal;float:none;outline:0}
|
||||||
@ -113,13 +114,13 @@ div.desc{padding:15px;text-align:center;}
|
|||||||
.dc-animate-input{transition:width 0.4s ease-in-out}.dc-animate-input:focus{width:100%!important}
|
.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,.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-opacity-max{opacity:0.25}.dc-opacity-min{opacity:0.75}
|
||||||
.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-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:2vw!important}.dc-xxlarge{font-size:36px!important}.dc-xxxlarge{font-size:48px!important}.dc-jumbo{font-size:64px!important}
|
.dc-xlarge{font-size:24px!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-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-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}
|
.dc-border-top{border-top:1px solid #ccc!important}.dc-border-bottom{border-bottom:1px solid #ccc!important}
|
||||||
.dc-border-left{border-left:1px solid #ccc!important}.dc-border-right{border-right:1px solid #ccc!important}
|
.dc-border-left{border-left:1px solid #ccc!important}.dc-border-right{border-right:1px solid #ccc!important}
|
||||||
.dc-topbar{border-top:6px solid #ccc!important}.dc-bottombar{border-bottom:6px solid #ccc!important}
|
.dc-topbar{border-top:6px!important}.dc-bottombar{border-bottom:6px solid #ccc!important}
|
||||||
.dc-leftbar{border-left:6px solid #ccc!important}.dc-rightbar{border-right:6px solid #ccc!important}
|
.dc-leftbar{border-left:6px solid #ccc!important}.dc-rightbar{border-right:6px solid #ccc!important}
|
||||||
.dc-section,.dc-code{margin-top:16px!important;margin-bottom:16px!important}
|
.dc-section,.dc-code{margin-top:16px!important;margin-bottom:16px!important}
|
||||||
.dc-margin{margin:16px!important}.dc-margin-top{margin-top:16px!important}.dc-margin-bottom{margin-bottom:16px!important}
|
.dc-margin{margin:16px!important}.dc-margin-top{margin-top:16px!important}.dc-margin-bottom{margin-bottom:16px!important}
|
||||||
@ -176,8 +177,8 @@ div.desc{padding:15px;text-align:center;}
|
|||||||
.dc-border-grey,.dc-hover-border-grey:hover,.dc-border-gray,.dc-hover-border-gray:hover{border-color:#9e9e9e!important}
|
.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-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-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-main-title{font-weight:700;font-size:70px!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-subtitle{font-weight:500;font-size:40px!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-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: 5vh 0;position: relative;background-position: 50%;background-size: cover}
|
.dc-header {padding: 5vh 0;position: relative;background-position: 50%;background-size: cover}
|
||||||
|
@ -61,7 +61,6 @@
|
|||||||
<h2 class="dc-large dc-text-white dc-center">Hinweise</h2>
|
<h2 class="dc-large dc-text-white dc-center">Hinweise</h2>
|
||||||
<ol class="dc-medium">
|
<ol class="dc-medium">
|
||||||
<li>Bei überschreiten der maximalen Sitzanzahl von 7 pro Veranstaltung wird Ihre gesamte Reservierung ungültig gemacht.</li>
|
<li>Bei überschreiten der maximalen Sitzanzahl von 7 pro Veranstaltung wird Ihre gesamte Reservierung ungültig gemacht.</li>
|
||||||
<li>Gerne können Sie den Rechnungsbetrag für Ihr Ticket auch überweisen. Die Kontodaten finden Sie unter <a href="{% url 'unterstuetzen' %}">Unterstützen</a>. Bitte geben Sie Ihren Namen und einen Hinweis auf die Reservierung im Verwendungszweck mit an.</li>
|
|
||||||
<li>Für Reservierungen werden die Hälfte aller Plätze bereitgestellt. Weitere Plätze sind, solange der Vorrat reicht, an der Kasse verfügbar.</li>
|
<li>Für Reservierungen werden die Hälfte aller Plätze bereitgestellt. Weitere Plätze sind, solange der Vorrat reicht, an der Kasse verfügbar.</li>
|
||||||
<li>Die Essensanmeldung umfasst ein Mittagessen während der Pause am Aufführungstag. Pro Essensanmeldung kann nur eine Person erfasst werden. Ein Unkostenbeitrag wird für das Essen erhoben.</li>
|
<li>Die Essensanmeldung umfasst ein Mittagessen während der Pause am Aufführungstag. Pro Essensanmeldung kann nur eine Person erfasst werden. Ein Unkostenbeitrag wird für das Essen erhoben.</li>
|
||||||
<li>Falls Sie eine inkorrekte Mail angegeben haben, Ihre Reservierung noch einmal bearbeiten möchten oder ein anderes Problem haben schreiben Sie eine Mail an <a href="mailto:mysteriendrama@denkena-consulting.com">mysteriendrama@denkena-consulting.com</a>. Wir sind bei allen Anliegen gerne behilflich.</li>
|
<li>Falls Sie eine inkorrekte Mail angegeben haben, Ihre Reservierung noch einmal bearbeiten möchten oder ein anderes Problem haben schreiben Sie eine Mail an <a href="mailto:mysteriendrama@denkena-consulting.com">mysteriendrama@denkena-consulting.com</a>. Wir sind bei allen Anliegen gerne behilflich.</li>
|
||||||
|
@ -11,7 +11,7 @@
|
|||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div class="dc-wrapper">
|
<div class="dc-wrapper dc-responsive">
|
||||||
{% include 'navbar.html' %}
|
{% include 'navbar.html' %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
{% endblock content %}
|
{% endblock content %}
|
||||||
|
@ -7,11 +7,11 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style="width:100%;padding-left:0%;padding-right:0%" class="dc-bar dc-padding-top-24 dc-flex-container" data-fixed-height="40">
|
<div style="width:100%;padding-left:0%;padding-right:0%" class="dc-bar dc-padding-top-24 dc-flex-container" data-fixed-height="40">
|
||||||
<a style="width:20%" class="dc-bar-item dc-button dc-light-grey dc-padding dc-border-right dc-round-small" href="{% url 'homepage' %}">Startseite</a>
|
<a class="dc-bar-item dc-button dc-light-grey dc-padding dc-border-right dc-round-small dc-border-bottom" href="{% url 'homepage' %}">Startseite</a>
|
||||||
<a style="width:20%" class="dc-bar-item dc-button dc-light-grey dc-padding dc-border-right dc-round-small" href="{% url 'unterstuetzen' %}">Unterstützen</a>
|
<a class="dc-bar-item dc-button dc-light-grey dc-padding dc-border-right dc-round-small dc-border-bottom" href="{% url 'unterstuetzen' %}">Unterstützen</a>
|
||||||
<a style="width:20%" class="dc-bar-item dc-button dc-light-grey dc-padding dc-border-right dc-round-small" href="{% url 'ueber' %}">Über Uns</a>
|
<a class="dc-bar-item dc-button dc-light-grey dc-padding dc-border-right dc-round-small dc-border-bottom" href="{% url 'ueber' %}">Über Uns</a>
|
||||||
<a style="width:20%" class="dc-bar-item dc-button dc-light-grey dc-padding dc-border-right dc-round-small" href="{% url 'drama' %}">Zum Drama</a>
|
<a class="dc-bar-item dc-button dc-light-grey dc-padding dc-border-right dc-round-small dc-border-bottom" href="{% url 'drama' %}">Zum Drama</a>
|
||||||
<a style="width:20%" class="dc-bar-item dc-button dc-light-grey dc-padding" href="{% url 'kontakt' %}">Kontakt</a>
|
<a class="dc-bar-item dc-button dc-light-grey dc-padding dc-border-bottom" href="{% url 'kontakt' %}">Kontakt</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
Loading…
Reference in New Issue
Block a user