-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathextraction.html
288 lines (249 loc) · 16 KB
/
extraction.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
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
<!DOCTYPE html>
<html lang="en">
<head>
<title>MACO</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<script src="jquery.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Abril+Fatface" rel="stylesheet">
<link rel="stylesheet" href="css/open-iconic-bootstrap.min.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/owl.theme.default.min.css">
<link rel="stylesheet" href="css/magnific-popup.css">
<link rel="stylesheet" href="css/aos.css">
<link rel="stylesheet" href="css/ionicons.min.css">
<link rel="stylesheet" href="css/bootstrap-datepicker.css">
<link rel="stylesheet" href="css/jquery.timepicker.css">
<link rel="stylesheet" href="css/flaticon.css">
<link rel="stylesheet" href="css/icomoon.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark ftco_navbar bg-dark" id="ftco-navbar">
<div class="container">
<a class="navbar-brand" href="index.html">MaCo</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#ftco-nav" aria-controls="ftco-nav" aria-expanded="false" aria-label="Toggle navigation">
<span class="oi oi-menu"></span> Menu
</button>
<div class="collapse navbar-collapse" id="ftco-nav">
<ul class="navbar-nav ml-auto">
<li class="nav-item"><a href="index.html" class="nav-link">HOME</a></li>
<li class="nav-item"><a href="knowledge-base.html" class="nav-link">THE DOMAIN</a></li>
<li class="nav-item active"><a href="extraction.html" class="nav-link">EXTRACTION OF THE CONCEPTS</a></li>
<li class="nav-item"><a href="ontology.html" class="nav-link">THE ONTOLOGY</a></li>
<li class="nav-item"><a href="contact.html" class="nav-link">ABOUT THE PROJECT</a></li>
</ul>
</div>
</div>
</nav>
<!-- END nav -->
<section class="ftco-section" style="padding-top: 30px;">
<div class="container">
<div class="row">
<a href="./extraction.html"><h1>Topics Comparison</h1></a>
<span style="background-color:grey; width:2px; height:50px; margin-left: 20px; margin-right: 20px;"></span>
<a href="./extractionproperties.html" class=""><h1 class="hoveringTitle" style="color: #e0e0e0">Relations of Concepts</h1></a>
</div>
<div class="row">
<h6>Selecting a topic from the list, the parts of the manifestos expressing this topic will be highlighted.</h6>
</div>
<div class="row">
<div id="temiConfronto" class="col-12">
<a class="subjectButton subjectText speed">Speed</a>
<a class="subjectButton subjectText dynamism">Dynamism</a>
<a class="subjectButton subjectText technology">Technology</a>
<a class="subjectButton subjectText attitude">Attitude</a>
<a class="subjectButton subjectText rejectionofthepast">Rejection of the past</a>
</div>
</div>
<div class="row">
<div id="colonnaSx" class="col-6">
<p class="titleManifesto">
Manifesto del futurismo
</p>
<p>
<span class="subjectText attitude">1. Noi vogliamo cantare l’amor del pericolo, <span class="subjectText dynamism">l’abitudine all’energia e alla temerità.</span></span>
</p><p>
<span class="subjectText attitude">2. Il coraggio, l’audacia, la ribellione,</span> saranno elementi essenziali della nostra poesia.
</p><p>
3. La letteratura esaltò fino ad oggi <span class="subjectText rejectionofthepast">l’immobilità pensosa, l’estasi e il sonno.</span> Noi <span class="subjectText dynamism">vogliamo <span class="subjectText attitude">esaltare il
<span class="subjectText speed">movimento</span> aggressivo, l’insonnia febbrile,</span> <span class="subjectText speed">il passo di corsa, il salto</span> mortale, lo schiaffo ed il pugno.</span>
</p><p>
4. Noi <span class="subjectText attitude">affermiamo</span> che la magnificenza del mondo si è arricchita di una bellezza nuova: <span class="subjectText speed">la bellezza
della velocità. <span class="subjectText technology">Un automobile da corsa </span></span><span class="subjectText technology">col suo cofano adorno di grossi tubi simili a serpenti dall’alito
esplosivo.... </span><span class="subjectText speed"><span class="subjectText technology">un automobile ruggente, che sembra correre sulla mitraglia,</span></span> <span class="subjectText rejectionofthepast">è più bello della Vittoria di
Samotracia.</span>
</p><p>
5. Noi vogliamo <span class="subjectText attitude">inneggiare</span> all’<span class="subjectText speed">uomo che tiene il <span class="subjectText technology">volante</span>, la cui asta ideale attraversa la Terra, lanciata
a corsa</span>, essa pure, sul circuito della sua orbita.
</p><p>
<span class="subjectText dynamism"><span class="subjectText attitude">6. Bisogna che il poeta si prodighi, con ardore, sfarzo e munificenza, per aumentare l’entusiastico
fervore degli elementi primordiali.</span></span>
</p><p>
<span class="subjectText dynamism">7. Non v’è più bellezza, se non nella lotta.</span> Nessuna opera che non abbia un <span class="subjectText dynamism">carattere aggressivo</span> può
essere un capolavoro. <span class="subjectText dynamism">La poesia deve essere concepita come un violento assalto</span> contro le forze ignote, per
ridurle a prostrarsi davanti all’uomo.
</p><p>
<span class="subjectText rejectionofthepast">8. Noi siamo sul promontorio estremo dei secoli!.. Perchè dovremmo guardarci alle spalle, se
vogliamo sfondare le misteriose porte dell’Impossibile? Il Tempo e lo Spazio morirono ieri.</span> Noi viviamo
già nell’assoluto, poichè abbiamo già creata <span class="subjectText speed">l’eterna velocità onnipresente.</span>
</p><p>
9. Noi vogliamo <span class="subjectText attitude">glorificare</span> la guerra — sola igiene del mondo — <span class="subjectText attitude">il militarismo, il patriottismo, il
gesto distruttore</span> dei libertarî, le belle idee per cui si muore e <span class="subjectText attitude">il disprezzo della donna.</span>
</p><p>
<span class="subjectText rejectionofthepast">10. Noi vogliamo distruggere i musei, le biblioteche, le accademie d’ogni specie, e combattere contro
il moralismo, il femminismo e contro ogni viltà opportunistica o utilitaria.</span>
</p><p>
11. Noi canteremo le grandi <span class="subjectText dynamism">folle agitate dal lavoro, dal piacere o dalla sommossa: canteremo le
maree multicolori e polifoniche delle rivoluzioni nelle <span class="subjectText technology">capitali moderne;</span> canteremo il vibrante fervore
notturno degli <span class="subjectText technology">arsenali</span> e dei <span class="subjectText technology">cantieri</span> incendiati da violente <span class="subjectText technology">lune elettriche</span>; le <span class="subjectText technology">stazioni</span> ingorde, divoratrici
di serpi che fumano; le <span class="subjectText technology">officine</span> appese alle nuvole pei contorti fili dei loro fumi; i <span class="subjectText technology">ponti</span> simili a ginnasti
giganti che scavalcano i fiumi, balenanti al sole con un luccichio di coltelli; i <span class="subjectText technology">piroscafi</span> avventurosi che
fiutano l’orizzonte, <span class="subjectText speed">le <span class="subjectText technology">locomotive</span> dall’ampio petto, che scalpitano sulle <span class="subjectText technology">rotaie</span></span>, come <span class="subjectText technology">enormi cavalli
d’acciaio imbrigliati di tubi</span>, e il volo scivolante degli <span class="subjectText technology">aereoplani</span>, la cui <span class="subjectText technology">elica</span> garrisce al vento come una
bandiera e sembra applaudire come una folla entusiasta.</span>
</p>
</div>
<div id="colonnaDx" class="col-6">
<p class="titleManifesto">
Manifesto dei pittori futuristi
</p>
<p>
Ed ecco le nostre conclusioni recise: Con questa <span class="subjectText attitude">entusiastica adesione</span> al futurismo, noi vogliamo:
</p>
<p>
<span class="subjectText rejectionofthepast">1. <span class="subjectText rejectionofthepast"><span class="subjectText attitude">Distruggere</span> il culto del passato, l’ossessione dell’antico,</span> il pedantismo e il formalismo accademico,</span>
</p><p>
2. <span class="subjectText rejectionofthepast"><span class="subjectText attitude">Disprezzare</span> profondamente ogni forma di imitazione.</span>
</p><p>
3. <span class="subjectText attitude">Esaltare</span> ogni forma di originalità, anche se <span class="subjectText attitude">temeraria</span>, anche se <span class="subjectText attitude">violentissima</span>.
</p><p>
4. <span class="subjectText attitude">Trarre coraggio ed orgoglio</span> dalla facile taccia di pazzia con cui si sferzano e s’imbavagliano
gl’innovatori.
</p><p>
<span class="subjectText rejectionofthepast">5. Considerare i critici d’arte come inutili o dannosi.</span>
</p><p>
6. <span class="subjectText rejectionofthepast"><span class="subjectText attitude">Ribellarci</span> contro la tirannia delle parole: armonia e buon gusto, espressioni troppo
elastiche, con le quali si potrebbe facilmente <span class="subjectText attitude">demolire</span> l’opera di Rembrandt e quella di Goya.</span>
</p><p>
7. <span class="subjectText rejectionofthepast"><span class="subjectText attitude">Spazzar via</span> dal campo ideale dell’arte tutti i motivi, tutti i soggetti già sfruttati.</span>
</p><p>
8. <span class="subjectText attitude">Rendere e magnificare</span> la vita odierna, <span class="subjectText speed"><span class="subjectText dynamism">incessantemente e tumultuosamente</span></span> trasformata dalla
<span class="subjectText technology">scienza vittoriosa</span>.
<span class="subjectText rejectionofthepast">Siano sepolti i morti nelle piú profonde viscere della terra! Sia sgombra di mummie la soglia del
futuro! <span class="subjectText attitude">Largo ai giovani, ai violenti, ai temerari!</span></span>
</p>
</div>
</div>
</div>
</section>
<footer class="ftco-footer ftco-bg-dark ftco-section" style="padding: 2em !important;">
<div class="container">
<div class="row mb-5">
<div class="col-md">
</div>
</div>
<p><!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. -->
©<script>document.write(new Date().getFullYear());</script> This work is distributed under a Creative Commons Attribution License (http://creativecommons.org/licenses/by/3.0/).
<!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. --></p>
</div>
</div>
</div>
</footer>
<!-- loader -->
<div id="ftco-loader" class="show fullscreen"><svg class="circular" width="48px" height="48px"><circle class="path-bg" cx="24" cy="24" r="22" fill="none" stroke-width="4" stroke="#eeeeee"/><circle class="path" cx="24" cy="24" r="22" fill="none" stroke-width="4" stroke-miterlimit="10" stroke="#F96D00"/></svg></div>
<script src="js/jquery.min.js"></script>
<script src="js/jquery-migrate-3.0.1.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.easing.1.3.js"></script>
<script src="js/jquery.waypoints.min.js"></script>
<script src="js/jquery.stellar.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/aos.js"></script>
<script src="js/jquery.animateNumber.min.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
<script src="js/jquery.timepicker.min.js"></script>
<script src="js/scrollax.min.js"></script>
<script src="js/main.js"></script>
<style>
.titleManifesto {
font-weight: bolder;
font-size: 15pt;
font-family: "Courier New";
color: #454545;
}
#titolone1 {
font-size: 36pt;
font-weight: bolder;
}
#titolone2 {
font-size: 24pt;
font-weight: bolder;
}
#titolone3 {
font-size: 16pt;
font-weight: bolder;
}
#titolone4 {
font-weight: bolder;
font-size:12pt;
}
#temiConfronto{
border-bottom: 2px solid black;
padding: 15px;
}
#temiConfronto a {
cursor: pointer;
padding: 15px;
font-family: Courier;
font-size: 12pt;
font-weight: bolder;
}
#colonnaDx, #colonnaSx {
font-family: Courier;
font-weight: normal;
padding-left: 30px;
padding-top: 20px;
}
.subjectText.highlighted{
transition: 0.4s;
}
.subjectText.highlighted.speed {
background-color: rgba(255, 185, 72, 0.62);
}
.subjectText.highlighted.rejectionofthepast {
background-color: rgba(119, 255, 166, 0.67);
}
.subjectText.highlighted.dynamism {
background-color: rgba(119, 159, 255, 0.68);
}
.subjectText.highlighted.attitude {
background-color: rgba(255, 97, 117, 0.76);
}
.subjectText.highlighted.technology {
background-color: rgba(213, 120, 218, 0.77);
}
.hoveringTitle:hover{
color: rgba(0, 0, 0, 0.8) !important;
cursor: pointer;
}
</style>
<script>
function highlightSubject(subject){
jQuery('.subjectText').removeClass('highlighted');
jQuery('.subjectText.' + subject).addClass('highlighted');
}
jQuery('.subjectButton').click(function(){
var pushedbutton = jQuery(this).attr('class').split(' ')[2];
highlightSubject(pushedbutton);
}).hover(function(){
var pushedbutton = jQuery(this).attr('class').split(' ')[2];
highlightSubject(pushedbutton);
});
</script>
</body>
</html>