alicestrt/vvvw
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

styled colophon, bio

Browse Source
This commit is contained in:
alicestrt 2021-03-01 14:13:28 +01:00
parent db9fec0ccd
commit ee2d8a54e8
2 changed files with 56 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
index.html
View File

@ -91,39 +91,54 @@ Through the map, we give shape to a common context in Turkish culture. The map a
</div> </div>
</div><br> </div><br>
<div id="showcolophon" class="draggable"><span onclick="this.parentElement.style.display='none'" class="topleft">&times</span><div><h2>colophon</h2> <div id="showcolophon" class="draggable"><span onclick="this.parentElement.style.display='none'" class="topleft">&times</span><div><h3>Colophon</h3>
Wells of Knowledge: Poetry, music and resistance in Turkey © 2020<br> <p>Wells of Knowledge: Poetry, Music and Rresistance in Turkey<br>
at.wdka.nl/wellsofknowledge<br> © 2020 at.wdka.nl/wellsofknowledge</p>
Developed by Hybrid Publishing,<br> <p>Developed by Hybrid Publishing,<br>
Willem de Kooning Academy<br> Willem de Kooning Academy</p>
Text and images © Merve Kılıçer<br> <p>Text and images © Merve Kılıçer<br>
All rights reserved<br> All rights reserved</p>
ISBN: XXXX<br> <p>ISBN: 9789492479112</p>
Author: Merve Kılıçer<br> <p>Author: Merve Kılıçer</p>
Graphic Design &amp; Web Development: Angeliki Diakrousi and Alice Strete<br> <p>
Editor: Liz Allan<br> Graphic Design & Web Development: Angeliki Diakrousi
Coordination: Kimmy Spreeuwenberg<br> (https://w­i­t­m.net/) and Alice Strete (https://alicestrete.me/)</p>
[@Merve - ADD THANK YOU MESSAGE HERE]<br> <p>Editor: Liz Allan</p>
Hybrid Publishing<br> <p>Coordination: Kimmy Spreeuwenberg</p>
This publication was developed by Hybrid Publishing, founded by the Willem de Kooning <p>Printer: De Raddraaier, Amsterdam<br>
Academy as a means of profiling and disseminating outstanding research conducted by its Paper: Old Mill/Bianco 100g<br>
students and teaching staff, whether independently or in collaboration with external Print Run: 300</p>
partners. Researching and experimenting across a broad range of processes native to digital <p>
and analog media, WdKA Hybrid Publishing fosters novel approaches to design, authoring, Thanks for the generous support of Nihan Somay, Jake Caleb,
reading and dissemination made possible through ongoing developments from the legacies Ulufer Çelik and Carmen José</p>
of Gutenberg’s press to present-day technologies. (hybridpublishing.wdka.nl)<br> <p>Hybrid Publishing<br>
HP Research Awards<br> This publication was developed by Hybrid Publishing, founded by
The HP Research Awards series showcases the work of recipients or nominees of the Willem the Willem de Kooning Academy as a means of profiling and
de Kooning Research Award. Established by the Willem de Kooning Foundation, the awards disseminating outstanding research conducted by its students and
are granted to outstanding students whose graduation projects and research have helped teaching staff, whether independently or in collaboration with
provide new insights to broader audiences. For a digital version of this and other external partners. Researching and experimenting across a broad
publications, go to at.wdka.nl/hpresearchawards</div> range of processes native to digital and analog media, WdKA
Hybrid Publishing fosters novel approaches to design, authoring,
reading and dissemination made possible through ongoing
developments from the legacies of Gutenberg’s press to present­day
technologies. (hybridpublishing.wdka.nl) </p>
<p>HP Research Awards<br>
The HP Research Awards series showcases the work of recipients
or nominees of the Willem de Kooning Research Award.
Established by the Willem de Kooning Foundation, the awards are
granted to outstanding students whose graduation projects and
research have helped provide new insights to broader audiences. For
a digital version of this and other publications, go to
at.wdka.nl/hpresearchawards</p>
<img class="logo" src="static/images/HP_Logo.png"></img>
<img class="logo" src="static/images/wdka_logo.png"></img>
<img class="logo" src="static/images/pzi_logo.png"></img></div>
</div> </div>
<div id="showhow" class="draggable"><span onclick="this.parentElement.style.display='none'" class="topleft">&times</span><div><h2>How to use</h2><p> <div id="showhow" class="draggable"><span onclick="this.parentElement.style.display='none'" class="topleft">&times</span><div><h3>How to use</h3><p>
The map shows connections between various representatives in Turkish culture, be it poets, authors or musicians, traditional or contemporary. Each name is presented in relation to a song, a poem, an image, or a fragment of text or audio.<br> The map shows connections between various representatives in Turkish culture, be it poets, authors or musicians, traditional or contemporary.</p> <p>Each name is presented in relation to a song, a poem, an image, or a fragment of text or audio.</p>
When double clicking, a name is isolated and displayed alongside its closest connections. <br> <p>When clickling once on one of the names, various kinds of media appear in connection to that name. The colors represent different categories (Folklore literature, Islamic Mysticism, etc).</p>
When clickling once on one of the names, various kinds of media appear in connection to that name. The colors represent different categories (Folklore literature, Islamic Mysticism, etc).<br> All the elements of the map can be rearranged and moved. </p></div> <p> When double clicking, a name is isolated and displayed alongside its closest connections. </p><p>All the elements of the map can be rearranged and moved. </p></div>
</div> </div>
<script src="static/js/d3_map.js"></script> <script src="static/js/d3_map.js"></script>

10
static/css/style.css
View File

@ -374,6 +374,9 @@ h2 {
max-width: 700px; max-width: 700px;
scrollbar-color: #d87fa0 #dbf6f9; scrollbar-color: #d87fa0 #dbf6f9;
opacity: 0.4; opacity: 0.4;
font-family: 'Vesper Libre', serif;
font-size: 16px;
} }
@ -450,6 +453,9 @@ color: #d81159;
border: 1px solid black; border: 1px solid black;
padding: 2%; padding: 2%;
z-index: 5; z-index: 5;
font-family: 'Vesper Libre', serif;
font-size: 16px;
} }
#showcolophon { #showcolophon {
@ -505,6 +511,10 @@ color: #d81159;
} }
} }
.logo {
width: 60px;
display: inline-block;
}
@media (max-width: 550px) { @media (max-width: 550px) {
.map_legend p { .map_legend p {