Commit c467b0b6 authored by sarah's avatar sarah

update website

parent 9ac043c2
......@@ -36,21 +36,21 @@
<object id="timeline" data="timeline/timeline.svg" type="image/svg+xml" style=""></object>
</figure>
</div>
<aside class="time-travel" id="last-crescent">
<span class="button full-moon"><a href="">Full moon</a></span>
<span class="button first-crescent"><a href="">First crescent</a></span>
<span class="button last-crescent"><a href="">Last crescent</a></span>
</aside>
</aside>
<main>
<div id="container">
</div>
<aside class="time-travel" id="last-crescent">
<span class="full-moon"><a href="">Full moon</a></span>
<span class="first-crescent"><a href="">First crescent</a></span>
<span class="last-crescent"><a href="">Last crescent</a></span>
</aside>
<aside class="cycle content" id="full-moon">
<section class="content-day">
<article class="day" id="friday-17-may">
<div class="bloc-date">
<p class="date">Friday 17 May</p>
<p class="date">Fri. 17 May</p>
</div>
<div id="thomas-more-school-presentation" class="event">
<p class="date">Friday 17 May</p>
......@@ -67,9 +67,10 @@
</span>
</div>
<div id="thomas-more-school-lecture-performance-mark-pozlep" class="event">
<figure class="preview"><img src="img/cloud/Mark Pozlep/BFR_Mark Pozlep.jpg"></figure>
<p class="date">Friday 17 May</p>
<p class="hour">16:30 - 18:00</p><p class="venue">Thomas More School to Zennegat</p>
<p class="type">Lecture performance</p><p class="contributor">Mark Pozlep</p>
<p class="type">Lecture performance</p><p class="title">Blueprint for revolution</p><p class="contributor">Mark Pozlep</p>
<span class="detail">
<figure class="cover">
......@@ -85,7 +86,7 @@
<figure class="preview"><img src="img/cloud/Maria Lucia Cruz Correia/common-dreams.jpg"></figure>
<p class="date">Friday 17 May</p>
<p class="hour">18:00 - 20:00</p><p class="venue">Zennegat</p>
<p class="type">Presentation from Flotation School</p><p class="contributor">Maria Lucia Cruz Correira</p>
<p class="type">Presentation from Flotation School</p><p class="title">Common Dreams “Flotation school“</p><p class="contributor">Maria Lucia Cruz Correira</p>
<span class="detail">
<figure class="cover"><img src="http://www.mluciacruzcorreia.com/content/3-works/1-the-voice-of-natu/fotovoiceofnature2.jpg"></figure>
......@@ -96,7 +97,8 @@
</span>
</div>
<div id="nona-Presentation-picha" class="event">
<p class="date">Friday 17 May</p>
<figure class="preview"><img src="img/cloud/Enough Room for Space/picha_logo.png"></figure>
<p class="date">Fri. 17 May</p>
<p class="hour">21:00 - 22:00</p><p class="venue">Nona</p>
<p class="type">Presentation</p><p class="contributor">Picha / Narratives</p>
<span class="detail">
......@@ -113,13 +115,13 @@
</article>
<article class="day" id="saturday-18-may">
<div class="bloc-date">
<p class="date">Saturday 18 May</p>
<p class="date">Sat. 18 May</p>
</div>
<div id="nona-lecture-workshop-léopold-lambert" class="event">
<figure class="preview"><img src="img/cloud/Léopold Lambert/TheFunambulistToxicAtmospheres1.JPG"></figure>
<p class="date">Saturday 18 May</p>
<p class="hour">11:00 - 13:00</p><p class="venue">Nona - old foyer/cafe</p>
<p class="type">Lecture workshop</p><p class="contributor">Léopold Lambert</p>
<p class="type">Lecture workshop</p><p class="title">Toxic Atmospheres</p><p class="contributor">Léopold Lambert</p>
<span class="detail">
<figure class="cover">
<img src="https://loeildelaphotographie.com/wp-content/uploads/2013/05/original_laura_2-jpg.jpg20140604-13248-1gys00n.jpg">
......@@ -191,7 +193,7 @@
<figure class="preview"><img src="img/cloud/Daniela Ortiz/Still_3.png"></figure>
<p class="date">Saturday 18 May</p>
<p class="hour">20:30</p><p class="venue">Nona - old theater</p>
<p class="type">Film screening</p><p class="contributor">Daniela Ortiz</p>
<p class="type">Film screening</p><p class="title">The empire of law</p><p class="contributor">Daniela Ortiz</p>
<span class="detail">
<figure class="cover">
<img src="https://loeildelaphotographie.com/wp-content/uploads/2013/05/original_laura_2-jpg.jpg20140604-13248-1gys00n.jpg">
......@@ -220,13 +222,14 @@
</article>
<article class="day" id="sunday-19-may">
<div class="bloc-date">
<p class="date">Sunday 19 May</p>
<p class="date">Sun. 19 May</p>
</div>
<div id="nona-concert-melvin-gibbs" class="event">
<div id="nona-talk-picha-tradeoff" class="event">
<figure class="preview"><img src="img/cloud/Enough Room for Space/mine-a-ciel-ouvert-noyee-de-banfora-2-lieu-dextraction-miniere-artisanale-2010-80x24048-cm.jpg"></figure>
<p class="date">Sunday 19 May</p>
<p class="hour">14:00 - 18:00</p><p class="venue">Nona</p>
<p class="type">Lunar Talk </p><p class="contributor">"On Trade Off" project</p>
<p class="type">Lunar Talk </p><p class="title">"On Trade Off" project</p><p class="contributor">Picha / Enough Room for Space</p>
<span class="detail">
<figure class="cover">
<img src="https://loeildelaphotographie.com/wp-content/uploads/2013/05/original_laura_2-jpg.jpg20140604-13248-1gys00n.jpg">
......@@ -238,15 +241,16 @@
</span>
</div>
</article>
<div class="last-crescent"><a href="">Last <br/>crescent&nbsp;</a></div>
<div class="button last-crescent"><a href="">Last <br/>crescent</a></div>
<div class="accordeon"><a href="">&nbsp;</a></div>
</section>
<section class="content-continious">
<div id="thomas-more-installation-cadine-navarro" class="event">
<figure class="preview"><img src="img/cloud/Cadine Navarro/IMG_6027.JPG"></figure>
<p class="date">17 May → 31 May</p>
<p class="hour">10:00 - 16:00</p><p class="venue">Thomas More Hogeschool</p>
<p class="type">Installation </p><p class="contributor">Cadine Navarro</p>
<p class="type">Installation </p><p class="title">Black Gold</p><p class="contributor">Cadine Navarro</p>
<span class="detail">
<p class="description">This current and on-going project takes its title from Masanobu Fukuoka’s book “One Straw Revolution” (1975), a seminal and timeless resource. The installation is marked out by four and a half tatami mats which offer a place for people to sit, read and meet. During the exhibition several ‘Nendo Dango’ or 'seedball' workshops take place, where participants learn how to make seed or earthballs which can be sowed in any open soil area. I ask that some form of documentation be made of the seeds’ growth so that a connection to the seed can be established. The installation also introduces hand-made 'seed papers' that in turn weave together other projects working in the same vain.</p><figure class="cover"><img src="
https://static1.squarespace.com/static/5a26ee4a268b96dcba47799c/5a301cbe24a694fe6ea5b7f7/5a301ec2e4966b2062fa32eb/1520588592872/HISK-cement-closeup2-web.jpg?format=1500w"></figure>
......
......@@ -4,18 +4,23 @@
font-weight: regular;
font-style: normal;
}
/* @font-face {
@font-face {
font-family: Syne;
src: url("fonts/webfonts/Syne-Regular.woff");
font-weight: regular;
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: Syne;
src: url("fonts/webfonts/Syne-Bold.woff");
font-weight: bold;
font-style: normal;
} */
}
@font-face {
font-family: Syne;
src: url("fonts/webfonts/Syne-Extra.woff");
font-weight: bold;
font-weight: 900;
font-style: normal;
}
......@@ -134,7 +139,7 @@ width: 33%;
position: fixed;
left: 0;
top: 0pt;
width: 34%;
width: 30%;
z-index: 1000;
padding: 20px;
......@@ -155,6 +160,8 @@ width: 54%;
#menu ul {
list-style-type: none;
display: inline-block;
position: absolute;
right: 0;
}
#menu li {
......@@ -162,11 +169,12 @@ width: 54%;
padding-right: 20px;
}
#menu a{
#menu a,
.button a{
/*color: black;*/
font-family: 'Syne';
font-weight: bold;
font-size: 0.9em;
font-size: 1em;
letter-spacing: 0.03em;
}
......@@ -177,25 +185,27 @@ width: 54%;
.event p {
margin-right: 10px;
line-height: 1.2em;
}
.date {
font-family: 'Syne';
font-weight: bold;
font-weight: 900;
text-transform: uppercase;
font-size: 1.1em;
}
.event p.date {
display: none;
}
.hour{
text-transform: uppercase;
font-family: 'Syne';
font-weight: bold;
font-family: 'Lack';
}
.type {
font-family: 'LM';
font-style: italic;
font-size: 1.2em;
font-family: 'LM';
font-style: italic;
font-size: 1.1em;
}
.venue {
......@@ -204,13 +214,12 @@ font-size: 1.2em;
.contributor {
font-family: 'Lack';
/* color:#f037af; */
}
.title {
font-family: 'LM';
font-style: italic;
font-size: 1.2em;
font-family: 'syne';
font-weight: 900;
font-size: 1em;
}
......@@ -248,7 +257,7 @@ section.content-continious::before {
content: url("img/arrow.png");
position: absolute;
right: 70px;
bottom: -17px;
bottom: -16px;
}
aside.content {
position: absolute;
......@@ -276,7 +285,7 @@ aside.content {
aside.time-travel {
width: 30%;
height: 900px;
margin-top: 170px;
margin-top: 190px;
position: absolute;
}
aside.time-travel span {
......@@ -296,14 +305,20 @@ aside.time-travel span {
text-align: right;
right: 0;
}
span.full-moon::before {
content: "↓ ";
.full-moon::before {
content: url("img/arrow-bottom-smaller.png");
margin-right: 10px;
vertical-align: sub;
}
span.first-crescent::before {
content: "← ";
.first-crescent::before {
content: url("img/arrow-left-smaller.png");
/* vertical-align: sub; */
margin-right: 10px;
}
span.last-crescent::after {
content: " →";
.last-crescent::after {
content: url("img/arrow-smaller.png");
/* vertical-align: sub; */
margin-left: 10px;
}
div.last-crescent {
text-align: left;
......@@ -322,8 +337,8 @@ div.last-crescent {
#timeline {
position: absolute;
right: 94px;
top: 173px;
height: 42vh;
top: 161px;
height: 43vh;
}
.cycle {
flex: 2 0 10%;
......@@ -339,14 +354,17 @@ div.last-crescent {
right: 40pt;
top: 13pt;
}*/
article.day figure.preview {
margin-right: -30px;
margin-left: -30px;
}
article.day {
width: 19%;
flex: 3 0 23%;
padding-right: 30px;
padding-left: 30px;
overflow-y: scroll;
max-height: 1170px;
/* margin-right: 22px; */
padding-right: 30px;
padding-left: 30px;
}
section.many-days {
height: 100%;
......@@ -360,8 +378,6 @@ section.many-days {
margin-bottom: 10px;
width: 100%;
float: left;
/* margin-right: 28px; */
/* padding-left: 25px; */
}
.content-day div.event.active,
.content-continious div.event.active {
......@@ -372,7 +388,7 @@ section.many-days {
padding: 10px 10px;
flex: 1 0 33%;
margin-right: 10px;
max-width: 400px;
max-width: 500px;
}
.day div.event:hover {
......@@ -383,7 +399,7 @@ div.bloc-date {
margin-bottom: 23px;
font-family: 'Syne';
font-weight: bold;
font-weight: 900;
text-transform: uppercase;
position: sticky;
top: 0em;
......@@ -437,6 +453,15 @@ margin-top: 10pt;
figure.preview img {
width: 100%;
}
.content-continious figure.preview {
max-height: 75px;
float: left;
margin-right: 10px;
}
.content-continious figure.preview img {
width: auto;
height: 75px;
}
.event.active span.detail figure.cover {
width: 100%;
margin: 0pt;
......@@ -492,22 +517,22 @@ p.comment::before {
#thomas-more-school-presentation {
height: 400px;
margin-top: 100px;
margin-top: 200px;
}
#thomas-more-school-lecture-performance-mark-pozlep {
height: 150px;
height: 437px;
margin-top: 50px;
}
#zennegat-flotation-school {
height: 360px;
height: 460px;
}
#nona-Presentation-picha {
margin-top: 10px;
height: 100px;
height: 200px;
}
#nona-lecture-workshop-léopold-lambert {
margin-top: 200px;
height: 283px;
margin-top: 300px;
height: 383px;
}
#nona-lunch-welcome-in-mechelen {
height: 100px;
......@@ -520,13 +545,13 @@ p.comment::before {
height: 100px;
}
#nona-film-screening-daniela-ortiz {
height: 271px;
height: 371px;
margin-top: 50px;
}
#nona-concert-melvin-gibbs {
height: 100px;
}
#nona-concert-melvin-gibbs {
height: 400px;
margin-top: 500px;
#nona-talk-picha-tradeoff {
height: 500px;
margin-top: 600px;
}
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment