-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
215 lines (167 loc) · 11.1 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
<!DOCTYPE html>
<html lang="fr-FR">
<head>
<meta name="generator" content="Hugo 0.72.0" />
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Accueil | Reticulum</title>
<link rel="stylesheet" href="/css/style.css" />
<link rel="shortcut icon" href="img/reticulum.ico">
</head>
<body>
<div class="homepage">
<div class="col-lg-10 d-flex flex-column justify-content-center align-items-center">
<h1 id="site-title">Reticulum</h1>
<h2 class="revue-title" >Interroger le réseau par le réseau</h2>
</div>
<span id="scrolltorevue" style="cursor: pointer;">En savoir plus <br>
<div class="d-flex justify-content-center mt-2">
<svg class="arrow" width="43" height="26" viewBox="0 0 43 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.0525 0L21.5 16.0702L37.9475 0L43 4.94737L21.5 26L0 4.94737L5.0525 0Z" />
</svg>
</div>
<script>
const btn = document.getElementById('scrolltorevue');
btn.addEventListener('click', () => window.scrollTo({
top: window.innerHeight,
behavior: 'smooth'
}));
</script>
</div>
<div id="revue">
<div class="container-fluid d-flex flex-wrap">
<div class="col-4 pt-5" style="background-color:#DAE2EA">
<nav class="navHome">
<ul class="menu">
<li><a href="/">Accueil</a></li>
<li><a href="/editorial/">Version en ligne</a></li>
<li><a href="/imprimer/">Version imprimable</a></li>
<li><a href="/credits/">Crédits</a></li>
</ul>
<label for="search">Accès rapide au contenu additionnel :</label>
<div class="d-flex mb-3">
<input id="search" type="text" placeholder="Entrer le code" value="" />
<input id="btn-search" type="button" value="OK" />
</div>
</nav>
<section class="button-list">
</section>
<aside>
<div class="open-aside" id="open">
<p>a11y</p>
</div>
<div class="expand-aside" id="expand">
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 40 40" id="blackmode">
<g transform="translate(-41 -14)">
<path id="Tracé_3" data-name="Tracé 3" d="M75.147,39.853,81,34l-5.853-5.853V19.853H66.853L61,14l-5.853,5.853H46.853v8.294L41,34l5.853,5.853v8.294h8.294L61,54l5.853-5.853h8.294ZM61,44.61V23.39a10.61,10.61,0,0,1,0,21.22Z" fill="#101010"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 30 40" id="normal">
<g id="icones-nuit" transform="translate(-24 -29)">
<path id="Tracé_3" data-name="Tracé 3" d="M34,29a19.947,19.947,0,0,0-10,2.7,19.965,19.965,0,0,1,0,34.6A19.992,19.992,0,1,0,34,29Z" fill="#101010"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="23.254" viewBox="0 0 40 23.254" id="reduce">
<g id="icones-moins" transform="translate(-32 -52)">
<path id="Tracé_3" data-name="Tracé 3" d="M63,52h9v1.5H63Z" fill="#101010"/>
<path id="Tracé_4" data-name="Tracé 4" d="M45.7,75l-1.346-4.418H37.586L36.24,75H32l6.551-18.637h4.812L49.938,75Zm-2.285-7.719q-1.866-6-2.107-6.792t-.33-1.244q-.419,1.625-2.4,8.036ZM61,75l-.749-1.93h-.1a5.766,5.766,0,0,1-2.019,1.714,6.536,6.536,0,0,1-2.691.47,4.384,4.384,0,0,1-3.225-1.168,4.5,4.5,0,0,1-1.168-3.326,3.734,3.734,0,0,1,1.574-3.326,9.15,9.15,0,0,1,4.773-1.193l2.463-.076v-.622a1.93,1.93,0,0,0-2.209-2.158,10.067,10.067,0,0,0-4,1.028L52.363,61.8A11.539,11.539,0,0,1,57.8,60.515a6.769,6.769,0,0,1,4.38,1.244A4.6,4.6,0,0,1,63.7,65.542V75Zm-1.143-6.576-1.5.051a4.8,4.8,0,0,0-2.514.609,1.914,1.914,0,0,0-.825,1.7q0,1.638,1.879,1.638a2.953,2.953,0,0,0,2.146-.774,2.709,2.709,0,0,0,.813-2.057Z"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" width="40.087" height="28.613" viewBox="0 0 40.087 28.613" id="grow">
<g id="icones-plus" transform="translate(-40 -38.641)">
<path id="Tracé_3" data-name="Tracé 3" d="M53.7,67l-1.346-4.418H45.586L44.24,67H40l6.551-18.637h4.812L57.938,67Zm-2.285-7.719q-1.866-6-2.107-6.792t-.33-1.244q-.419,1.625-2.4,8.036ZM69,67l-.749-1.93h-.1a5.766,5.766,0,0,1-2.019,1.714,6.536,6.536,0,0,1-2.691.47,4.384,4.384,0,0,1-3.225-1.168,4.5,4.5,0,0,1-1.168-3.326,3.734,3.734,0,0,1,1.574-3.326,9.15,9.15,0,0,1,4.773-1.193l2.463-.076v-.622a1.93,1.93,0,0,0-2.209-2.158,10.067,10.067,0,0,0-4,1.028L60.363,53.8A11.539,11.539,0,0,1,65.8,52.515a6.769,6.769,0,0,1,4.38,1.244A4.6,4.6,0,0,1,71.7,57.542V67Zm-1.143-6.576-1.5.051a4.8,4.8,0,0,0-2.514.609,1.914,1.914,0,0,0-.825,1.7q0,1.638,1.879,1.638a2.953,2.953,0,0,0,2.146-.774,2.709,2.709,0,0,0,.813-2.057Z"/>
<path id="Tracé_4" data-name="Tracé 4" d="M80.087,45V43.723H75.005V38.641H73.723v5.082H68.641V45h5.082v5.082h1.282V45Z" fill="#101010"/>
</g>
</svg>
</div>
</aside>
</div>
<div class="pt-5 col-8 d-flex justify-content-center align-items-start ">
<div class="d-flex flex-column justify-items-center justify-content-center col-lg-10 col-md-10">
<p>Bonjour et bienvenue dans cette revue qui interroge les potentialités du réseau à partir du réseau. En tant qu’étudiants du master Design (DIIS) et du master Humanités digitales (DNHD) de l’Université Bordeaux Montaigne, nous avons exploré le rôle déterminant des pratiques réticulaires dans nos disciplines grâce à la conception de cette revue expérimentale. Sa structure s’articule autour de la notion de réseau, qui a guidé notre travail de réflexion et d’exploration des outils numériques débouchant sur ce prototype. Dans un contexte inédit de crise sanitaire, nous avons dû développer nos capacités de communication et de production à distance en tirant le meilleur parti possible du réseau. Sur ce sujet, n’hésitez pas à lire notre article intitulé « Travailler en réseau en temps Covid » en fin de revue.</p>
<p>Ce « numéro zéro » a été développé en une semaine (<em>book sprint</em>) après un travail préparatoire de plusieurs mois (veille, spécification, rédaction). Il est défini par son caractère hybride, puisqu’il se décline en version numérique et imprimable à partir d’une seule source – une collection de textes (au format Markdown) versionnés (sur GitHub). Des contenus additionnels en ligne sont accessibles grâce aux codes présents dans la revue papier.</p>
<p>En espérant que cette chaîne éditoriale hybride et le contenu qui en résulte sauront susciter votre intérêt, nous vous souhaitons une bonne lecture.</p>
<br />
<div class="d-flex flex-wrap justify-content-center">
<a href="editorial" style="text-decoration: none;">
<div style="background-color: #B5C5D5; border-radius: 15px;" class=" btn p-3 m-5 d-flex justify-content-around align-items-center buttonhomepage">
<svg width="46" height="40" viewBox="0 0 46 40" fill="none" xmlns="http://www.w3.org/2000/svg" class="m-2">
<path d="M28.5714 34.2857H0V40H28.5714V34.2857ZM45.7143 11.4286H0V17.1429H45.7143V11.4286ZM0 28.5714H45.7143V22.8571H0V28.5714ZM0 0V5.71429H45.7143V0H0Z" fill="#404040"/>
</svg>
<span class="m-2" style="font-family: Lato; font-size: 25px;">Accédez à la version <br>en ligne (HTML)</span>
</div>
</a>
<a href="imprimer" style="text-decoration: none;">
<div style="background-color: #B5C5D5; border-radius: 15px;" class="p-3 btn m-5 d-flex justify-content-around align-items-center buttonhomepage">
<svg width="52" height="40" viewBox="0 0 52 40" fill="none" xmlns="http://www.w3.org/2000/svg" class="m-2">
<path d="M47.0588 1.17647C44.4471 0.352941 41.5765 0 38.8235 0C34.2353 0 29.2941 0.941176 25.8824 3.52941C22.4706 0.941176 17.5294 0 12.9412 0C8.35294 0 3.41176 0.941176 0 3.52941V38C0 38.5882 0.588235 39.1765 1.17647 39.1765C1.41176 39.1765 1.52941 39.0588 1.76471 39.0588C4.94118 37.5294 9.52941 36.4706 12.9412 36.4706C17.5294 36.4706 22.4706 37.4118 25.8824 40C29.0588 38 34.8235 36.4706 38.8235 36.4706C42.7059 36.4706 46.7059 37.1765 50 38.9412C50.2353 39.0588 50.3529 39.0588 50.5882 39.0588C51.1765 39.0588 51.7647 38.4706 51.7647 37.8824V3.52941C50.3529 2.47059 48.8235 1.76471 47.0588 1.17647ZM47.0588 32.9412C44.4706 32.1176 41.6471 31.7647 38.8235 31.7647C34.8235 31.7647 29.0588 33.2941 25.8824 35.2941V8.23529C29.0588 6.23529 34.8235 4.70588 38.8235 4.70588C41.6471 4.70588 44.4706 5.05882 47.0588 5.88235V32.9412Z" fill="#404040"/>
</svg>
<span class="m-2" style="font-family: Lato; font-size: 25px;">Accédez à la version <br>imprimable (PDF)</span>
</div>
</a>
</div>
</div>
</div>
</div>
<footer>
CC-BY Master DIIS, Master DNHD, Florian Harmand & Arthur Perret 2020 • <a href="mailto:florian.harman@gmail.com,arthur.perret@u-bordeaux-montaigne.fr">Contact</a>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script>
var size=20;
$(document).ready(function() {
$("#normal").hide();
$("#expand").hide();
$(".collapse.show").each(function(){
$(this).prev(".card-header").find(".fa").addClass("fa-sort-up").removeClass("fa-sort-down");
});
$(".collapse").on('show.bs.collapse', function(){
$(this).prev(".card-header").find(".fa").removeClass("fa-sort-down").addClass("fa-sort-up");
}).on('hide.bs.collapse', function(){
$(this).prev(".card-header").find(".fa").removeClass("fa-sort-up").addClass("fa-sort-down");
});
var docHeight = $(document).height(),windowHeight = $(window).height(),scrollPercent;
$(window).scroll(function() {
scrollPercent = $(window).scrollTop() / (docHeight - windowHeight) * 100;
$('.scroll-progress').width(scrollPercent + '%');
});
$(function(){
$("#btn-search").click(function(){
var search = $("#search").val();
search = search.replace(/ /g, "-");
window.location.href = "https:\/\/revue.reticulum.info\/" + search + "";
});
});
$( "#blackmode" ).click(function() {
$('body').css({"background-color":"black","color":"white"});
$('.menu').css({"color":"black"});
$('.arrow').css({"fill":"white"});
$('label').css({"color":"black"});
$("#normal").show();
$("#blackmode").hide();
});
$( "#normal" ).click(function() {
$('body').css({"background-color":"white","color":"black"});
$('.arrow').css({"fill":"black"});
$("#blackmode").show();
$("#normal").hide();
});
$("#grow").click(function() {
$("p").css("font-size", size + 1 + "px");
size++;
});
$("#reduce").click(function() {
$("p").css("font-size", size - 1 + "px");
size--;
});
$('#open').click(function() {
$('#expand').animate({width:'toggle'},250);
});
});
</script>
</div>
</body>
</html>