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

cambios con imagenes nuevas

Browse source
This commit is contained in:
Sergio 2017-09-28 13:44:31 +02:00
parent 1f6ee5cc78
commit bbb2ad0368
13 changed files with 56 additions and 45 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
.DS_Store vendored
View file

Binary file not shown.

2
css/css/home.css
View file

@ -1 +1 @@
p{font-size:12px}.cd-horizontal-timeline .events-content{position:relative}.cd-horizontal-timeline .events-content li{position:absolute;z-index:1;width:100%;left:0;top:0;transform:translateX(-100%);opacity:0;animation-duration:.4s;animation-timing-function:ease-in-out}.cd-horizontal-timeline .events-content li.selected{position:relative;z-index:2;opacity:1;transform:translateX(0)}div.section-container{background-color:white}.cd-timeline-navigation{padding:0;margin:0;text-align:left;align:left}#timeline{z-index:10;position:absolute;bottom:0;left:0;height:100px;width:100%;text-align:left;background-color:white}#timeline li{display:inline-block;width:13.9%;margin:0;padding:0;text-align:left;line-height:auto}#timeline a{background-color:transparent;text-align:left;line-height:auto}#timeline img{width:103%;opacity:.2;transition:all 1s}#timeline a.active img.img-menu{opacity:1}div.menu-content{height:100vh;background-color:white}div.extra-btn-container{position:absolute;left:700px;bottom:200px}a.btn-circle{border-radius:40px}.map-popover{display:none} p{font-size:12px}.cd-horizontal-timeline .events-content{position:relative}.cd-horizontal-timeline .events-content li{position:absolute;z-index:1;width:100%;left:0;top:0;transform:translateX(-100%);opacity:0;animation-duration:.4s;animation-timing-function:ease-in-out}.cd-horizontal-timeline .events-content li.selected{position:relative;z-index:2;opacity:1;transform:translateX(0)}.cd-timeline-navigation{padding:0;margin:0;text-align:left;align:left}#timeline{z-index:10;position:absolute;bottom:0;left:0;height:100px;width:100%;text-align:left;background-color:white}#timeline li{display:inline-block;width:13.9%;margin:0;padding:0;text-align:left;line-height:auto}#timeline a{background-color:transparent;text-align:left;line-height:auto}#timeline img{width:103%;opacity:.2;transition:all 1s}#timeline a.active img.img-menu{opacity:1}div.menu-content{height:100vh;background-color:white;padding-left:50px;padding-right:70px}div.extra-btn-container{position:absolute;left:700px;bottom:200px}a.btn-circle{border-radius:40px}.map-popover{display:none}div.section-left{background-color:#bebeb6}a.switchMode{display:block}div.section-inner-content{text-align:right}

2
css/css/home.css.map
View file

