flow/historia-de-zainab
1
0
Fork 0
Code Issues 2 Pull requests Projects Releases Wiki Activity

version movil

Browse source
This commit is contained in:
Sergio 2017-11-06 12:53:02 +01:00
parent 4180b10c4c
commit 552007d8fa
8 changed files with 396 additions and 41 deletions
Download patch file Download diff file Expand all files Collapse all files

72
index_mob.html
View file

@ -10,7 +10,6 @@
<!-- CSS -->
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="css/BootstrapXL.css">
<link href="bower_components/jbox/Source/jBox.css" rel="stylesheet">
@ -27,13 +26,6 @@
<script type="text/javascript" src="bower_components/d3/d3.min.js"></script>
<script type="text/javascript" src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="bower_components/jsrender/jsrender.min.js"></script>
<script type="text/javascript" src="js/main-mvl.js"></script>
</head>
@ -42,47 +34,49 @@
<div class="container-fluid">
<div class="col-xs-6">
<a class="navbar-brand-custom" href="#">Historia de Zainab</a>
<span class="chapter-name">Capítulo 1 </span>
<span class="chapter-name">Capítulo 1 </span> <a class="next" href="#"><span class="circle glyphicon glyphicon-chevron-right"> </span></a>
</div>
<div class="col-xs-2">
<a href="#story"><img src="images/c1_menu_story.png" class="img-menu"/></a>
<div class="col-xs-2 nopadding ">
<a class="link-menu" href="#story"><img src="images/c1_menu_story.png" class="img-menu"/>
story
</a>
</div>
<div class="col-xs-2">
<a href="#mapa"> <img src="images/c1_menu_mapa.png" class="img-menu"/></a>
<div class="col-xs-2 nopadding">
<a class="link-menu" href="#mapa"> <img src="images/c1_menu_mapa.png" class="img-menu"/>
mapa
</a>
</div>
<div class="col-xs-2">
<a href="#datos"> <img src="images/c1_menu_datos.png" class="img-menu"/> </a>
<div class="col-xs-2 nopadding">
<a class="link-menu" href="#datos"> <img src="images/c1_menu_datos.png" class="img-menu"/>
datos
</a>
</div>
</div>
</div>
</nav>
<div class="container-fluid">
<div id="main-content">
<div id="story" class="section">
<img src="images/c1_IMG_story_mob.jpg" class="img-responsive"/>
<div id="story-text">
Este cómic quiere visibilizar el éxodo de Zainab y su familia que, como otros 11 millones de personas, se han visto obligadas a abandonar su hogar desde que en 2011 comenzó la guerra en Siria.
<div class="container-fluid">
<div id="main-content">
<div id="story" class="section">
<img src="images/c1_IMG_story_mob.jpg" class="img-responsive"/>
<div id="story-text">
Este cómic quiere visibilizar el éxodo de Zainab y su familia que, como otros 11 millones de personas, se han visto obligadas a abandonar su hogar desde que en 2011 comenzó la guerra en Siria.
</div>
</div>
<div id="mapa" class="section">
<img src="images/c1_mapa_mob.jpg" class="img-responsive"/>
</div>
<div id="datos" class="section">
<img src="images/c1_IMG_grafico_mob.jpg" class="img-responsive"/>
<div id="map-text">
Este proyecto se ha realizado durante Visualizar'17, un proceso de investigación participativo sobre visualización de información y migraciones.
Los datos entran en acción para contar una historia. Y si a menudo es difícil obtener datos fiables, en un contexto de guerra todas las cifras se convierten en estimaciones.
No por ello dejan de representar una realidad que están viviendo millones de personas tratadas como números.
Aquí tratamos a los números como personas.
</div>
</div>
</div>
</div>
<div id="mapa" class="section">
<img src="images/c1_mapa_mob.jpg" class="img-responsive"/>
</div>
<div id="datos" class="section">
<img src="images/c1_IMG_grafico_mob.jpg" class="img-responsive"/>
<div id="map-text">
Este proyecto se ha realizado durante Visualizar'17, un proceso de investigación participativo sobre visualización de información y migraciones.
Los datos entran en acción para contar una historia. Y si a menudo es difícil obtener datos fiables, en un contexto de guerra todas las cifras se convierten en estimaciones.
No por ello dejan de representar una realidad que están viviendo millones de personas tratadas como números.
Aquí tratamos a los números como personas.
</div>
</div>
</div>
</div>
</body>
</html>