From 02b3b00e94a811514fc29e214e86ab34724063aa Mon Sep 17 00:00:00 2001 From: Tancre Date: Thu, 9 Sep 2021 15:06:50 +0200 Subject: [PATCH] changess various --- open/index.html | 28 ++++++++++++-- open/scripts/Windows.js | 20 +++++----- open/styles/style.css | 85 +++++++++++++++++++++++++++++++++-------- 3 files changed, 104 insertions(+), 29 deletions(-) diff --git a/open/index.html b/open/index.html index 9ac255e..e512844 100644 --- a/open/index.html +++ b/open/index.html @@ -44,14 +44,34 @@ -
+
-
+

windows.open(Welcome)

-

Architecture: Tancredi and Poni

-

Urbanistic: Clara, Louisa, Simon

+

Web Architects:
Tancre and Poni

+

Urban Planners:
Clara, Louisa, Simon

+ +

Contributions:

+
+

HAM DISTRO ⟶ XPUB3

+

OUIJA SEANCE ⟶ Simon Brown

+

Blank Page Syndrome ⟶ Clara Noseda

+

Lingo Bingo ⟶ XPUB1

+

Civil Entertainment Sirens® ⟶ Martin Foucaut

+

Oh, look at the wifi: words fly around ⟶ Federico Poni

+

Ilinx ⟶ Tancredi Di Giovanni

+
+ +

Bookshop:

+
+

Wor(l)ds for the Future // published and distributed by XPUB1

+

iper- ozio % versi // Federico Poni, Enrico Taro'

+

Low-Tech Chronicles #1 // Mark van den Heuvel

+

Writing Cure // Avital Barkai, Camilo Garcia A.

+
+

diff --git a/open/scripts/Windows.js b/open/scripts/Windows.js index f95c8f9..d375cb4 100644 --- a/open/scripts/Windows.js +++ b/open/scripts/Windows.js @@ -1,22 +1,22 @@ const corpi = { 0: { + id:'greetings', + glyph: '📌', + title: 'let Greetings', + content: 'We are pleased to invite you to window.open(), a day-long festival, held by students and alumni of the Master of Experimental Publishing (XPUB) at Page Not Found.' + }, + 1: { id:'xpub', glyph: '🖨️', - title: 'var xpub', - content: 'window.open() at PNF will be an interface for our XPUB program to speak/communicate to/with the public inside and outside of the physical space. We adjust, using windows in the street and in the browser in order to be able to communicate. This frames it as a "discursive/dialogical interface" through which attitudes, perspectives, backgrounds and situations are explored together in a program consisting of: presentations, workshops, publication launches, conversations and performances; both online and offline.' + title: 'var Xpub', + content: 'window.open() at PNF will be an interface for our XPUB program to speak/communicate to/with the public inside and outside of the physical space. We adjust, using windows in the street and in the browser in order to be able to communicate. This frames it as a "discursive/dialogical interface" through which attitudes, perspectives, backgrounds and situations are explored together in a program consisting of: presentations, workshops, publication launches, conversations and performances; both online and offline.' }, - 1: { + 2: { id:'interface', glyph: '📀', - title: 'const interface', + title: 'const Interface', content: 'A window is a framing device, an interface through which we can look inside, to spaces where small groups meet, and outside to the world beyond. Screens and windows delineate boundaries between public and private. Working with(in) a limitation, a frame(work), a situation, a context means adjusting our work to the state of affairs; it changes our way of thinking/framing it. We adjust, in order to be able to communicate within a temporary window of time, reframing our intentions and seeking opportunities to share some real-time realness.' }, - 2: { - id:'greetings', - glyph: '📌', - title: 'let greetings', - content: 'We are pleased to invite you to window.open(), a day-long festival, held by students and alumni of the Master of Experimental Publishing (XPUB) at Page Not Found.' - }, 3: { id: 'collectiveioning', glyph: '👾', diff --git a/open/styles/style.css b/open/styles/style.css index 9b5d75b..f884c26 100644 --- a/open/styles/style.css +++ b/open/styles/style.css @@ -7,7 +7,7 @@ body { max-width: 100vw; background-color: blue; color: white; - font-family: Arial, Helvetica, sans-serif; + font-family: "Courier New", Courier, monospace; padding: 0; margin: 0; } @@ -26,7 +26,6 @@ h1 { .draggable { display: none; position: absolute; - border: 2px white solid; background: black; -webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0, 0, 0, 0.49); @@ -60,21 +59,17 @@ h1 { .closable { position: absolute; - top: 0; - right: 0; + top: 6px; + right: -2px; cursor: pointer; width: 38px; + color: yellow; + border: none; + font-size: 18px; } -/* -.closable button { - width: 35px; - height: 30px; -} */ - .hover { font-weight: bolder; - color: white !important; } .icon:hover { @@ -101,7 +96,6 @@ h1 { color: black; border: solid 2px blue; display: none; - padding: 1% 5%; } #colophon h1 { @@ -129,6 +123,8 @@ h1 { .corpi { padding: 15px; min-width: 200px; + border-radius: 6px; + border: 2px yellow solid; } #program { @@ -155,6 +151,18 @@ h1 { background-color: rgba(0, 0, 0, 0.1); } +.iconContainer a { + color: blanchedalmond; +} + +.iconContainer a:hover { + color: blanchedalmond; +} + +.iconContainer a:visited { + color: blanchedalmond; +} + .iconContainer a p { margin: 0; padding: 0; @@ -183,9 +191,10 @@ button { .textIcon { margin-top: -20px; + font-weight: medium; } -/* FOOTER */ +/* FOOTER & COLOPHON*/ .bottoneCose { user-select: none; display: inline-block; @@ -197,12 +206,33 @@ button { background-color: rgba(0, 0, 0, 0); } +.colophonWrapper { + margin-left: 20px; +} + +#colophon { + padding: 40px; +} + +#lastColophonWrapper { + margin-bottom: 0px; +} + +/* GENERAL MODIFIERS */ + +.onlyMobile { + display: none; +} + /* MEDIA QUERIES */ /* On screens that are 992px or less, set the background color to blue */ @media screen and (max-width: 700px) { + .onlyMobile { + display: inline; + } + body { - background-color: red; font-size: 16px; } @@ -223,10 +253,11 @@ button { right: unset !important; left: unset !important; border: unset !important; - display: block !important; + display: inline-block !important; position: unset !important; margin-bottom: 40px; cursor: unset !important; + border-radius: unset !important; } .closable { @@ -257,4 +288,28 @@ button { .bottoneCose { width: unset; } + + #colophon { + display: inline-block; + background-color: white; + width: -moz-available; + position: fixed; + top: 0; + text-align: center; + height: 100vh; + overflow-y: auto; + padding: 10px; + } + + #colophon h1 { + font-size: 28px; + } + + .colophonWrapper { + margin-left: 0px; + } + + #lastColophonWrapper { + margin-bottom: 100px; + } }