diff --git a/07/01/01.jpg b/07/01/01.jpg new file mode 100644 index 0000000..befc31b Binary files /dev/null and b/07/01/01.jpg differ diff --git a/07/01/010.jpg b/07/01/010.jpg new file mode 100644 index 0000000..f0f528d Binary files /dev/null and b/07/01/010.jpg differ diff --git a/07/01/011.jpg b/07/01/011.jpg new file mode 100644 index 0000000..2609758 Binary files /dev/null and b/07/01/011.jpg differ diff --git a/07/01/012.jpg b/07/01/012.jpg new file mode 100644 index 0000000..6d15f28 Binary files /dev/null and b/07/01/012.jpg differ diff --git a/07/01/013.jpg b/07/01/013.jpg new file mode 100644 index 0000000..c4ccab0 Binary files /dev/null and b/07/01/013.jpg differ diff --git a/07/01/014.jpg b/07/01/014.jpg new file mode 100644 index 0000000..d03a6e5 Binary files /dev/null and b/07/01/014.jpg differ diff --git a/07/01/015.jpg b/07/01/015.jpg new file mode 100644 index 0000000..b314f03 Binary files /dev/null and b/07/01/015.jpg differ diff --git a/07/01/016.jpg b/07/01/016.jpg new file mode 100644 index 0000000..ea50be5 Binary files /dev/null and b/07/01/016.jpg differ diff --git a/07/01/02.jpg b/07/01/02.jpg new file mode 100644 index 0000000..ab58ec8 Binary files /dev/null and b/07/01/02.jpg differ diff --git a/07/01/03.jpg b/07/01/03.jpg new file mode 100644 index 0000000..fccd10b Binary files /dev/null and b/07/01/03.jpg differ diff --git a/07/01/04.jpg b/07/01/04.jpg new file mode 100644 index 0000000..4758aea Binary files /dev/null and b/07/01/04.jpg differ diff --git a/07/01/05.jpg b/07/01/05.jpg new file mode 100644 index 0000000..baf4fa7 Binary files /dev/null and b/07/01/05.jpg differ diff --git a/07/01/06.jpg b/07/01/06.jpg new file mode 100644 index 0000000..e30bfe2 Binary files /dev/null and b/07/01/06.jpg differ diff --git a/07/01/07.jpg b/07/01/07.jpg new file mode 100644 index 0000000..d5bb495 Binary files /dev/null and b/07/01/07.jpg differ diff --git a/07/01/08.jpg b/07/01/08.jpg new file mode 100644 index 0000000..ed375b3 Binary files /dev/null and b/07/01/08.jpg differ diff --git a/07/01/09.jpg b/07/01/09.jpg new file mode 100644 index 0000000..10fac76 Binary files /dev/null and b/07/01/09.jpg differ diff --git a/07/02/iris.jpg b/07/02/iris.jpg new file mode 100644 index 0000000..d8475b0 Binary files /dev/null and b/07/02/iris.jpg differ diff --git a/07/font/Arial Narrow Italic.ttf b/07/font/Arial Narrow Italic.ttf new file mode 100644 index 0000000..fc78fe7 Binary files /dev/null and b/07/font/Arial Narrow Italic.ttf differ diff --git a/07/font/Arial Narrow.ttf b/07/font/Arial Narrow.ttf new file mode 100644 index 0000000..9d92f4f Binary files /dev/null and b/07/font/Arial Narrow.ttf differ diff --git a/07/font/Arial.ttf b/07/font/Arial.ttf new file mode 100644 index 0000000..3d6805d Binary files /dev/null and b/07/font/Arial.ttf differ diff --git a/07/img/02.jpg b/07/img/02.jpg new file mode 100644 index 0000000..5e70a41 Binary files /dev/null and b/07/img/02.jpg differ diff --git a/07/img/horizontaldots.png b/07/img/horizontaldots.png new file mode 100644 index 0000000..ef1186f Binary files /dev/null and b/07/img/horizontaldots.png differ diff --git a/07/img/verticaldots.png b/07/img/verticaldots.png new file mode 100644 index 0000000..92a0fd4 Binary files /dev/null and b/07/img/verticaldots.png differ diff --git a/07/index.html b/07/index.html index 5c4b2d2..b88d79a 100644 --- a/07/index.html +++ b/07/index.html @@ -1,28 +1,191 @@ - - - - Start up, Burn out: Life Hacks - - - -
-

Start up, Burn out:
Life Hacks

-

13.12.2018
19:30-21:30
Het Nieuwe Instituut

EXCLUSIVE MANDATORY
FREE TICKETS HERE
(100% DISCOUNT 100% LEGIT)

-
-
-

IRIS

-

A shady corporation is trying to take control of a fluid, chaotic global market. Workers surrender themselves to a seductive new device called Iris, which purports to enlighten them and unleash the real power of the entrepreneurial self. Iris is designed to help full-time, part-time and zero-time employees cope with the complexity of modern life, divulging secrets of the precarious worker, of autonomy and maximum efficiency through a new magic formula contained in the meaning of Life Hacks. But… anonymous cyber-pirates are exploiting the device to rouse a cry of rebellion against this oppressive society of self-management. Discover the paradox buried deep within Iris, where autonomy leads to subjugation, and subjugation appears as freedom.

