Skip to content

F
fordecyt_2019
Commit 319b9476 authored by Tania Gómez's avatar Tania Gómez
Browse files
Options

changes on cards display

parent f3c714bc
Hide whitespace changes
Inline Side-by-side
Showing with 93 additions and 83 deletions
public/fordecyt_2019/index.html
View file @ 319b9476
...@@ -44,106 +44,116 @@ ...@@ -44,106 +44,116 @@
</div> </div>
<div class="container"> <div class="container">
<div class="card-deck mb-3 text-center">
<div class="card mb-4 shadow-sm"> <div class="card-deck mb-3 text-center">
<div class="card-header"> <div class="row">
<h4 class="my-0 font-weight-normal">R&iacute;o Grijalva</h4> <div class="card mb-4 shadow-sm">
</div> <div class="card-header">
<div class="card-body"> <h4 class="my-0 font-weight-normal">R&iacute;o Grijalva</h4>
<div class="hovereffect zoom"> </div>
<img class="card-img" src="img/sumidero.jpg" alt="Ca&ntilde;&oacute;n del Sumidero"> <div class="card-body">
<span class="photo-credit">Foto: Gabriela L&oacute;pez</span> <div class="hovereffect zoom">
<div class="overlay"> <img class="card-img" src="img/sumidero.jpg" alt="Ca&ntilde;&oacute;n del Sumidero">
<a class="info" href="grijalva/"> <span class="photo-credit">Foto: Gabriela L&oacute;pez</span>
<img class="hoverimg mx-auto d-block" src="img/cuenca.png" width="325px"> <div class="overlay">
<span class="btn btn-primary hoverbtn" href="grijalva/" role="button">Visitar <a class="info" href="grijalva/">
sitio</span> <img class="hoverimg mx-auto d-block" src="img/cuenca.png" width="325px">
<br><br> <span class="btn btn-primary hoverbtn" href="grijalva/" role="button">Visitar
</a> sitio</span>
<br><br>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="card mb-4 shadow-sm"> <div class="card mb-4 shadow-sm">
<div class="card-header"> <div class="card-header">
<h4 class="my-0 font-weight-normal">Riesgo</h4> <h4 class="my-0 font-weight-normal">Riesgo</h4>
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="hovereffect zoom"> <div class="hovereffect zoom">
<img class="card-img" src="img/inundacion.jpg" alt="Ca&ntilde;&oacute;n del Sumidero"> <img class="card-img" src="img/inundacion.jpg" alt="Ca&ntilde;&oacute;n del Sumidero">
<span class="photo-credit">Foto: Felinto C&oacute;rdoda</span> <span class="photo-credit">Foto: Felinto C&oacute;rdoda</span>
<div class="overlay"> <div class="overlay">
<a class="info" href="riesgos/"> <a class="info" href="riesgos/">
<img class="hoverimg mx-auto d-block" src="img/cuenca.png" width="325px"> <img class="hoverimg mx-auto d-block" src="img/cuenca.png" width="325px">
<span class="btn btn-primary hoverbtn" href="grijalva/" role="button">Visitar <span class="btn btn-primary hoverbtn" href="grijalva/" role="button">Visitar
sitio</span> sitio</span>
<br><br> <br><br>
</a> </a>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="card mb-4 shadow-sm"> <div class="row justify-content-md-center">
<div class="card-header"> <div class="col-6">
<h4 class="my-0 font-weight-normal">Corredor Metropolitano Centro Pa&iacute;s</h4>
</div> <div class="card mb-4 shadow-sm">
<div class="card-body"> <div class="card-header">
<div class="hovereffect zoom"> <h4 class="my-0 font-weight-normal">Corredor Metropolitano Centro Pa&iacute;s</h4>
<img class="card-img" src="img/centropais.jpg" alt="CMCP"> </div>
<span class="photo-credit">Foto: Lucy Nieto</span> <div class="card-body">
<div class="overlay"> <div class="hovereffect zoom">
<a class="info" href="centropais/"> <img class="card-img" src="img/centropais.jpg" alt="CMCP">
<img class="hoverimg mx-auto d-block" src="img/cmcp.png" width="325px"> <span class="photo-credit">Foto: Lucy Nieto</span>
<span class="btn btn-primary hoverbtn" href="centropais/" role="button">Visitar <div class="overlay">
sitio</span> <a class="info" href="centropais/">
<br><br> <img class="hoverimg mx-auto d-block" src="img/cmcp.png" width="325px">
</a> <span class="btn btn-primary hoverbtn" href="centropais/" role="button">Visitar
sitio</span>
<br><br>
</a>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
<footer class="pt-4 my-md-5 pt-md-5 border-top"> <footer class="pt-4 my-md-5 pt-md-5 border-top">
<div class="row"> <div class="row">
<div class="col-12 col-md"> <div class="col-12 col-md">
<img class="mb-2" src="img/geoint.png" alt="GeoInt" height="70px"> <img class="mb-2" src="img/geoint.png" alt="GeoInt" height="70px">
<small class="d-block mb-3 text-muted">&copy; 2019</small> <small class="d-block mb-3 text-muted">&copy; 2019</small>
</div> </div>
<div class="col-6 col-md"> <div class="col-6 col-md">
<h5>Features</h5> <h5>Features</h5>
<ul class="list-unstyled text-small"> <ul class="list-unstyled text-small">
<li><a class="text-muted" href="#">Cool stuff</a></li> <li><a class="text-muted" href="#">Cool stuff</a></li>
<li><a class="text-muted" href="#">Random feature</a></li> <li><a class="text-muted" href="#">Random feature</a></li>
<li><a class="text-muted" href="#">Team feature</a></li> <li><a class="text-muted" href="#">Team feature</a></li>
<li><a class="text-muted" href="#">Stuff for developers</a></li> <li><a class="text-muted" href="#">Stuff for developers</a></li>
<li><a class="text-muted" href="#">Another one</a></li> <li><a class="text-muted" href="#">Another one</a></li>
<li><a class="text-muted" href="#">Last time</a></li> <li><a class="text-muted" href="#">Last time</a></li>
</ul> </ul>
</div> </div>
<div class="col-6 col-md"> <div class="col-6 col-md">
<h5>Resources</h5> <h5>Resources</h5>
<ul class="list-unstyled text-small"> <ul class="list-unstyled text-small">
<li><a class="text-muted" href="#">Resource</a></li> <li><a class="text-muted" href="#">Resource</a></li>
<li><a class="text-muted" href="#">Resource name</a></li> <li><a class="text-muted" href="#">Resource name</a></li>
<li><a class="text-muted" href="#">Another resource</a></li> <li><a class="text-muted" href="#">Another resource</a></li>
<li><a class="text-muted" href="#">Final resource</a></li> <li><a class="text-muted" href="#">Final resource</a></li>
</ul> </ul>
</div>
<div class="col-6 col-md">
<h5>Acerca de</h5>
<ul class="list-unstyled text-small">
<li><a class="text-muted" href="#">Equipo</a></li>
<li><a class="text-muted" href="#">Desarrollo</a></li>
<li><a class="text-muted" href="#">Tecnolog&iacute;a</a></li>
<li><a class="text-muted" href="#">Terms</a></li>
</ul>
</div>
</div> </div>
</footer> <div class="col-6 col-md">
<h5>Acerca de</h5>
<ul class="list-unstyled text-small">
<li><a class="text-muted" href="#">Equipo</a></li>
<li><a class="text-muted" href="#">Desarrollo</a></li>
<li><a class="text-muted" href="#">Tecnolog&iacute;a</a></li>
<li><a class="text-muted" href="#">Terms</a></li>
</ul>
</div>
</div>
</footer>
</div> </div>
</body> </body>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment