master
Camilo G 2 years ago
parent 872410de6c
commit ac61aadd55

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.9 KiB

@ -3,26 +3,28 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css" type="text/css">
<!-- <script src="pagedjs/polyfill.js"></script> <link rel="shortcut icon" href="aniflowe.gif" type="image/x-icon">
<link href="pagedjs/interface.css" rel="stylesheet" type="text/css"> -->
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<title>Living Glossary</title> <title>Living Glossary</title>
</head> </head>
<body id="glo_body"> <body id="glo_body">
<div class="head"> <div class="head">
<h1 id="title"> Living Glossary for a Diffractive Publishing Practice </h1> <h1 id="title"> Living Glossary for a Diffractive Publishing Practice </h1>
<p>Colophon</p> <!-- <button class="btn" id="btn-web">Web</button> -->
<button class="btn" id="btn-print">Print</button>
<a href="rss.xml"> <a href="rss.xml">
(rss)</p> (rss)</p>
</a> </a>
</div> </div>
<div class="description"> <div class="description">
<div id="intro"> <div id="intro">
<p>From creating, designing and conceptualising to filtering, circulating and amplifying, publishing practices involve different processes and matters. Even though there are multiple theories and authors that approach each of them in a particular way, we propose to make a pause on defining them individually and focus on possible entanglements. Not to find a generalized idea of publishing but to see it as a complex and living materiality.</p> <p>Publishing practices involve different processes, from creating, designing, and conceptualizing to filtering, circulating, and amplifying. Even though some multiple theories and authors approach each of them in a compartmentalized way, we propose to pause on defining them individually and allow space for possible connections and entanglements. Not to find a generalized idea of publishing but to see it as complex and living materiality.</p>
<p>This glossary is an ongoing and ever-transforming attempt to introduce a diffractive methodology inside publishing practices at large, from the understanding of publishing as the act of making public. It is organized as a bag of words that gathers different annotations on words instead of closed definitions. Words are tools, concepts, resources, shapes that have properties that enhance new possibilities. Words in this glossary don't close the publishing scenario to a territorial one in arts, design or so. They are porous and permeable to other spheres of action.</p>
<p>Because the glossary is seen as mutable, the current state is a result of collective workshops were participants are invited to think and converse around its words and annotations. During the workshop, diffraction performs a conscious interconnection of practices beyond reflection.</p> <p>This glossary is an ongoing and ever-changing attempt to introduce a diffractive methodology inside publishing practices, understanding publishing as the act of making public. It is organized as a container of words that are never fully defined, only annotated. Words become tools, concepts, resources, and shapes with properties that enhance new possibilities. In this glossary, they don't close the publishing scenario to territory arts or design. Instead, they are porous and permeable to other spheres of action.</p>
<p>If you want to contribute adding new words, annotations or properties, please check the source pad and read the instructions.</p>
<p>The glossary is seen as mutable, and the current state results from collective workshops where participants are invited to think and converse around its words and annotations. During the workshop, diffraction performs a conscious interconnection of practices beyond reflection.</p>
<p>Please check the source <a href="https://hub.xpub.nl/soupboat/pad/p/camilo_glossary">pad</a> and read the instructions if you want to contribute by adding new words, annotations, or properties.</p>
</div> </div>
<div id="panel"> <div id="panel">
<div class="question"> <div class="question">

@ -54,7 +54,7 @@ fetch("glossary.json").then(response => response.json()).then(data => glossary =
} }
document.getElementById("words").innerHTML = `${words_bag.map(wordBag).join("")}` document.getElementById("words").innerHTML = `${words_bag.map(wordBag).join("")}`
document.getElementById("legend").innerHTML = `<button type="button" class="btn active" onclick="filterSelection('all');activeclass();"> Common Ground </button> ${properties_bag.map(propBag).join("")}` document.getElementById("legend").innerHTML = `<button type="button" class="btn active" onclick="filterSelection('all');activeclass();"> Properties </button> ${properties_bag.map(propBag).join("")}`
}); ///// END OF FETCH!!!!!! }); ///// END OF FETCH!!!!!!
@ -150,4 +150,27 @@ function showsymbol(btn){
} }
//////// Print button //////
const pagedjs = document.createElement("script");
pagedjs.src = "https://unpkg.com/pagedjs/dist/paged.polyfill.js";
pagedjs.id = "printview";
const printstyle = document.createElement("link");
printstyle.href = "style-print.css";
printstyle.rel = "stylesheet";
printstyle.id = "printstyle";
const interfacestyle = document.createElement("link");
interfacestyle.href = "pagedjs/interface.css";
interfacestyle.rel = "stylesheet";
interfacestyle.id = "interfacestyle";
const printCards = document.getElementById("btn-print");
printCards.addEventListener("click", () => {
document.getElementsByTagName("head")[0].appendChild(pagedjs);
document.getElementsByTagName("head")[0].appendChild(interfacestyle);
document.getElementsByTagName("head")[0].appendChild(printstyle);
});

