cambio version desktop y movil

This commit is contained in:
Sergio 2017-11-08 13:08:21 +01:00
parent a1a82ef2e4
commit a94f12cc3d
29 changed files with 625 additions and 200 deletions

BIN
templates/.DS_Store vendored

Binary file not shown.

View file

@ -0,0 +1,117 @@
<div class="container-fluid">
<div class="row">
<div class="col-md-9 section-left">
<div class="section-inner-content">
<div class="story-content" style="background-image: url(images/c6_IMG_story.jpg)">
<!-- img src="images/c6_IMG_story.jpg" class="img-responsive" /> --> <!-- imagen de historia-->
</div>
<div class="data-content" style="display:none">
<div class="row">
<div class="col-sm-2 col-lg-1 " style="margin-top:2em">
<ul class="carousel-btn">
<a href="#" data-target="#myCarousel" data-slide-to="0" class="carouselGotoBtn btn btn-default btn-block active" >
<li >
2011
</li>
</a>
<a href="#" data-target="#myCarousel" data-slide-to="1" class="carouselGotoBtn btn btn-default btn-block">
<li >
2012
</li></a>
<a href="#" data-target="#myCarousel" data-slide-to="2" class="carouselGotoBtn btn btn-default btn-block">
<li >
2013
</li></a>
<a href="#" data-target="#myCarousel" data-slide-to="3" class="carouselGotoBtn btn btn-default btn-block">
<li >
2014
</li></a>
<a href="#" data-target="#myCarousel" data-slide-to="4" class="carouselGotoBtn btn btn-default btn-block">
<li >
2015
</li></a>
<a href="#" data-target="#myCarousel" data-slide-to="5" class="carouselGotoBtn btn btn-default btn-block">
<li >
2016
</li></a>
<a href="#" data-target="#myCarousel" data-slide-to="6" class="carouselGotoBtn btn btn-default btn-block">
<li>
2017
</li></a>
</ul>
</div>
<div class="col-sm-10 col-lg-11">
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="item active">
<img src="images/c6_aerea2011.jpg" alt="2011">
</div>
<div class="item">
<img src="images/c6_aerea2012.jpg" alt="2012">
</div>
<div class="item">
<img src="images/c6_aerea2013.jpg" alt="2013">
</div>
<div class="item">
<img src="images/c6_aerea2014.jpg" alt="2014">
</div>
<div class="item">
<img src="images/c6_aerea2015.jpg" alt="2015">
</div>
<div class="item">
<img src="images/c6_aerea2016.jpg" alt="2016">
</div>
<div class="item">
<img src="images/c6_aerea2017.jpg" alt="2017">
</div>
</div>
</div>
<div>
<img src="images/c6_IMG_grafico_inferior.jpg" class="img-responsive">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-3">
<div class="menu-content">
<!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ -->
<div class="menu-story-content">
<div class="row">
<div class="col-md-9 col-md-offset-1 col-lg-8 col-lg-offset-2 col-sm-10 col-sm-offset-1 col-xl-7 col-xl-offset-1">
<div class="menu-story-inner">
{{:storytext}}
</div>
<a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c6_ver_grafico.jpg" class="vergrafico img-responsive" /> </a>
</div>
</div>
</div>
<div class="menu-data-content" style="display:none">
<div class="row">
<div class="col-md-9 col-md-offset-1 col-lg-8 col-lg-offset-2 col-sm-10 col-sm-offset-1 col-xl-7 col-xl-offset-1">
<div class="menu-data-inner">
{{:maptext}}
</div>
<a href="#" class="referencias" id="referencias-page-btn-6"> Referencias bibliográficas </a>
<a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c6_ver_story.jpg" class="verstory img-responsive" /> </a>
</div>
</div>
</div>
</div>
<div class="extra-btn-container">
<a class="" id="map-btn-page-{{:n_page}}" href="#"> <img src="images/c{{:n_page}}_menu_mapa.png" width="60px" height="74px" class="mapa img-responsive" /> </a>
</div>
</div>
</div>
</div>
<div class="map-popover" id="map-page-6">
<img src="images/c6_mapa_ACT.jpg" class="img-responsive" />
</div>

View file

