style changes
This commit is contained in:
@@ -55,7 +55,7 @@ code { font-family: Kobata !important; font-weight: normal }
|
|||||||
.bg-white-orange, .bg-pink-orange, .bg-green-orange, .bg-lila-orange, .bg-orange-orange, .bg-black-orange { background-image: url("grid/orange.png") }
|
.bg-white-orange, .bg-pink-orange, .bg-green-orange, .bg-lila-orange, .bg-orange-orange, .bg-black-orange { background-image: url("grid/orange.png") }
|
||||||
.bg-white-black, .bg-pink-black, .bg-green-black, .bg-lila-black, .bg-orange-black, .bg-black-black { background-image: url("grid/black.png") }
|
.bg-white-black, .bg-pink-black, .bg-green-black, .bg-lila-black, .bg-orange-black, .bg-black-black { background-image: url("grid/black.png") }
|
||||||
|
|
||||||
@media (min-resolution: 2x) {
|
@media only screen and (min-resolution: 192dpi) {
|
||||||
.bg-white-white, .bg-pink-white, .bg-green-white, .bg-lila-white, .bg-orange-white, .bg-black-white { background-image: url("grid/white@2x.png"); background-size: 105px 78px }
|
.bg-white-white, .bg-pink-white, .bg-green-white, .bg-lila-white, .bg-orange-white, .bg-black-white { background-image: url("grid/white@2x.png"); background-size: 105px 78px }
|
||||||
.bg-white-pink, .bg-pink-pink, .bg-green-pink, .bg-lila-pink, .bg-orange-pink, .bg-black-pink { background-image: url("grid/pink@2x.png"); background-size: 105px 78px }
|
.bg-white-pink, .bg-pink-pink, .bg-green-pink, .bg-lila-pink, .bg-orange-pink, .bg-black-pink { background-image: url("grid/pink@2x.png"); background-size: 105px 78px }
|
||||||
.bg-white-green, .bg-pink-green, .bg-green-green, .bg-lila-green, .bg-orange-green, .bg-black-green { background-image: url("grid/green@2x.png"); background-size: 105px 78px }
|
.bg-white-green, .bg-pink-green, .bg-green-green, .bg-lila-green, .bg-orange-green, .bg-black-green { background-image: url("grid/green@2x.png"); background-size: 105px 78px }
|
||||||
@@ -100,13 +100,17 @@ nav { display: none }
|
|||||||
nav { height: 100%; padding-top: 89pt !important; justify-content: space-between; flex-direction: column; box-sizing: border-box; }
|
nav { height: 100%; padding-top: 89pt !important; justify-content: space-between; flex-direction: column; box-sizing: border-box; }
|
||||||
nav > div { margin-left: -2px }
|
nav > div { margin-left: -2px }
|
||||||
|
|
||||||
#lang-switch { position: absolute; top: -3px; right: 0 }
|
#lang-switch { position: absolute; top: -7px; right: 0 }
|
||||||
|
#lang-switch a { line-height: 1rem !important }
|
||||||
|
|
||||||
#content { position: relative; padding-bottom: calc(22pt + 40pt + 22pt) }
|
#content { position: relative; padding-bottom: calc(22pt + 40pt + 22pt) }
|
||||||
footer { background: var(--white); padding: 22pt; line-height: 1 !important; letter-spacing: 1.5rem; position: fixed; left: 0; right: 0; bottom: 0 }
|
footer { background: var(--white); padding: 22pt; position: fixed; left: 0; right: 0; bottom: 0; line-height: 1 !important; }
|
||||||
|
footer a { line-height: 1 !important; text-align-last: justify; display: block; white-space: nowrap; letter-spacing: 2.8vw }
|
||||||
|
@media (max-width: 1700px) { footer a { letter-spacing: 2vw } }
|
||||||
|
@media (max-width: 1200px) { footer a { letter-spacing: 1vw } }
|
||||||
|
|
||||||
.headline { padding-left: 179pt }
|
.headline { padding: 22pt; padding-left: 179pt }
|
||||||
.content-footer { display:flex; justify-content: space-between }
|
.content-footer { display:flex; justify-content: space-between; align-items: baseline }
|
||||||
.content-footer-socials { display: flex; justify-content: space-between; align-items: center; width: 439px; }
|
.content-footer-socials { display: flex; justify-content: space-between; align-items: center; width: 439px; }
|
||||||
|
|
||||||
@media (max-width: 750px) {
|
@media (max-width: 750px) {
|
||||||
|
|||||||
@@ -8,7 +8,7 @@
|
|||||||
<a href="https://www.thealit.de/newsletter" class="block link">Newsletter</a>
|
<a href="https://www.thealit.de/newsletter" class="block link">Newsletter</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="text-12">
|
<div class="text-12" style="word-spacing: 1rem">
|
||||||
<?php $impressum = $pages->findBy('uid', 'impressum') ?>
|
<?php $impressum = $pages->findBy('uid', 'impressum') ?>
|
||||||
<a href="<?= $impressum->url() ?>" class="link"><?= $impressum->title() ?></a>
|
<a href="<?= $impressum->url() ?>" class="link"><?= $impressum->title() ?></a>
|
||||||
<?php $datenschutz = $pages->findBy('uid', 'datenschutzerklaerung') ?>
|
<?php $datenschutz = $pages->findBy('uid', 'datenschutzerklaerung') ?>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<?php snippet('header') ?>
|
<?php snippet('header') ?>
|
||||||
|
|
||||||
<div class="bg-white-green container headline" style="padding-bottom: 79pt">
|
<div class="bg-white-green headline" style="padding-bottom: 79pt">
|
||||||
<h4 class="uppercase font-kobata leading-none"><?= $page->title() ?></h4>
|
<h3 class="uppercase font-kobata leading-none"><?= $page->title() ?></h4>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<?php $colors = [
|
<?php $colors = [
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<?php snippet('header') ?>
|
<?php snippet('header') ?>
|
||||||
|
|
||||||
<div class="<?= randomBg() ?> container headline" style="padding-bottom: 79pt">
|
<div class="<?= randomBg() ?> headline" style="padding-bottom: 79pt">
|
||||||
<h4 class="uppercase font-kobata leading-none"><?= $page->title() ?></h4>
|
<h4 class="uppercase font-kobata leading-none"><?= $page->title() ?></h4>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@@ -173,19 +173,19 @@ start()
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
#info { display: none; position: absolute; left: 498px; top: 0; bottom: 0 }
|
#info { display: none; position: absolute; left: 498px; top: 0; bottom: 0; padding: 22pt }
|
||||||
#info-button { padding-left: calc(498px + 22pt) }
|
#info-button { padding-left: calc(498px + 22pt); padding-top: 22pt }
|
||||||
@media (max-width: 750px) {
|
@media (max-width: 750px) {
|
||||||
#info { left: 0; overflow-y: scroll; }
|
#info { left: 0; overflow-y: scroll; }
|
||||||
#info-button { padding-left: 79pt }
|
#info-button { padding-left: 79pt }
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<div id="info-button" class="container">
|
<div id="info-button">
|
||||||
<button id="info_open" aria-label="Info Open" class="menu-button no-button flex font-kobata text-40 uppercase">Info</button>
|
<button id="info_open" aria-label="Info Open" class="menu-button no-button flex font-kobata text-40 uppercase">Info</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="info" class="bg-white-green container">
|
<div id="info" class="bg-white-green">
|
||||||
<button id="info_close" aria-label="Info Close" class="menu-button no-button flex" style="margin-top: 4px"><div style="transform: rotate(45deg); "></div><div style="transform: translate(0,-6px) rotate(135deg);"></div></button>
|
<button id="info_close" aria-label="Info Close" class="menu-button no-button flex" style="margin-top: 4px"><div style="transform: rotate(45deg); "></div><div style="transform: translate(0,-6px) rotate(135deg);"></div></button>
|
||||||
<div class="text-22" style="margin-top: 34pt">
|
<div class="text-22" style="margin-top: 34pt">
|
||||||
<?= $page->text() ?>
|
<?= $page->text() ?>
|
||||||
|
|||||||
@@ -3,13 +3,13 @@
|
|||||||
/** @var Kirby\Cms\Site $site */
|
/** @var Kirby\Cms\Site $site */
|
||||||
/** @var Kirby\Cms\Page $page */ ?>
|
/** @var Kirby\Cms\Page $page */ ?>
|
||||||
|
|
||||||
<div class="bg-orange-white container headline">
|
<div class="bg-orange-white headline">
|
||||||
<h4 class="uppercase font-kobata leading-none"><?= $page->title() ?></h4>
|
<h3 class="uppercase font-kobata leading-none"><?= $page->title() ?></h4>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="bg-orange-white container project-list">
|
<div class="bg-orange-white container project-list">
|
||||||
<?php foreach ($page->children()->listed() as $project): ?>
|
<?php foreach ($page->children()->listed() as $project): ?>
|
||||||
<a href="<?= $project->url() ?>" class="link" style="line-height: 57pt">
|
<a href="<?= $project->url() ?>" class="link" style="line-height: 57pt; padding-right: 1rem;">
|
||||||
<span class="font-kobata"><?= $project->start_date()->toDate('d.m.') ?>-<?= $project->end_date()->toDate('d.m.') ?></span>
|
<span class="font-kobata"><?= $project->start_date()->toDate('d.m.') ?>-<?= $project->end_date()->toDate('d.m.') ?></span>
|
||||||
<span class="text-40 leading-none"><?= $project->title() ?></span>
|
<span class="text-40 leading-none"><?= $project->title() ?></span>
|
||||||
</a>
|
</a>
|
||||||
@@ -17,7 +17,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="container bg-white-lila headline">
|
<div class="container bg-white-lila headline">
|
||||||
<h4 class="uppercase font-kobata leading-none">ART RESIDENCIES + INTERMISSIONS</h4>
|
<h3 class="uppercase font-kobata leading-none">ART RESIDENCIES + INTERMISSIONS</h4>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<?php snippet('layouts', ['layouts' => $page->layout()->toLayouts()]) ?>
|
<?php snippet('layouts', ['layouts' => $page->layout()->toLayouts()]) ?>
|
||||||
|
|||||||
Reference in New Issue
Block a user