@ -1 +1 @@
{"version":3,"sources":["home.less"],"names":[],"mappings":"AACA,EACI,eAGJ,uBAAwB,iBACpB,kBAGJ,uBAAwB,gBAAgB,IACpC,iBAAA,CACA,SAAA,CACA,UAAA,CACA,MAAA,CACA,KAAA,CACA,UAAW,iBAAX,CACA,SAAA,CACA,sBAAA,CACA,sCAGJ,uBAAwB,gBAAgB,GAAE,UAEtC,iBAAA,CACA,SAAA,CACA,SAAA,CACA,UAAW,cAGf,GAAG,mBACC,uBAEJ,wBACI,SAAA,CACA,QAAA,CACA,eAAA,CACA,WAEJ,UACI,UAAA,CACA,iBAAA,CACA,QAAA,CACA,MAAA,CACA,YAAA,CACA,UAAA,CACA,eAAA,CACA,uBARJ,SAUI,IACI,oBAAA,CACA,WAAA,CACA,QAAA,CACA,SAAA,CACA,eAAA,CACA,iBAhBR,SAmBI,GACI,4BAAA,CACA,eAAA,CACA,iBAtBR,SA2BI,KACI,UAAA,CACA,UAAA,CACA,kBA9BR,SAiCI,EAAC,OAAQ,IAAG,UACR,UAIR,GAAG,cACC,YAAA,CACA,uBAGJ,GAAG,qBACC,iBAAA,CACA,UAAA,CACA,aAGJ,CAAC,YACG,mBAGJ,aACI"} {"version":3,"sources":["home.less"],"names":[],"mappings":"AACA,EACI,eAGJ,uBAAwB,iBACpB,kBAGJ,uBAAwB,gBAAgB,IACpC,iBAAA,CACA,SAAA,CACA,UAAA,CACA,MAAA,CACA,KAAA,CACA,UAAW,iBAAX,CACA,SAAA,CACA,sBAAA,CACA,sCAGJ,uBAAwB,gBAAgB,GAAE,UAEtC,iBAAA,CACA,SAAA,CACA,SAAA,CACA,UAAW,cAMf,wBACI,SAAA,CACA,QAAA,CACA,eAAA,CACA,WAEJ,UACI,UAAA,CACA,iBAAA,CACA,QAAA,CACA,MAAA,CACA,YAAA,CACA,UAAA,CACA,eAAA,CACA,uBARJ,SAUI,IACI,oBAAA,CACA,WAAA,CACA,QAAA,CACA,SAAA,CACA,eAAA,CACA,iBAhBR,SAmBI,GACI,4BAAA,CACA,eAAA,CACA,iBAtBR,SA2BI,KACI,UAAA,CACA,UAAA,CACA,kBA9BR,SAiCI,EAAC,OAAQ,IAAG,UACR,UAIR,GAAG,cACC,YAAA,CACA,sBAAA,CACA,iBAAA,CACA,mBAGJ,GAAG,qBACC,iBAAA,CACA,UAAA,CACA,aAGJ,CAAC,YACG,mBAGJ,aACI,aAEJ,GAAG,cACH,yBAGA,CAAC,YACG,cAEJ,GAAG,uBACC"}

11
css/home.less
View file