@ -2,7 +2,7 @@
/* Change the look */ /* Change the look */
:root { :root {
--color-background: rgb(48, 48, 48); --color-background: rgb(70, 119, 255);
--color-pageSheet: #cfcfcf; --color-pageSheet: #cfcfcf;
--color-pageBox: violet; --color-pageBox: violet;
--color-paper: white; --color-paper: white;

@ -14,7 +14,7 @@
@right-middle{ @right-middle{
content: "Permeable Territories"; content: "Permeable Territories";
font-family: monospace; font-family: mono;
font-size: 7pt; font-size: 7pt;
margin-top: 6cm; margin-top: 6cm;
margin-right: 2mm; margin-right: 2mm;
@ -29,13 +29,24 @@
@left-top { @left-top {
content: "Glossary Cards"; content: "Glossary Cards";
font-family: monospace; font-family: mono;
font-size: 7pt; font-size: 7pt;
margin-top: 1cm; margin-top: 1cm;
margin-left: 4mm; margin-left: 4mm;
writing-mode: vertical-rl; writing-mode: vertical-rl;
text-orientation: mixed; text-orientation: mixed;
} }
@left-bottom {
content: "State #2";
font-family: mono;
font-size: 7pt;
margin-top: 1cm;
margin-left: 4mm;
writing-mode: vertical-rl;
text-orientation: mixed;
}
} }
@page intro { @page intro {
@ -43,7 +54,7 @@
@left-middle { @left-middle {
content: "Description"; content: "Description";
font-size: 7pt; font-size: 7pt;
font-family: monospace; font-family: mono;
margin-top: 1cm; margin-top: 1cm;
margin-left: 4mm; margin-left: 4mm;
writing-mode: vertical-rl; writing-mode: vertical-rl;
@ -52,30 +63,69 @@
} }
.head{ .head{
column-count: 2;
page: intro; page: intro;
} }
.head h1{
margin: 0;
line-height: 21pt;
margin-bottom: 1cm;
}
button {
display: none;
}
.head a{ .head a{
display: none; display: none;
} }
.description{ .description{
margin-top: 2mm;
display: block;
height: 10cm;
page: intro; page: intro;
} }
.intro{
margin-top: 0;
}
#title {
margin-bottom: 1cm !important;
}
#intro{
width: 100%;
padding: 0;
margin: 0;
}
.description p{
font-size: 8pt;
line-height: 9pt;
padding: 0;
margin: 0;
margin-left: 0.5cm;
margin-bottom: 2mm;
padding-right: 2cm;
}
.question{ .question{
page: intro; page: intro;
display: none; display: none;
} }
.legend{ .legend{
break-before: always;
page: intro; page: intro;
display:flex; display:flex;
flex-direction: column wrap; flex-direction: column wrap;
flex-flow: column wrap; flex-flow: column wrap;
margin-left: 15pt; margin-left: 15pt;
margin-right: 15pt; margin-right: 15pt;
margin-top: 10pt; margin-top: -4smm;
margin-bottom: 10pt; margin-bottom: 10pt;
} }
@ -83,6 +133,10 @@
page: cards; page: cards;
margin: 0; margin: 0;
} }
.leg_titles{
font-size: 12pt;
color: black !important;
}
.word { .word {
break-before: page; break-before: page;
@ -97,8 +151,15 @@
margin-top: 0.5cm; margin-top: 0.5cm;
} }
.btn{
margin: 0;
}
#words{
display:block;
}
h1 { h1 {
font-family: monospace;
font-size: 20pt; font-size: 20pt;
margin: 0%; margin: 0%;
} }
@ -110,7 +171,6 @@ hr {
p{ p{
margin-top: 5pt; margin-top: 5pt;
text-indent: 2em; text-indent: 2em;
font-family: monospace;
font-size: 10pt; font-size: 10pt;
margin-left: 0.5cm; margin-left: 0.5cm;
line-height: 11pt; line-height: 11pt;
@ -157,3 +217,43 @@ a {
margin-right: 2pt; margin-right: 2pt;
font-family: Sans-Serif; font-family: Sans-Serif;
} }
.word {
padding-top: 0;
padding-bottom: 0.5cm;
padding-left: 0;
padding-right: 0.5cm;
}
.action{
content: "action";
box-shadow: none;
}
.situation{
border-top: none;
}
.logic{
border-bottom: none;
}
.proposition {
border-left: none;
}
.hyperlink {
border-radius: none;
}
.form {
border-right: none;
}
.tool {
box-shadow: none;
}
.language {
text-shadow: none;
}
Loading…
Cancel
Save