-

The Experimental Publishing (XPUB) program of the Piet Zwart Institute invites you to the third event of the Life Hacks series. Following the launch of ‘Ten Theses on Life Hacks’, XPUB’s 7th Special Issue is a further step of an inquiry into the meaning of Life Hacks. XPUB welcomes you to experience a personal session with Iris, and discover your limitless potential to succeed.

-

IRIS

-

Contributors: Gill Baldwin, Simon Browne, Tancredi Di Giovanni, Paloma García, Rita Graça, Artemis Gryllaki, Pedro Sá Couto, Biyi Wen, Bohye Woo, Silvio Lorusso, Aymeric Mansoux, André Castro, Steve Rushton, Michael Murtaugh, Leslie Robbins. Produced and published by the Experimental Publishing (XPUB) program of the Piet Zwart Institute, Rotterdam, December 2018. A collaboration between Silvio Lorusso, the Research Department of Het Nieuwe Instituut and XPUB.

-

IRIS

-

Life Hacks is part of Het Nieuwe Instituut’s fellowship program around the theme of burn-out. As 2017 fellow Ramon Amaro states, “on the one hand, to ‘burn out’ is to stall, break, or become otherwise unusable. In other words, processes, procedure and participation simply stop working. On the other hand, burn-out is an opportunity to break open, promote action and catalyse change towards new structures and relations.”

-

Life Hacks manifests in a series of gatherings that respond to this ambivalence by exploring the approaches and techniques adopted to design or redesign life against the backdrop of growing precarity and an intensified entrepreneurial regime. Together with Silvio Lorusso, theorists, practitioners and XPUB, the Experimental Publishing program of the Piet Zwart Institute, Life Hacks looks into the tensions and releases that emerge from the constant reinvention and progressive self-optimization necessary to inhabit public and private space, manage time and productivity, and tweak one's own thoughts and feelings.

-
- - + + + + —  IRIS + + + + + + + + + + + + + + + +
+ +
+ +
+
+ DOWNLOAD TEN THESES ON LIFE HACKS HERE!

 + DOWNLOAD TEN THESES ON DESKTOP VERSION!

 +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ + + + +
+
+ +
+ +
+ +
+ +
+
+ +
+
+ COLOPHON + VIDEO + ABOUT +
+ +
+ + +
+
+

Start up, Burn out:
+ Life Hacks

+ +

13.12.2018
+ Het Nieuwe Instituut

+ +

A shady corporation is trying to take control of a fluid, chaotic global market. Workers surrender themselves to a seductive new device called Iris, which purports to enlighten them and unleash the real power of the entrepreneurial self. Iris is designed to help full-time, part-time and zero-time employees cope with the complexity of modern life, divulging secrets of the precarious worker, of autonomy and maximum efficiency through a new magic formula contained in the meaning of Life Hacks. But… anonymous cyber-pirates are exploiting the device to rouse a cry of rebellion against this oppressive society of self-management. Discover the paradox buried deep within Iris, where autonomy leads to subjugation, and subjugation appears as freedom.


+

The Experimental Publishing (XPUB) program of the Piet Zwart Institute invites you to the third event of the Life Hacks series. Following the launch of ‘Ten Theses on Life Hacks’, XPUB’s 7th Special Issue is a further step of an inquiry into the meaning of Life Hacks. XPUB welcomes you to experience a personal session with Iris, and discover your limitless potential to succeed.


+ +

Life Hacks is part of Het Nieuwe Instituut’s fellowship program around the theme of burn-out. As 2017 fellow Ramon Amaro states, “on the one hand, to ‘burn out’ is to stall, break, or become otherwise unusable. In other words, processes, procedure and participation simply stop working. On the other hand, burn-out is an opportunity to break open, promote action and catalyse change towards new structures and relations.”


+ +

Life Hacks manifests in a series of gatherings that respond to this ambivalence by exploring the approaches and techniques adopted to design or redesign life against the backdrop of growing precarity and an intensified entrepreneurial regime. Together with Silvio Lorusso, theorists, practitioners and XPUB, the Experimental Publishing program of the Piet Zwart Institute, Life Hacks looks into the tensions and releases that emerge from the constant reinvention and progressive self-optimization necessary to inhabit public and private space, manage time and productivity, and tweak one's own thoughts and feelings.


+ +

Contributors

+ +

Gill Baldwin, Simon Browne, Tancredi Di Giovanni, Paloma García, Rita Graça, Artemis Gryllaki, Pedro Sá Couto, Biyi Wen, Bohye Woo, Silvio Lorusso, Aymeric Mansoux, André Castro, Steve Rushton, Michael Murtaugh, Leslie Robbins. Produced and published by the Experimental Publishing (XPUB) program of the Piet Zwart Institute, Rotterdam, December 2018. A collaboration between Silvio Lorusso, the Research Department of Het Nieuwe Instituut and XPUB.