@ -0,0 +1,63 @@
<div class="container-fluid">
<div class="row">
<div class="col-md-9 section-left">
<div class="section-inner-content">
<div class="story-content" style="background-image: url(images/c{{:n_page}}_IMG_story.jpg)">
<!-- <img src="images/c1_IMG_story.jpg" class="img-responsive" /> imagen de historia-->
</div>
<div class="data-content" style="display:none; background-image: url(images/c{{:n_page}}_IMG_grafico.jpg)">
<!-- <img src="images/c1_IMG_grafico.jpg" class="img-responsive" /> imagen de datos-->
</div>
</div>
</div>
<div class="col-md-3">
<div class="menu-content">
<!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ -->
<div class="menu-story-content">
<div class="row">
<div class="col-md-9 col-md-offset-1 col-lg-8 col-lg-offset-2 col-sm-10 col-sm-offset-1 col-xl-7 col-xl-offset-1">
<div class="menu-story-inner">
{{:storytext}}
</div>
<!--<a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c{{:n_page}}_ver_grafico.jpg" class="vergrafico img-responsive" /> </a>-->
</div>
</div>
</div>
<div class="menu-data-content" style="display:none">
<div class="row">
<div class="col-md-9 col-md-offset-1 col-lg-8 col-lg-offset-2 col-sm-10 col-sm-offset-1 col-xl-7 col-xl-offset-1">
<div class="menu-data-inner">
{{:maptext}}
</div>
<a href="#" class="referencias" id="referencias-page-btn-{{:n_page}}"> Referencias bibliográficas </a>
<!--<a href="#" class="switchMode" class="btn btn-circle">
<img src="images/c{{:n_page}}_ver_story.jpg" class="verstory img-responsive" />
</a> -->
</div>
</div>
</div>
</div>
<div class="extra-btn-container">
<a class="" id="map-btn-page-{{:n_page}}" href="#"> <img src="images/c{{:n_page}}_menu_mapa.png" width="60px" height="74px" class="mapa img-responsive" />
ver mapa
</a>
<a href="#" class="switchMode verstory-btn" class="btn btn-circle">
<img src="images/c{{:n_page}}_menu_story.png" width="60px" height="74px" class="verstory img-responsive" />
ver historia
</a>
<a href="#" class="switchMode vergrafico-btn" class="btn btn-circle"> <img src="images/c{{:n_page}}_menu_datos.png" width="60px" height="74px" class="vergrafico img-responsive" />
ver datos
</a>
</div>
</div>
</div>
</div>
<div class="map-popover" id="map-page-{{:n_page}}">
<img src="images/c{{:n_page}}_mapa_ACT.jpg" class="img-responsive" />
</div>

View file

@ -40,6 +40,7 @@
<div id="map-text">
{{:maptext}}
</div>
<a href="#" class="referencias" id="referencias-page-btn-{{:n_page}}"> Referencias bibliográficas </a>
</div>
</div>
</div>

View file

@ -1,4 +1,4 @@
<div class="container-fluid" style="background:url(images/c0_portada.jpg); background-color:white; background-position: center; background-repeat: no-repeat; background-size: contain; width:100%; height:100%">
<div class="container-fluid desktop-profile" style="background:url(images/c0_portada.jpg); background-color:white; background-position: center; background-repeat: no-repeat; background-size: contain; width:100%; height:100%">
<div class="row">
<div id="portada" >
<!-- <img src="images/c0_portada.jpg" class="img-responsive" style="z-index:1000"/> -->
@ -24,6 +24,6 @@
<p>Victor Valles</p>
<h3>Agradecimientos:</h3>
<p>A Elena Cabrera y Héctor Millano de <a href="https://porcausa.org/" target="_blank">PorCausa</a> por aportar información de tremendo valor y ayudándonos a creer que La Historia de Zainab valía la pena ser contada. </p>
<p>A Sergio Galán haciendo que la web<a href="http://historiadezainab.org/" target="_blank"> historiadezainab.org</a> sea una realidad.</p>
<p>A Sergio Galán haciendo que la web<a href="http://historiadezainab.org/" target="_blank"> historiadezainab.org</a> sea una realidad.</p>
<p>Y además, Hannah Williams, Alejandro Zappala, Samuel Granados, Beatriz Martínez, Pablo Martín, JesúsDa, y todo el equipo de <a href="http://medialab-prado.es/article/visualizar17-migraciones" target="_blank">Visualizar'17</a> que nos dieron una fuerza imprescindible para emprender este viaje.</p>
</div>

View file

@ -1,4 +1,4 @@
<div class="container-fluid nopadding" id="cover-mvl">
<div class="container-fluid nopadding" id="cover-mvl" >
<div id="main-content">
<div id="story">
<img src="images/c0_portada_mob_cortada.jpg" class="img-responsive"/>