camilo
/
Permeable-Glossary
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

pagedjs folder

Browse Source
master
Camilo G 2 years ago
parent 9075297745
commit 7a696cc75c
5 changed files with 33126 additions and 5 deletions
Show Stats Download Patch File Download Diff File

BIN
.DS_Store vendored
View File

Binary file not shown.

9
index.html
Unescape Escape View File

@ -4,10 +4,11 @@
<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">
<!-- <script src="pagedjs/polyfill.js"></script>
<link href="pagedjs/interface.css" rel="stylesheet" type="text/css"> -->
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<title>Glossary</title> <title>Living Glossary</title>
</head> </head>
<!-- <style> .action-s:hover{color:green;}.situation-s:hover{color:aqua;}.logic-s:hover{color:orange;}.proposition-s:hover{color:blue;}.hyperlink-s:hover{color:pink;}.process-s:hover{color:gray;}.language-s:hover{color:violet;}.agent-s:hover{color:purple;}.tool-s:hover{color:lightblue;}.form-s:hover{color:gold;} </style> -->
<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>
@ -23,9 +24,7 @@
<p>The current state of the glossary was made during different workshop sessions were practitioners are invited to question, reflect and diffract on the current publishing practice. Based on the previous state of the glossary, this sessions are called Rumination Sessions as a performance of multiple digestion. The participants added new entries, annotated on previous ones, highlighted snippets of it, bring up questions. The process aims to re-think and create collectively every word definition as a layering of annotations. Unlike traditional glossaries, in this glossary words are open to interpretation, expansion and mostly transformation. </p> <p>The current state of the glossary was made during different workshop sessions were practitioners are invited to question, reflect and diffract on the current publishing practice. Based on the previous state of the glossary, this sessions are called Rumination Sessions as a performance of multiple digestion. The participants added new entries, annotated on previous ones, highlighted snippets of it, bring up questions. The process aims to re-think and create collectively every word definition as a layering of annotations. Unlike traditional glossaries, in this glossary words are open to interpretation, expansion and mostly transformation. </p>
</div> </div>
<div id="legend" class="legend"></div> <div id="legend" class="legend"></div>
<div id="words" class="words"> <div id="words" class="words"></div>
</div>
</div> </div>
</body> </body>
<script src="main.js"></script> <script src="main.js"></script>

181
pagedjs/interface.css
Unescape Escape View File

@ -0,0 +1,181 @@
/* CSS for Paged.js interface – v0.2 */
/* Change the look */
:root {
--color-background: rgb(48, 48, 48);
--color-pageSheet: #cfcfcf;
--color-pageBox: violet;
--color-paper: white;
--color-marginBox: transparent;
--pagedjs-crop-color: black;
--pagedjs-crop-shadow: white;
--pagedjs-crop-stroke: 1px;
}
/* To define how the book look on the screen: */
@media screen {
body {
background-color: var(--color-background);
}
.pagedjs_pages {
display: flex;
width: calc(var(--pagedjs-width) * 2);
flex: 0;
flex-wrap: wrap;
margin: 0 auto;
}
.pagedjs_page {
background-color: var(--color-paper);
box-shadow: 0 0 0 1px var(--color-pageSheet);
margin: 0;
flex-shrink: 0;
flex-grow: 0;
margin-top: 10mm;
}
.pagedjs_first_page {
margin-left: var(--pagedjs-width);
}
.pagedjs_page:last-of-type {
margin-bottom: 10mm;
}
.pagedjs_pagebox{
box-shadow: 0 0 0 1px var(--color-pageBox);
}
.pagedjs_left_page{
z-index: 20;
width: calc(var(--pagedjs-bleed-left) + var(--pagedjs-pagebox-width))!important;
}
.pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-crop {
border-color: transparent;
}
.pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-middle{
width: 0;
}
.pagedjs_right_page{
z-index: 10;
position: relative;
left: calc(var(--pagedjs-bleed-left)*-1);
}
/* show the margin-box */
.pagedjs_margin-top-left-corner-holder,
.pagedjs_margin-top,
.pagedjs_margin-top-left,
.pagedjs_margin-top-center,
.pagedjs_margin-top-right,
.pagedjs_margin-top-right-corner-holder,
.pagedjs_margin-bottom-left-corner-holder,
.pagedjs_margin-bottom,
.pagedjs_margin-bottom-left,
.pagedjs_margin-bottom-center,
.pagedjs_margin-bottom-right,
.pagedjs_margin-bottom-right-corner-holder,
.pagedjs_margin-right,
.pagedjs_margin-right-top,
.pagedjs_margin-right-middle,
.pagedjs_margin-right-bottom,
.pagedjs_margin-left,
.pagedjs_margin-left-top,
.pagedjs_margin-left-middle,
.pagedjs_margin-left-bottom {
box-shadow: 0 0 0 1px inset var(--color-marginBox);
}
/* uncomment this part for recto/verso book : ------------------------------------ */
/*
.pagedjs_pages {
flex-direction: column;
width: 100%;
}
.pagedjs_first_page {
margin-left: 0;
}
.pagedjs_page {
margin: 0 auto;
margin-top: 10mm;
}
.pagedjs_left_page{
width: calc(var(--pagedjs-bleed-left) + var(--pagedjs-pagebox-width) + var(--pagedjs-bleed-left))!important;
}
.pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-crop{
border-color: var(--pagedjs-crop-color);
}
.pagedjs_left_page .pagedjs_bleed-right .pagedjs_marks-middle{
width: var(--pagedjs-cross-size)!important;
}
.pagedjs_right_page{
left: 0;
}
*/
/*--------------------------------------------------------------------------------------*/
/* uncomment this par to see the baseline : -------------------------------------------*/
/* .pagedjs_pagebox {
--pagedjs-baseline: 22px;
--pagedjs-baseline-position: 5px;
--pagedjs-baseline-color: cyan;
background: linear-gradient(transparent 0%, transparent calc(var(--pagedjs-baseline) - 1px), var(--pagedjs-baseline-color) calc(var(--pagedjs-baseline) - 1px), var(--pagedjs-baseline-color) var(--pagedjs-baseline)), transparent;
background-size: 100% var(--pagedjs-baseline);
background-repeat: repeat-y;
background-position-y: var(--pagedjs-baseline-position);
} */
/*--------------------------------------------------------------------------------------*/
}
/* Marks (to delete when merge in paged.js) */
.pagedjs_marks-crop{
z-index: 999999999999;
}
.pagedjs_bleed-top .pagedjs_marks-crop,
.pagedjs_bleed-bottom .pagedjs_marks-crop{
box-shadow: 1px 0px 0px 0px var(--pagedjs-crop-shadow);
}
.pagedjs_bleed-top .pagedjs_marks-crop:last-child,
.pagedjs_bleed-bottom .pagedjs_marks-crop:last-child{
box-shadow: -1px 0px 0px 0px var(--pagedjs-crop-shadow);
}
.pagedjs_bleed-left .pagedjs_marks-crop,
.pagedjs_bleed-right .pagedjs_marks-crop{
box-shadow: 0px 1px 0px 0px var(--pagedjs-crop-shadow);
}
.pagedjs_bleed-left .pagedjs_marks-crop:last-child,
.pagedjs_bleed-right .pagedjs_marks-crop:last-child{
box-shadow: 0px -1px 0px 0px var(--pagedjs-crop-shadow);
}

