svilayphiou
/
relearn-curved-slider-webpage
forked from varia/relearn-curved-slider-webpage
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

ready to be online

master
Stephanie Vilayphiou 6 years ago
parent
e6669e996d
commit
81ba7998cf
2 changed files with 81 additions and 26 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 32
      css/stylesheet.css
  2. 45
      index.html

32
css/stylesheet.css
View File

@ -38,7 +38,7 @@ hr{
} }
h1{ h1{
z-index: 10; line-height: 1.1em;
} }
h3 { h3 {
@ -157,6 +157,12 @@ div#relearn-infos ul {
border-radius: 5px; border-radius: 5px;
} }
.details {
display: none;
margin-top: 1em;
}
div.controlpoint{ div.controlpoint{
max-width: 800px; max-width: 800px;
margin: 1em 0; margin: 1em 0;
@ -175,6 +181,20 @@ div.controlpoint ul {
column-count: 2; column-count: 2;
} }
dl:not(.summary) dt,
dl:not(.summary) dd {
display: inline;
}
dl:not(.summary) dd:before {
content: " ";
}
dl:not(.summary) dd + dt:before {
content: '';
display: block;
}
.practical-infos { .practical-infos {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
@ -183,6 +203,7 @@ div.controlpoint ul {
.programme { .programme {
margin-bottom: 1em; margin-bottom: 1em;
width: 100%;
} }
.programme div.flex { .programme div.flex {
@ -193,6 +214,14 @@ div.controlpoint ul {
.programme p { .programme p {
width: 50%; width: 50%;
float: left; float: left;
box-sizing: border-box;
}
.programme p {
padding-right: 0.5em;
}
.programme p + p {
padding-right: 0em;
padding-left: 0.5em;
} }
.programme div.flex p { .programme div.flex p {
width: 100%; width: 100%;
@ -201,6 +230,7 @@ div.controlpoint ul {
div.controlpoint .programme ul { div.controlpoint .programme ul {
column-count: 1; column-count: 1;
padding: 0 1em;
} }
.participation, .participation,

45
index.html
View File

@ -32,37 +32,47 @@
</select> </select>
curved</h1> curved</h1>
<p> <p>
Relearn is a summerschool which welcomes persons, artists, students, teachers from all backgrounds and disciplines. Participants will gather to learn from and teach to each other, beyond the traditional paradigms of education. Relearn is a collective learning experiment with as many teachers as it has participants. It is motivated by the possibility to displace parameters of/for research, studying and learning. <a href='#' class='more'>Read more about Relearn.</a>
Relearn researches convivial, experimental and deviant methods and means in the fields of design, computing and education, challenging the normal roles and separations in them (teacher/student, developer/user, art/life...).
</p> </p>
<div class='details'>
<p> <p>
Free, Libre and Open Source Software plays a fundamental role at Relearn, as it facilitates a different approach to the tools we commonly use in our practices and lives. For instance, it can allow us to understand the influence that tools themselves exert on the way they are used, or the different social relations and economies that are formed between who creates and uses them. Such a questioning approach to technology feels urgent, in a time in which more and more social, political and personal issues are addressed by solely technological means. Relearn is a summerschool which welcomes persons, artists, students, teachers from all backgrounds and disciplines. Participants will gather to learn from and teach to each other, beyond the traditional paradigms of education.
Relearn researches convivial, experimental and deviant methods and means in the fields of design, computing and education, challenging the normal roles and separations in them (teacher/student, developer/user, art/life…).
</p> </p>
<p> <p>
Free, Libre and Open Source Software plays a fundamental role at Relearn, as it facilitates a different approach to the tools we commonly use in our practices and lives. For instance, it can allow us to understand the influence that tools themselves exert on the way they are used, or the different social relations and economies that are formed between who creates and uses them. Such a questioning approach to technology feels urgent, in a time in which more and more social, political and personal issues are addressed by solely technological means.
</p> </p>
</div>
<hr> <hr>
<p>
This summer, Relearn is back in the form of a curve, transversing multiple times and spaces. Curl yourselves this summer from, to and between Rotterdam, Brussels and Paris ! <a href='#' class='more'>Read more about the curve.</a>
</p>
<div class='details'>
<p>Relearn 2019 is a curve, transversing multiple times and spaces.</p> <p>Relearn 2019 is a curve, transversing multiple times and spaces.</p>
<p> <p>
These would be independently organized sessions based on the urgencies These would be independently organized sessions based on the urgencies
and affordances of each of the participating spaces. However, there and affordances of each of the participating spaces. However, there
would still be a common thread throughout the series, perhaps in the would still be a common thread throughout the series, perhaps in the
form of a transversal 'reroam' but also in the form of a roaming server form of a transversal “reroam” but also in the form of a roaming server
that is passed on to each subsequent event. that is passed on to each subsequent event.
It is possible to attend all sessions but not required, nor the goal, it It is possible to attend all sessions but not required, nor the goal, it
is really the intention to have self-standing events which do not depend is really the intention to have self-standing events which do not depend
people joining a succession of events but still share commonalities. people joining a succession of events but still share commonalities.
</p> </p>
</div>
<div id="rotterdam" class="controlpoint"> <div id="rotterdam" class="controlpoint">
<h2>·Rotterdam</h2> <h2>·Rotterdam</h2>
<dl> <dl class='summary'>
<dt>Date</dt> <dd>7<sup>th</sup>–9<sup>th</sup> June 2019</dd> <dt>Date</dt> <dd>7<sup>th</sup>–9<sup>th</sup> June 2019</dd>
<dt>Location</dt> <dd>Varia - Gouwstraat 3, Rotterdam, The Netherlands</dd> <dt>Location</dt> <dd>Varia - Gouwstraat 3, Rotterdam, The Netherlands</dd>
<dt>Initiator</dt> <dd><a href="https://varia.zone/en/" target='_blank'>Varia</a></dd> <dt>Initiator</dt> <dd><a href="https://varia.zone/en/" target='_blank'>Varia</a></dd>
<dt>Contact</dt> <dd><a href="mailto:&#105;&#110;&#102;&#111;&#064;&#118;&#097;&#114;&#105;&#097;&#046;&#122;&#111;&#110;&#101;">&#105;&#110;&#102;&#111;&#064;&#118;&#097;&#114;&#105;&#097;&#046;&#122;&#111;&#110;&#101;</a></dd> <dt>Contact</dt> <dd><a href="mailto:&#105;&#110;&#102;&#111;&#064;&#118;&#097;&#114;&#105;&#097;&#046;&#122;&#111;&#110;&#101;">&#105;&#110;&#102;&#111;&#064;&#118;&#097;&#114;&#105;&#097;&#046;&#122;&#111;&#110;&#101;</a></dd>
</dl> </dl>
@ -146,7 +156,7 @@ We will take care of a <em>daily vegetarian lunch</em> (please let us know about
<h2>·Brussels</h2> <h2>·Brussels</h2>
<dl> <dl class='summary'>
<dt>Date</dt> <dd>21<sup>st</sup>–22<sup>nd</sup> June 2019</dd> <dt>Date</dt> <dd>21<sup>st</sup>–22<sup>nd</sup> June 2019</dd>
<dt>Location</dt> <dd>Hacktiris - Rue Paul Devauxstraat 5, Brussels, Belgium</dd> <dt>Location</dt> <dd>Hacktiris - Rue Paul Devauxstraat 5, Brussels, Belgium</dd>
<dt>Initiator</dt> <dd><a href="http://osp.kitchen/" target='_blank'>OSP</a></dd> <dt>Initiator</dt> <dd><a href="http://osp.kitchen/" target='_blank'>OSP</a></dd>
@ -158,6 +168,17 @@ We will take care of a <em>daily vegetarian lunch</em> (please let us know about
<p> <p>
Exploring computed layout tools. Exploring computed layout tools.
</p> </p>
<p>
Since 2013, several initiatives have been experimenting with making printed publications using HTML/CSS/Javascript with the help of CSS regions. This feature is necessary to produce multi-paged publications and since its removal from Blink (2014) and in WebKit (2017), users are trapped with old versions of WebKit. Sticking to older version is still viable today but for how long?
</p>
<p>
This urgency leads us to a quite pragmatic but necessary worksession which will therefore focus on exploring other tools for making printed publications, especially computed layout tools (making layout with code). We already spotted three tools we would like to explore, but anyone is welcome to propose and experiment with other tools:
</p>
<dl>
<dt><a href='https://xxyxyz.org/' target='_blank'>Flat</a></dt><dd>A Python library made to draw graphics but also designed to produce multi-paged PDFs.</dd>
<dt><a href='http://sile-typesetter.org/' target='_blank'>Sile</a></dt><dd>A contemporary rewriting of the TeX mastodon.</dd>
<dt><a href='https://www.pagedmedia.org/paged-js/' target='_blank'>paged.js</a></dt><dd>A Javascript polyfill of CSS official specs for printed documents.</dd>
</dl>
<hr /> <hr />
@ -171,8 +192,8 @@ We will take care of a <em>daily vegetarian lunch</em> (please let us know about
10:00–18:00 10:00–18:00
</p> </p>
<ul> <ul>
<li>Short introduction of tools to experiment with: <a href='https://xxyxyz.org/' target='_blank'>Flat</a>, <a href='http://sile-typesetter.org/' target='_blank'>Sile</a>, <a href='https://www.pagedmedia.org/paged-js/' target='_blank'>paged.js</a>…</li> <li>Short introduction of tools</li>
<li>Choose your tool and have fun with it!</li> <li>Choose your tool and have fun with it!</li>
</ul> </ul>
</div> </div>
@ -189,7 +210,7 @@ We will take care of a <em>daily vegetarian lunch</em> (please let us know about
<div class='participation'> <div class='participation'>
<h3>Participation</h3> <h3>Participation</h3>
<p>If you would like to join this Relearn session, please send an email to <a href="mailto:&#109;&#105;&#097;&#109;&#064;&#111;&#115;&#112;&#046;&#107;&#105;&#116;&#099;&#104;&#101;&#110;">&#109;&#105;&#097;&#109;&#064;&#111;&#115;&#112;&#046;&#107;&#105;&#116;&#099;&#104;&#101;&#110;</a> with a short motivation of your interest. We will reply to subscriptions on a regular basis, up to the <strong>10<sup>th</sup> of June</strong>.</p> <p>Participation is free of charge. If you would like to join this Relearn session, please send an email to <a href="mailto:&#109;&#105;&#097;&#109;&#064;&#111;&#115;&#112;&#046;&#107;&#105;&#116;&#099;&#104;&#101;&#110;">&#109;&#105;&#097;&#109;&#064;&#111;&#115;&#112;&#046;&#107;&#105;&#116;&#099;&#104;&#101;&#110;</a> with a short motivation of your interest. We will reply to subscriptions on a regular basis, up to the <strong>10<sup>th</sup> of June</strong>.</p>
<p>Our <em>capacities</em> allow us to have a group of 12 relearners. Our preference goes out to people that can join the whole session (Friday, Saturday). <p>Our <em>capacities</em> allow us to have a group of 12 relearners. Our preference goes out to people that can join the whole session (Friday, Saturday).
</p> </p>
</div> </div>
@ -253,6 +274,10 @@ We will take care of a <em>daily vegetarian lunch</em> (please let us know about
$('#curve').stop().animate({scrollTop: scrollPos}, 200); $('#curve').stop().animate({scrollTop: scrollPos}, 200);
}); });
$('a.more').click(function(){
$(this).parent().next().toggle();
});
}); });
</script> </script>

Write Preview
Loading…
Cancel
Save