+ + + +
+
+ +
+
+ + + + + + + + diff --git a/07/intro.jpg b/07/intro.jpg new file mode 100644 index 0000000..c6a620d Binary files /dev/null and b/07/intro.jpg differ diff --git a/07/irisicon.png b/07/irisicon.png new file mode 100644 index 0000000..f4e6691 Binary files /dev/null and b/07/irisicon.png differ diff --git a/07/mouse.js b/07/mouse.js new file mode 100644 index 0000000..f77eabb --- /dev/null +++ b/07/mouse.js @@ -0,0 +1,89 @@ + ;(function(){ + var msg = "IRIS version 0.5"; + var size = 14; + var circleY = 0.75; var circleX = 2; + var letter_spacing = 5; + var diameter = 10; + var rotation = 0.4; + var speed = 0.3; + + if (!window.addEventListener && !window.attachEvent || !document.createElement) return; + + msg = msg.split(''); + var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20, + ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [], + + o = document.createElement('div'), oi = document.createElement('div'), + b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body, + + mouse = function(e){ + e = e || window.event; + ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position + xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position + }, + + makecircle = function(){ // rotation/positioning + if(init.nopy){ + o.style.top = (b || document.body).scrollTop + 'px'; + o.style.left = (b || document.body).scrollLeft + 'px'; + }; + + currStep -= rotation; + + for (var d, i = n; i > -1; --i){ // makes the circle + + d = document.getElementById('iemsg' + i).style; + d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px'; + d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px'; + }; + }, + + drag = function(){ // makes the resistance + y[0] = Y[0] += (ymouse - Y[0]) * speed; + x[0] = X[0] += (xmouse - 20 - X[0]) * speed; + for (var i = n; i > 0; --i){ + y[i] = Y[i] += (y[i-1] - Y[i]) * speed; + x[i] = X[i] += (x[i-1] - X[i]) * speed; + }; + + makecircle(); + }, + + init = function(){ // appends message divs, & sets initial values for positioning arrays + + if(!isNaN(window.pageYOffset)){ + ymouse += window.pageYOffset; + xmouse += window.pageXOffset; + } else init.nopy = true; + for (var d, i = n; i > -1; --i){ + + d = document.createElement('div'); d.id = 'iemsg' + i; + d.style.height = d.style.width = a + 'px'; + d.appendChild(document.createTextNode(msg[i])); + oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0; + }; + + o.appendChild(oi); document.body.appendChild(o); + setInterval(drag, 25); + }, + + ascroll = function(){ + ymouse += window.pageYOffset; + xmouse += window.pageXOffset; + window.removeEventListener('scroll', ascroll, false); + }; + + o.id = 'outerCircleText'; o.style.fontSize = size + 'px'; + + if (window.addEventListener){ + window.addEventListener('load', init, false); + document.addEventListener('mouseover', mouse, false); + document.addEventListener('mousemove', mouse, false); + if (/Apple/.test(navigator.vendor)) + window.addEventListener('scroll', ascroll, false); + } + else if (window.attachEvent){ + window.attachEvent('onload', init); + document.attachEvent('onmousemove', mouse); + }; + })(); diff --git a/07/fonts/Vegur-Light.otf b/07/old/fonts/Vegur-Light.otf similarity index 100% rename from 07/fonts/Vegur-Light.otf rename to 07/old/fonts/Vegur-Light.otf diff --git a/07/fonts/Vegur-Regular.otf b/07/old/fonts/Vegur-Regular.otf similarity index 100% rename from 07/fonts/Vegur-Regular.otf rename to 07/old/fonts/Vegur-Regular.otf diff --git a/07/img/iris.jpg b/07/old/img/iris.jpg similarity index 100% rename from 07/img/iris.jpg rename to 07/old/img/iris.jpg diff --git a/07/old/index.html b/07/old/index.html new file mode 100644 index 0000000..5c4b2d2 --- /dev/null +++ b/07/old/index.html @@ -0,0 +1,28 @@ + + + + + Start up, Burn out: Life Hacks + + + +
+

Start up, Burn out:
Life Hacks

+

13.12.2018
19:30-21:30
Het Nieuwe Instituut

EXCLUSIVE MANDATORY
FREE TICKETS HERE
(100% DISCOUNT 100% LEGIT)

+
+
+

IRIS

+

A shady corporation is trying to take control of a fluid, chaotic global market. Workers surrender themselves to a seductive new device called Iris, which purports to enlighten them and unleash the real power of the entrepreneurial self. Iris is designed to help full-time, part-time and zero-time employees cope with the complexity of modern life, divulging secrets of the precarious worker, of autonomy and maximum efficiency through a new magic formula contained in the meaning of Life Hacks. But… anonymous cyber-pirates are exploiting the device to rouse a cry of rebellion against this oppressive society of self-management. Discover the paradox buried deep within Iris, where autonomy leads to subjugation, and subjugation appears as freedom.

+

The Experimental Publishing (XPUB) program of the Piet Zwart Institute invites you to the third event of the Life Hacks series. Following the launch of ‘Ten Theses on Life Hacks’, XPUB’s 7th Special Issue is a further step of an inquiry into the meaning of Life Hacks. XPUB welcomes you to experience a personal session with Iris, and discover your limitless potential to succeed.

+

IRIS

+

Contributors: Gill Baldwin, Simon Browne, Tancredi Di Giovanni, Paloma García, Rita Graça, Artemis Gryllaki, Pedro Sá Couto, Biyi Wen, Bohye Woo, Silvio Lorusso, Aymeric Mansoux, André Castro, Steve Rushton, Michael Murtaugh, Leslie Robbins. Produced and published by the Experimental Publishing (XPUB) program of the Piet Zwart Institute, Rotterdam, December 2018. A collaboration between Silvio Lorusso, the Research Department of Het Nieuwe Instituut and XPUB.

+

IRIS

+

Life Hacks is part of Het Nieuwe Instituut’s fellowship program around the theme of burn-out. As 2017 fellow Ramon Amaro states, “on the one hand, to ‘burn out’ is to stall, break, or become otherwise unusable. In other words, processes, procedure and participation simply stop working. On the other hand, burn-out is an opportunity to break open, promote action and catalyse change towards new structures and relations.”

+

Life Hacks manifests in a series of gatherings that respond to this ambivalence by exploring the approaches and techniques adopted to design or redesign life against the backdrop of growing precarity and an intensified entrepreneurial regime. Together with Silvio Lorusso, theorists, practitioners and XPUB, the Experimental Publishing program of the Piet Zwart Institute, Life Hacks looks into the tensions and releases that emerge from the constant reinvention and progressive self-optimization necessary to inhabit public and private space, manage time and productivity, and tweak one's own thoughts and feelings.

+
+ + + diff --git a/07/old/iris.js b/07/old/iris.js new file mode 100644 index 0000000..66c0116 --- /dev/null +++ b/07/old/iris.js @@ -0,0 +1,94 @@ +(function () { + + Messages = [ + "My mind is bursting with bright ideas, kind words, and happiness.", + "No person, place, or thing has any power over me, for I am the only thinker in my mind.", + "Every experience I have is perfect for my growth.", + "I am a joyful breeze entering a room.", + "I feel safe in the rhythm and flow of ever-changing life.", + "I am my own superhero.", + "My body is healthy, and I’m grateful.", + "I choose not to criticize myself or others around me.", + "I love myself fully, including the way I look.", + "Negative thoughts only have the power I allow them.", + "Today I create a wonderful new day and a wonderful new future.", + "Being miserable is a habit; being happy is a habit; the choice is mine.", + "My financial prospect brings me joy.", + "A problem is a chance for me to do my very best.", + "Dreams and goals are coming attractions in my life.", + "There is only one thing that makes a dream impossible to achieve: the fear of failure.", + "I will master distractions and keep my focus on my goals.", + "I turn towards my difficulties instead of trying to fix them instantly.", + "I am in charge of how I feel and today I am choosing happiness.", + "I have infinite patience when it comes to fulfilling my own destiny.", + "I am connected to an unlimited source of abundance.", + "I’m an infinite being. The age of my body has no bearing on what I do and who I am.", + "I feel passionately about my life, and this passion fills me with excitement and energy.", + "Every crisis is an opportunity in disguise.", + "I bring something unique to the table by simply being me.", + "The tools I need to succeed are in my possession.", + "I use my failures as stepping stones.", + "The success of others will not make me jealous. My time will come.", + "A calm feeling spreads through my thoughts and actions.", + "Inner wisdom shines from within me as I grow.", + "Are efficient solutions the ultimate goal?", + "Do you try to solve one problem at a time?", + "Are you conscious of your problems?", + "If happiness is a currency, how rich do you think you are?", + "If there were no consequences, would you be afraid of mistakes?", + "Are you doing what you truly want to do?", + "If the chance of failure and success was 50-50, would you still take a shot?", + "What would you prefer? Stable but boring work, or interesting and demanding work?", + "If you had a time machine, would you abandon this era?", + "Are you convinced this is the best possible world?", + "Which is worse, failing or not even trying?", + "Is this insanity or just creativity?", + "Why are you, you?", + "What are you most grateful for?", + "In what ways do you make your life better, more fulfilling, or meaningful?", + "What empowering beliefs will help you achieve your goals?", + "What is your purpose in life? Why do you exist? What is your mission?", + "Is there a joyful marriage between your profession and your passion?", + "What qualities do you embody?", + "We learn from our mistakes, yet we’re always so afraid to make them. Where is this true for you?", + "Think of one job that could get you out of bed happily for the rest of your life. Are you doing it now?", + "When it’s all said and done, will you have said more than you’ve done?", + "We’re always making choices. Are you choosing for your story or for someone else’s?", + "Do you need permission to move forward?", + "How much better would your life be if there weren’t any criticism in the world?", + "Which worries you more – doing things right or doing the right things?", + "What risk would you take if you knew you could not fail?", + "Are you working so hard to create an amazing future, that you miss a million nows?", + "Are your dreams bigger than other people's opinions or vice versa?", + "If the biggest obstacle in your life was removed, how would your life change?" + ]; + + + function getRandomInt(min, max) { + min = Math.ceil(min); + max = Math.floor(max); + return Math.floor(Math.random() * (max - min + 1)) + min; + } + + function sleep(ms) { + return new Promise(resolve => setTimeout(resolve, ms)); + } + + async function newMessage(id) { + while (true) { + ms = getRandomInt(1000, 3000); + Message = Messages[Math.floor(Math.random()*Messages.length)]; + document.getElementById(id).innerHTML = Message; + await sleep(ms); + } + } + + function iris(){ + newMessage('oneliner-1'); + newMessage('oneliner-2'); + newMessage('oneliner-3'); + } + + window.onload = iris; + +})(); diff --git a/07/old/style.css b/07/old/style.css new file mode 100644 index 0000000..2d8cbc3 --- /dev/null +++ b/07/old/style.css @@ -0,0 +1,80 @@ +@font-face { + font-family: "Vegur Regular"; + src: url("fonts/Vegur-Regular.otf"); +} + +@font-face { + font-family: "Vegur Light"; + src: url("fonts/Vegur-Light.otf"); +} + +html { + background-color: #9200e5; + background-image: url("img/iris.jpg"); + background-repeat: no-repeat; + background-position: center; + background-size: 100%; + background-attachment: fixed; + font-size: 16px; + + @media (max-width: 1000px) { + font-size: calc(12px + .4vw); + } +} + +body { + text-align: center; + max-width: 800px; + margin: 0 auto; + font-size: 1.5rem; + font-family: "Vegur Regular", sans-serif; + color: #ffffff; +} + +.box { + display: flex; + flex: 1 1 auto; + flex-direction: column; + text-align: center; + align-items: center; + justify-content: center; + height: 12rem; +} + +h1 { + font-size: 6rem; + letter-spacing: -0.2rem; + line-height: 5rem; +} + +h2 { + font-size: 3rem; + font-family: "Vegur Light"; + letter-spacing: -0.1rem; +} + +header p, footer p { + font-size: 2rem; +} + +header p.italic, footer p.italic { + font-style: italic; +} + +main p { + line-height: 3rem; +} + +.blink { + animation: blinker 1s step-end infinite; +} + +@keyframes blinker { + 50% { + opacity: 0; + } +} + +a, a:active, a:visited { + color: #ffffff; +} diff --git a/07/reset.css b/07/reset.css new file mode 100644 index 0000000..ed11813 --- /dev/null +++ b/07/reset.css @@ -0,0 +1,48 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} diff --git a/07/special_issue_07-web.mp4 b/07/special_issue_07-web.mp4 new file mode 100644 index 0000000..5e92386 Binary files /dev/null and b/07/special_issue_07-web.mp4 differ diff --git a/07/style.css b/07/style.css index 2d8cbc3..949cf06 100644 --- a/07/style.css +++ b/07/style.css @@ -1,80 +1,340 @@ @font-face { - font-family: "Vegur Regular"; - src: url("fonts/Vegur-Regular.otf"); + font-family: "Arial"; + src: url("font/arial.ttf"); + font-weight: 300; + font-style: normal;} + + @font-face { + font-family: "Arial Narrow"; + src: url("font/Arial Narrow.ttf"); + font-weight: 300; + font-style: normal;} + +body { + font-size: calc(8px + 0.7vw); + font-family: Arial, Helvetica, sans-serif; + scrollbar-width: none; } -@font-face { - font-family: "Vegur Light"; - src: url("fonts/Vegur-Light.otf"); +a{ + text-decoration: none; + color: black; + display: inline; + clear: none; } -html { - background-color: #9200e5; - background-image: url("img/iris.jpg"); - background-repeat: no-repeat; - background-position: center; - background-size: 100%; - background-attachment: fixed; - font-size: 16px; +a:hover, a.get:hover, a.menus:hover{ + text-decoration: none; + color: #972fe8; +} - @media (max-width: 1000px) { - font-size: calc(12px + .4vw); - } +a:visited{ + text-decoration: none; + color: black; } -body { - text-align: center; - max-width: 800px; - margin: 0 auto; - font-size: 1.5rem; - font-family: "Vegur Regular", sans-serif; - color: #ffffff; +.back{ + margin-left: 30vw; + width: 70vw; + height: 94vh; + position: fixed; + background-color: #dbdcde; +} + +#topdots{ + position: fixed; + top: 0px; + height: 4vh; + width: 30vw; + background-color: #dbdcde; +} + +#topdots img{ + width: 80%; + margin-left: 10%; + margin-top: 1vh; } -.box { - display: flex; - flex: 1 1 auto; - flex-direction: column; +#bottomdots{ + position: fixed; + bottom: 6vh; + height: 4vh; + width: 30vw; + background-color: #dbdcde; +} + +#bottomdots img{ + width: 80%; + margin-left: 10%; +} + +.left{ + position: fixed; + margin-top: 4vh; + height: 86vh; + width: 30vw; + background-color: #dbdcde; +} + +#leftheader{ + font-family: "Arial Narrow", Helvetica, sans-serif; + width: 100%; text-align: center; - align-items: center; - justify-content: center; - height: 12rem; + font-size: calc(6px + 0.5vw); } -h1 { - font-size: 6rem; - letter-spacing: -0.2rem; - line-height: 5rem; +.gallerywrapper{ + margin-top: 4vh; + margin-left: 10%; + width: 80%; + text-align: center; } -h2 { - font-size: 3rem; - font-family: "Vegur Light"; - letter-spacing: -0.1rem; +.gallerywrapper img{ + width: 100%; } -header p, footer p { - font-size: 2rem; + ::-webkit-scrollbar { + display: none; } -header p.italic, footer p.italic { +footer { + background-color: #972fe8; + color: white; + font-size: calc(6px + 0.7vw); font-style: italic; + position: fixed; + bottom: 0; + left: 0 + width: 100vw; + height: 6vh; +} + + .box{ + text-align: center; + width: 100vw; + height: 6vh; + line-height: 6vh; + } + +video{ + width: 100%; +} + +main{ + position: fixed; + left: 30vw; + margin-top: 4vh; + margin-left: 3vw; + height: 75.5vh; + width: 64vw; + overflow:scroll; + text-align: left; +} + +.right{ + position: fixed; + top: 0; + margin-top: 4vh; + width: 70vw; + left: 30vw; + text-align: center; +} + +.headeright{ + font-family: "Arial", Helvetica, sans-serif; + width: 70vw; + font-size: calc(6px + 0.5vw); +} + +.block{ + background-color: #dbdcde; +} + +.text{ + line-height: 115%; + padding-top: 8vh; + margin-left: 2vw; + margin-right: 15vw; +} + +#bo{ + width: 30vw; +} + +h2{ + padding-bottom: 3vh; + padding-top: 1vh; + text-transform: uppercase; + color: #972fe8; +} + +#colophon2{ + padding-bottom: 5vh; +} + +/* MOUSE OUTER CIRCLE!!!!!!!!!!!!! */ + #outerCircleText { + font-style: italic; + font-weight: bold; + font-family: Arial, Helvetica, sans-serif; + color: #000; + position: absolute;top: 0;left: 0;z-index: 3000;cursor: default; + } + + #outerCircleText div {position: relative;} + + #outerCircleText div div { + position: absolute; + top: 0; + left: 0; + text-align: center; + } +/* MOUSE OUTER CIRCLE!!!!!!!!!!!!! */ + + + +/* Slideshow container */ +.slideshow-container { + margin-top: 4vh; + margin-left: 10%; + width: 80%; + text-align: center; +} + +/* Position the "next button" to the right */ +.next { + width: 12vw; + text-align: right; + font-family: "Arial Narrow", Helvetica, sans-serif; + font-size: calc(6px + 0.5vw); + position: fixed; + bottom: 15vh; + cursor: pointer; + +} + +.prev { + text-align: left; + font-family: "Arial Narrow", Helvetica, sans-serif; + font-size: calc(6px + 0.5vw); + position: fixed; + bottom: 15vh;; + left: 3vw; + cursor: pointer; } -main p { - line-height: 3rem; +.next:hover, .prev:hover{ + text-decoration: none; + color: #972fe8; } -.blink { - animation: blinker 1s step-end infinite; +#phone{ + display: none; } -@keyframes blinker { - 50% { - opacity: 0; +@media screen and (max-width: 635px) { + + #desktop{ + display: none; + } + + #phone{ + display:block; } + + + +body{ + background-color: #dbdcde; + overflow-x: hidden; +} + +.back{ +display: none; +width: 100%; +overflow: hidden; +} + +.left{ +position: static; +width: 100vw; +height: 60vh; +overflow:hidden; + margin-top: 2vh; +} + + +.text{ + margin-left: 9vw; + margin-right: 7vw; +} + +#colophon2{ + padding-bottom: 2vh; +} + + +main{ +position: static; +width: 100%; +overflow: auto; +margin-top: 65vh; +overflow:hidden; +height: auto; +margin-left: -30vw; +} + +.right{ +position: absolute; +width: 100vw; +margin-top: 0vh; +} + +.headeright{ + display: none; +} + +.block{ + background-color: #dbdcde; +} + + +#leftheader{ + position: static; + top: 3vh; +} + + /* Position the "next button" to the right */ +.next { +display: none; +} + +.prev { +display: none; +} + +#topdots{ + display: none; +} + + +#bottomdots{ + display: none; +} + +footer { + font-size: calc(7px + 0.9vw); + height: 4vh; +} + .box{ + height: 4vh; + line-height: 4vh; + } + +#bo{ + width: 40vw; + padding-bottom: 20vw; } -a, a:active, a:visited { - color: #ffffff; } diff --git a/07/x_theses.pdf b/07/x_theses.pdf new file mode 100755 index 0000000..aee0a1a Binary files /dev/null and b/07/x_theses.pdf differ diff --git a/08/pedrosacouto/cnn.css b/08/pedrosacouto/cnn.css new file mode 100644 index 0000000..da972c4 --- /dev/null +++ b/08/pedrosacouto/cnn.css @@ -0,0 +1,91 @@ +/* Push the body down with margin-top*/ +body { + margin-top: 40px; + /*background-color: pink;*/ +} + +/* CNN styling */ +#cnn{ + position: fixed; + width: calc(100% - 10px); + min-width: 420px; + height: 25px; + top:0; + left:0; + right: 0; + vertical-align: top; + padding: 6px; + font-size: 16px; + background-color: #f2f5f6; + background-image: -webkit-gradient(linear, left top, left bottom, from(yellow), to(gold)); +} + +#cnn .button_container { + display: inline-block; + width: calc(50% - 20px); + transform: scaleX(0.7); + transform-origin: 0 0; +} + +#sitemap button:hover{ + color: blue; +} + +#sitemap button{ + position: absolute; + top:0; + right:0; + margin:5px; + padding-top: 5px; + text-transform: uppercase; + color: black; + transform: scaleX(0.7); + transform-origin: 0 0; +} + +.cnn-button{ + padding-top: 5px; +} + +#buttonA{ + padding-left: 20px; +} + + +@media only screen and (max-width: 700px){ + + body { + margin-top: 40px; + /*background-color: yellow;*/ + } + + #cnn { + width: calc(100% - 10px); + height: 40px; + font-size: 12px; + padding-bottom: 12px; + } + + #cnn .button_container { + width: calc(100% - 100px); + } + + #sitemap button { + position: fixed; + right: 5px; + top: 1px; + margin-top: 2px; + } + + #buttonA, #buttonB{ + padding-left: 5px; + } + + .cnn-button{ + padding-top: 1px; + } + + #cnn{ + height: 25px; + +} diff --git a/08/pedrosacouto/cnn.js b/08/pedrosacouto/cnn.js new file mode 100644 index 0000000..834d688 --- /dev/null +++ b/08/pedrosacouto/cnn.js @@ -0,0 +1,84 @@ + const invocation = new XMLHttpRequest(); + const url = 'https://pad.xpub.nl/p/special_issue_8_cnn/export/txt'; + + function findCategories(data){ + // Return categories that this page is part of + // by doing a reversed dictionary lookup + var current_url = window.location.href; + var keys = Object.keys(data) + var categories = []; + for(var i=0; i + + + + —  The Network We de(Served) + + + + + + + + + + + + + + + +
+
+
    +
    • +
+
+
    +
    • +
+
+
    +
    • +
+
+
    +
    • +
+
+ +
+ + + + + + + diff --git a/08/pedrosacouto/reset.css b/08/pedrosacouto/reset.css new file mode 100644 index 0000000..ed11813 --- /dev/null +++ b/08/pedrosacouto/reset.css @@ -0,0 +1,48 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} diff --git a/08/pedrosacouto/style.css b/08/pedrosacouto/style.css new file mode 100644 index 0000000..ff40e24 --- /dev/null +++ b/08/pedrosacouto/style.css @@ -0,0 +1,425 @@ +@font-face { + font-family: "Arial"; + src: url("font/Arial.ttf"); + font-weight: 400; + font-style: normal; +} + +@font-face { + font-family: "Times New Roman"; + src: url("font/Times New Roman.ttf"); + font-weight: 400; + font-style: normal; +} + +body{ + width: 99%; + background-color: #FFF; + font-family: "Arial", "Helvetica Neue", "Helvetica", sans-serif; + font-weight: 400; + margin-left: 1%; +} + +main{ + width:100%; + height:100%; + overflow:scroll; + white-space: nowrap; +} + +ul{ + text-transform: uppercase; + width: calc(94vh - 30px); + transform: rotate(90deg); + transform-origin:top left; + -ms-transform: rotate(90deg); /* IE 9 */ + -ms-transform-origin:top left; /* IE 9 */ + -webkit-transform: rotate(90deg); /* Safari and Chrome */ + -webkit-transform-origin:top left; /* Safari and Chrome */ + moz-transform: rotate(90deg); /* Firefox */ + -moz-transform-origin:top left; /* Firefox */ + -o-transform: rotate(90deg); /* Opera */ + -o-transform-origin:top left; /* Opera */ + position: relative; + left: 30px; +} + +li{ + font-size: 1.8em; + transform: scaleX(0.45); + transform-origin: 0 0; +} + +footer{ + font-family: "Times New Roman"; + position: fixed; + bottom: 2vh; + right: -75px; + text-align: right; + font-size: 1.4em; + text-transform: uppercase; + transform: scaleX(0.6); + transform-origin: 0 0; + z-index: -1; +} + +header{ + font-family: "Times New Roman"; + position: fixed; + top: 2vh; + right: -134px; + text-align: right; + font-size: 1.4em; + text-transform: uppercase; + transform: scaleX(0.6); + transform-origin: 0 0; + z-index: -1; +} + +a{ + text-decoration: none; + color: #000; +} + +a:hover{ + text-decoration: none; + color: #e2e3e4; +} + +a.grey:hover, a.aboutmore:hover{ + text-decoration: none; + color: #eeeff0; +} + +a:visited{ + text-decoration: none; +} + +em{ + font-style: italic; +} + +.not_mine{ + color: #909090; +} + +.open{ + display: inline-block; + background-color: #eeeff0; + height: calc(94vh - 30px); + padding-top: 5px; + margin-top: 10px; + margin-bottom: 5px; + margin-left: 10px; + width: 35px; + overflow: auto; + white-space: normal; +} + +.popup{ + line-height: 120%; + display: none; + background-color: #e2e3e4; + width: 450px; + height: calc(94vh - 30px); + overflow: auto; + white-space: normal; + vertical-align: top; + padding-top: 5px; + margin-top: 10px; + margin-bottom: 5px; + +} + +h2{ + transform: scaleX(0.7); + font-size: 1.6em; + line-height: 110%; + text-transform: uppercase; + transform-origin: 0 0; + margin-left: 8px; + margin-bottom: 10px; +} + +h1{ + transform: scaleX(0.6); + font-size: 1.8em; + line-height: 110%; + text-transform: uppercase; + transform-origin: 0 0; + margin-left: 8px; + margin-bottom: 10px; +} + +.sub_h1{ + font-family: "Times New Roman"; +} + +p{ + margin-left: 16px; + margin-right: 36px; + overflow: auto; + white-space: normal; + padding-bottom: 1em; + font-size: 15px; + line-height: 120%; +} + +.footnotes{ + font-family: "Times New Roman"; + transform: scaleX(0.8); + transform-origin: 0 0; + margin-left: 8px; + font-size: 14px; + line-height: 120%; +} + +.git{ + font-family: "Times New Roman"; + transform: scaleX(0.8); + transform-origin: 0 0; + margin-left: 0px; + font-size: 14px; + line-height: 120%; + padding-top: 8px; +} + +button, input[type="submit"], input[type="reset"] { + background: none; + color: inherit; + border: none; + padding: 0; + font: inherit; + cursor: pointer; + outline: inherit; +} + +figcaption{ + font-family: "Times New Roman"; + transform: scaleX(0.8); + transform-origin: 0 0; + margin-left: 8px; + font-size: 14px; + line-height: 120%; + text-align: justify; + text-justify: inter-word; + margin-bottom: 12px; +} + + +img{ + margin-top: 3px; + margin-left: 8px; + width: 326px; +} + +h3{ + transform: scaleX(0.7); + font-size: 1.6em; + line-height: 110%; + text-transform: uppercase; + transform-origin: 0 0; + margin-left: 8px; + margin-bottom: 10px; +} + +.avatar{ + width: 125px; + padding-top: 10px; +} + +.answer{ + background-color: #eeeff0; + width: 388px; + margin-left: 0; + margin-right: 0; + margin-bottom: 75px; + padding: 8px; + padding-left: 36px; + padding-right: 26px; +} + +.link{ + font-size: 1.6em; + line-height: 110%; + transform: scaleX(0.6); + text-transform: uppercase; + transform-origin: 0 0; + background-color: #eeeff0; + width: 742px; + margin-left: 0; + margin-right: 0; + margin-bottom: 8px; + padding: 8px; + padding-left: 8px; + padding-right: 0px; +} + +#text04 { + padding-top: 0px; + padding-top: 1vh; +} + +.description{ + margin-bottom: 15px; +} + +.name{ + display: inline-block; + vertical-align: top; + padding-top: 10px; +} + +.username{ + font-family: "Times New Roman"; + transform: scaleX(0.8); + transform-origin: 0 0; + margin-left: 8px; + font-size: 14px; + margin-bottom: 6px; +} + +.code{ + display: none; +} + +.aboutmore{ + font-family: "Times New Roman"; + transform: scaleX(0.6); + transform-origin: 0 0; + font-size: 12px; +} + + + +@media only screen and (max-width: 700px){ + +header{ + display: none; +} + +ul{ + width: 95%; + transform: rotate(0deg); + transform-origin:top left; + -ms-transform: rotate(0deg); /* IE 9 */ + -ms-transform-origin:top left; /* IE 9 */ + -webkit-transform: rotate(0deg); /* Safari and Chrome */ + -webkit-transform-origin:top left; /* Safari and Chrome */ + moz-transform: rotate(0deg); /* Firefox */ + -moz-transform-origin:top left; /* Firefox */ + -o-transform: rotate(0deg); /* Opera */ + -o-transform-origin:top left; /* Opera */ + position: relative; + left: 5px; + margin-top: -4px; +} + +li{ + margin-top: 5px; + font-size: 1.6em; +} + +.open{ + display: block; + height: 35px; + margin-left: 4px; + margin-right: 4px; + margin-top: 10px; + margin-bottom: 0px; + width: 95%; +} + +.popup{ + background-color: #F5F5F5; + margin-left: 4px; + margin-right: 4px; + margin-top: 0; + padding-top: 0; + width: 95%; + height: 70vh; + overflow-y: scroll; + -webkit-overflow-scrolling: touch; +} + +h2{ + font-size: 1.2em; +} + +h1{ + font-size: 1.4em; + margin-top: 6px; +} + +p{ + margin-left: 12px; + margin-right: 20px; + padding-bottom: 1em; + font-size: 13px; +} + +.footnotes{ + font-size: 12px; +} + +figcaption{ + font-size: 13px; +} + +img{ + width: 90%; +} + +h3{ + transform: scaleX(0.7); + font-size: 1.4em; +} + +.avatar{ + padding-top: 5px; +} + +.answer{ + width: 83vw; + margin-left: 0; + margin-right: 0; + margin-bottom: 25px; + padding: 0; + padding-left: 2vw; + padding-right: 8vw; +} + +.link{ + font-size: 1.2em; + width: 163%; +} + +.instance{ + margin-top: 10px; +} + +#text04 { + padding-top: 1vh; +} +#text05 { + padding-top: 8px; +} + +.description{ + margin-bottom: 50px; +} + +.name{ + display: inline-block; + vertical-align: top; + padding-top: 5px; +} + +footer{ + bottom: 8px; + left: 8px; + text-align: left; + font-size: 1.2em; +} + +} diff --git a/img/special-issue-7.png b/img/special-issue-7.png index 1ad0dd5..6be0e04 100644 Binary files a/img/special-issue-7.png and b/img/special-issue-7.png differ