@ -29,7 +29,7 @@ p {
} }
div.section-container { div.section-container {
background-color: white;
} }
.cd-timeline-navigation{ .cd-timeline-navigation{
padding:0px; padding:0px;
@ -78,6 +78,8 @@ div.section-container {
div.menu-content { div.menu-content {
height: 100vh; height: 100vh;
background-color: white; background-color: white;
padding-left: 50px;
padding-right: 70px;
} }
div.extra-btn-container { div.extra-btn-container {
@ -93,8 +95,15 @@ a.btn-circle {
.map-popover { .map-popover {
display: none; display: none;
} }
div.section-left{
background-color: #bebeb6;
}
a.switchMode{
display: block;
}
div.section-inner-content { div.section-inner-content {
text-align:right;
div.story-content {} div.story-content {}
div.data-content {} div.data-content {}

BIN
images/.DS_Store vendored Normal file
View file

Binary file not shown.

BIN
images/c1_IMG_story.png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 96 KiB

14
templates/page1.html
View file

@ -1,12 +1,12 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-9"> <div class="col-md-9 section-left">
<div class="section-inner-content"> <div class="section-inner-content">
<div class="story-content"> <div class="story-content">
<img src="images/c1_IMG_story.png" class="img-responsive" /> <!-- imagen de historia--> <img src="images/c1_IMG_story.jpg" class="img-responsive" /> <!-- imagen de historia-->
</div> </div>
<div class="data-content" style="display:none"> <div class="data-content" style="display:none">
<img src="images/data.png" class="img-responsive" /> <!-- imagen de datos--> <img src="images/c1_IMG_grafico.jpg" class="img-responsive" /> <!-- imagen de datos-->
</div> </div>
</div> </div>
</div> </div>
@ -15,12 +15,14 @@
<!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ --> <!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ -->
<div class="menu-story-content"> <div class="menu-story-content">
<h2> menu </h2> <h2> menu </h2>
<a href="#" class="switchMode" class="btn btn-circle"> VER DATOS </a> "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
<a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c1_ver_grafico.jpg" class="vergrafico img-responsive" /> </a>
</div> </div>
<div class="menu-data-content" style="display:none"> <div class="menu-data-content" style="display:none">
<h2> menu </h2> <h2> menu </h2>
<div> texto de datos </div> <div> texto de datos </div>
<a href="#" class="switchMode" class="btn btn-circle"> VER historia </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c1_ver_story.jpg" class="verstory img-responsive" /> </a>
</div> </div>
</div> </div>
</div> </div>
@ -31,5 +33,5 @@
</div> </div>
<div class="map-popover" id="map-page-1"> <div class="map-popover" id="map-page-1">
<img src="images/c1_mapa_ACT.png" class="img-responsive" /> <img src="images/c1_mapa_ACT.jpg" class="img-responsive" />
</div> </div>

12
templates/page2.html
View file

@ -1,12 +1,12 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-9"> <div class="col-md-9 section-left">
<div class="section-inner-content"> <div class="section-inner-content">
<div class="story-content"> <div class="story-content">
<img src="images/medialab.jpg" class="img-responsive" /> <img src="images/c2_IMG_story.jpg" class="img-responsive" />
</div> </div>
<div class="data-content" style="display:none"> <div class="data-content" style="display:none">
<img src="images/data.png" class="img-responsive" /> <img src="images/c2_IMG_grafico.jpg" class="img-responsive" />
</div> </div>
</div> </div>
</div> </div>
@ -15,12 +15,12 @@
<!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ --> <!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ -->
<div class="menu-story-content"> <div class="menu-story-content">
<h2> menu </h2> <h2> menu </h2>
<a href="#" class="switchMode" class="btn btn-circle"> VER DATOS </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c2_ver_grafico.jpg" class="vergrafico img-responsive" /> </a>
</div> </div>
<div class="menu-data-content" style="display:none"> <div class="menu-data-content" style="display:none">
<h2> menu </h2> <h2> menu </h2>
<div> texto de datos </div> <div> texto de datos </div>
<a href="#" class="switchMode" class="btn btn-circle"> VER historia </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c2_ver_story.jpg" class="verstory img-responsive" /> </a>
</div> </div>
</div> </div>
@ -32,5 +32,5 @@
</div> </div>
<div class="map-popover" id="map-page-2"> <div class="map-popover" id="map-page-2">
<img src="images/c1_mapa_ACT.png" class="img-responsive" /> <img src="images/c2_mapa_ACT.jpg" class="img-responsive" />
</div> </div>

12
templates/page3.html
View file

@ -1,12 +1,12 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-9"> <div class="col-md-9 section-left">
<div class="section-inner-content"> <div class="section-inner-content">
<div class="story-content"> <div class="story-content">
<img src="images/medialab.jpg" class="img-responsive" /> <img src="images/c3_IMG_story.jpg" class="img-responsive" />
</div> </div>
<div class="data-content" style="display:none"> <div class="data-content" style="display:none">
<img src="images/data.png" class="img-responsive" /> <img src="images/c3_IMG_grafico.jpg" class="img-responsive" />
</div> </div>
</div> </div>
</div> </div>
@ -15,12 +15,12 @@
<!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ --> <!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ -->
<div class="menu-story-content"> <div class="menu-story-content">
<h2> menu </h2> <h2> menu </h2>
<a href="#" class="switchMode" class="btn btn-circle"> VER DATOS </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c3_ver_grafico.jpg" class="vergrafico img-responsive" /> </a>
</div> </div>
<div class="menu-data-content" style="display:none"> <div class="menu-data-content" style="display:none">
<h2> menu </h2> <h2> menu </h2>
<div> texto de datos </div> <div> texto de datos </div>
<a href="#" class="switchMode" class="btn btn-circle"> VER historia </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c3_ver_story.jpg" class="verstory img-responsive" /> </a>
</div> </div>
</div> </div>
</div> </div>
@ -31,5 +31,5 @@
</div> </div>
<div class="map-popover" id="map-page-3"> <div class="map-popover" id="map-page-3">
<img src="images/c1_mapa_ACT.png" class="img-responsive" /> <img src="images/c3_mapa_ACT.jpg" class="img-responsive" />
</div> </div>

12
templates/page4.html
View file

@ -1,12 +1,12 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-9"> <div class="col-md-9 section-left">
<div class="section-inner-content"> <div class="section-inner-content">
<div class="story-content"> <div class="story-content">
<img src="images/c1_IMG_story.png" class="img-responsive" /> <img src="images/c4_IMG_story.jpg" class="img-responsive" />
</div> </div>
<div class="data-content" style="display:none"> <div class="data-content" style="display:none">
<img src="images/data.png" class="img-responsive" /> <img src="images/c4_IMG_grafico.jpg" class="img-responsive" />
</div> </div>
</div> </div>
</div> </div>
@ -15,12 +15,12 @@
<!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ --> <!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ -->
<div class="menu-story-content"> <div class="menu-story-content">
<h2> menu </h2> <h2> menu </h2>
<a href="#" class="switchMode" class="btn btn-circle"> VER DATOS </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c4_ver_grafico.jpg" class="vergrafico img-responsive" /> </a>
</div> </div>
<div class="menu-data-content" style="display:none"> <div class="menu-data-content" style="display:none">
<h2> menu </h2> <h2> menu </h2>
<div> texto de datos </div> <div> texto de datos </div>
<a href="#" class="switchMode" class="btn btn-circle"> VER historia </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c4_ver_story.jpg" class="verstory img-responsive" /> </a>
</div> </div>
</div> </div>
@ -32,5 +32,5 @@
</div> </div>
<div class="map-popover" id="map-page-4"> <div class="map-popover" id="map-page-4">
<img src="images/c1_mapa_ACT.png" class="img-responsive" /> <img src="images/c4_mapa_ACT.jpg" class="img-responsive" />
</div> </div>

12
templates/page5.html
View file

@ -1,12 +1,12 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-9"> <div class="col-md-9 section-left">
<div class="section-inner-content"> <div class="section-inner-content">
<div class="story-content"> <div class="story-content">
<img src="images/c1_IMG_story.png" class="img-responsive" /> <!-- imagen de historia--> <img src="images/c5_IMG_story.jpg" class="img-responsive" /> <!-- imagen de historia-->
</div> </div>
<div class="data-content" style="display:none"> <div class="data-content" style="display:none">
<img src="images/data.png" class="img-responsive" /> <!-- imagen de datos--> <img src="images/c5_IMG_grafico.jpg" class="img-responsive" /> <!-- imagen de datos-->
</div> </div>
</div> </div>
</div> </div>
@ -15,12 +15,12 @@
<!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ --> <!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ -->
<div class="menu-story-content"> <div class="menu-story-content">
<h2> menu </h2> <h2> menu </h2>
<a href="#" class="switchMode" class="btn btn-circle"> VER DATOS </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c5_ver_grafico.jpg" class="vergrafico img-responsive" /> </a>
</div> </div>
<div class="menu-data-content" style="display:none"> <div class="menu-data-content" style="display:none">
<h2> menu </h2> <h2> menu </h2>
<div> texto de datos </div> <div> texto de datos </div>
<a href="#" class="switchMode" class="btn btn-circle"> VER historia </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c5_ver_story.jpg" class="verstory img-responsive" /> </a>
</div> </div>
</div> </div>
@ -32,5 +32,5 @@
</div> </div>
<div class="map-popover" id="map-page-5"> <div class="map-popover" id="map-page-5">
<img src="images/c1_mapa_ACT.png" class="img-responsive" /> <img src="images/c5_mapa_ACT.jpg" class="img-responsive" />
</div> </div>

12
templates/page6.html
View file

@ -1,12 +1,12 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-9"> <div class="col-md-9 section-left">
<div class="section-inner-content"> <div class="section-inner-content">
<div class="story-content"> <div class="story-content">
<img src="images/c1_IMG_story.png" class="img-responsive" /> <!-- imagen de historia--> <img src="images/c6_IMG_story.jpg" class="img-responsive" /> <!-- imagen de historia-->
</div> </div>
<div class="data-content" style="display:none"> <div class="data-content" style="display:none">
<img src="images/data.png" class="img-responsive" /> <!-- imagen de datos--> <img src="images/c6_IMG_grafico.jpg" class="img-responsive" /> <!-- imagen de datos-->
</div> </div>
</div> </div>
</div> </div>
@ -16,12 +16,12 @@
<!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ --> <!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ -->
<div class="menu-story-content"> <div class="menu-story-content">
<h2> menu </h2> <h2> menu </h2>
<a href="#" class="switchMode" class="btn btn-circle"> VER DATOS </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c6_ver_grafico.jpg" class="vergrafico img-responsive" /> </a>
</div> </div>
<div class="menu-data-content" style="display:none"> <div class="menu-data-content" style="display:none">
<h2> menu </h2> <h2> menu </h2>
<div> texto de datos </div> <div> texto de datos </div>
<a href="#" class="switchMode" class="btn btn-circle"> VER historia </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>
@ -33,5 +33,5 @@
</div> </div>
<div class="map-popover" id="map-page-6"> <div class="map-popover" id="map-page-6">
<img src="images/c1_mapa_ACT.png" class="img-responsive" /> <img src="images/c6_mapa_ACT.jpg" class="img-responsive" />
</div> </div>

12
templates/page7.html
View file

@ -1,12 +1,12 @@
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-9"> <div class="col-md-9 section-left">
<div class="section-inner-content"> <div class="section-inner-content">
<div class="story-content"> <div class="story-content">
<img src="images/c1_IMG_story.png" class="img-responsive" /> <!-- imagen de historia--> <img src="images/c7_IMG_story.jpg" class="img-responsive" /> <!-- imagen de historia-->
</div> </div>
<div class="data-content" style="display:none"> <div class="data-content" style="display:none">
<img src="images/data.png" class="img-responsive" /> <!-- imagen de datos--> <img src="images/c7_IMG_grafico.jpg" class="img-responsive" /> <!-- imagen de datos-->
</div> </div>
</div> </div>
</div> </div>
@ -15,12 +15,12 @@
<!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ --> <!-- METER CONTENIDO DEL PANEL DERECHO AQUÍ -->
<div class="menu-story-content"> <div class="menu-story-content">
<h2> menu </h2> <h2> menu </h2>
<a href="#" class="switchMode" class="btn btn-circle"> VER DATOS </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c7_ver_grafico.jpg" class="vergrafico img-responsive" /> </a>
</div> </div>
<div class="menu-data-content" style="display:none"> <div class="menu-data-content" style="display:none">
<h2> menu </h2> <h2> menu </h2>
<div> texto de datos </div> <div> texto de datos </div>
<a href="#" class="switchMode" class="btn btn-circle"> VER historia </a> <a href="#" class="switchMode" class="btn btn-circle"> <img src="images/c7_ver_story.jpg" class="verstory img-responsive" /> </a>
</div> </div>
</div> </div>
@ -32,5 +32,5 @@
</div> </div>
<div class="map-popover" id="map-page-7"> <div class="map-popover" id="map-page-7">
<img src="images/c1_mapa_ACT.png" class="img-responsive" /> <img src="images/c7_mapa_ACT.jpg" class="img-responsive" />
</div> </div>