32782
pagedjs/polyfill.js
View File

File diff suppressed because it is too large Load Diff

159
style-print.css
Unescape Escape View File

@ -0,0 +1,159 @@
:root {
--color_uno: black;
--color_dos: black;
--color_tres: black;
}
@page {
size: 14.5cm 10.5cm;
margin-top:0.5cm;
margin-bottom:0.5cm;
margin-right: 0.5cm;
margin-left: 0.5cm;
@right-middle{
content: "Permeable Territories";
font-family: monospace;
font-size: 7pt;
margin-top: 6cm;
margin-right: 2mm;
writing-mode: vertical-rl;
text-orientation: mixed;
}
}
@page cards {
@left-top {
content: "Glossary Cards";
font-family: monospace;
font-size: 7pt;
margin-top: 1cm;
margin-left: 4mm;
writing-mode: vertical-rl;
text-orientation: mixed;
}
}
@page intro {
@left-middle {
content: "Description";
font-size: 7pt;
font-family: monospace;
margin-top: 1cm;
margin-left: 4mm;
writing-mode: vertical-rl;
text-orientation: mixed;
}
}
.head{
page: intro;
}
.head a{
display: none;
}
.description{
page: intro;
}
.question{
page: intro;
display: none;
}
.legend{
page: intro;
display:flex;
flex-direction: column wrap;
flex-flow: column wrap;
margin-left: 15pt;
margin-right: 15pt;
margin-top: 10pt;
margin-bottom: 10pt;
}
.words {
page: cards;
margin: 0;
}
.word {
break-before: page;
margin: 0;
margin-bottom: 0.3cm;
padding-right: 1cm;
/* width: 13cm;
height: 9.2cm; */
}
.title {
margin-top: 0.5cm;
}
h1 {
font-family: monospace;
font-size: 20pt;
margin: 0%;
}
hr {
display: none;
}
p{
margin-top: 5pt;
text-indent: 2em;
font-family: monospace;
font-size: 10pt;
margin-left: 0.5cm;
line-height: 11pt;
color: black;
}
strong {
font-weight: normal;
text-decoration: underline;
text-decoration-style: wavy;
}
a {
color: black;
font-size: 10pt;
}
.btn {
font-size: 12pt;
display: flex;
border: none;
color: black;
padding-top: 2pt;
padding-right: 8pt;
padding-left: 8pt;
padding-bottom: 2pt;
justify-content: flex-start;
}
.btn:hover {
box-shadow: none;
}
.btn.active {
border: 1pt solid black;
box-shadow: none;
}
.symbol {
position:relative;
order:1;
margin-top: 15pt;
margin-left: 2pt;
margin-right: 2pt;
font-family: Sans-Serif;
}
Write Preview
Loading…
Cancel
Save