From efaa1ab23337ff1d38c976b2f7f60baf877003ef Mon Sep 17 00:00:00 2001
From: kleper <kleper@kleper.net>
Date: Fri, 10 Mar 2017 21:17:05 -0500
Subject: [PATCH] Landingpage stats

---
 landingpage_a.html                    | 152 ++++++++++++--------------
 temas/landingpage/css/landingpage.css |  57 +++++++++-
 2 files changed, 120 insertions(+), 89 deletions(-)

diff --git a/landingpage_a.html b/landingpage_a.html
index 4a36f4d..a8f326f 100644
--- a/landingpage_a.html
+++ b/landingpage_a.html
@@ -709,7 +709,6 @@
                                     </div>
                                 </section>
                                 <!-- FIN Proyectos -->
-
                                 <!-- SERVICIOS -->
                                 <section class='container-fluid' id='servicios'>
                                     <div class="col-sm-8 col-sm-offset-2 text-center">
@@ -779,58 +778,57 @@
                                 </section>
                                 <!--           Fin sección servicios -->
                                 <!-- Carrusel APIS Open Data -->
-          <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
-            <!-- Indicators -->
-            <ol class="carousel-indicators">
-              <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
-              <li data-target="#carousel-example-generic" data-slide-to="1"></li>
-              <li data-target="#carousel-example-generic" data-slide-to="2"></li>
-            </ol>
-            <!-- Wrapper for slides -->
-            <div class="carousel-inner" role="listbox">
-              <div class="item active">
-                <img src="https://cldup.com/VvvJCGnUXw.png" alt="portal_open_data">
-                <div class="carousel-caption">
-                  <h3>Portal de Open Data</h3>
-                  <p>Multiples opciones de manejo de datos con estandares mundiales de Open Data</p>
-                </div>
-              </div>
-              <div class="item">
-                <img src="https://cldup.com/cwy7fakMG3.png" alt="apis_json">
-                <div class="carousel-caption">
-                  <h3>APIS JSON</h3>
-                  <p>api json y api json simple para integraciones y programación</p>
-                </div>
-              </div>
-              <div class="item">
-                <img src="https://cldup.com/e2fps1PMMd.png" alt="apis_json">
-                <div class="carousel-caption">
-                  <h3>Visualizaciones</h3>
-                  <p>Mapas y visualizaciónes básicas</p>
-                </div>
-              </div>
-            </div>
-            <!-- Controls -->
-            <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
-              <span class="glyphicon glyphicon-chevron-left" aria-hidden="false"></span>
-              <span class="sr-only">Previous</span>
-            </a>
-            <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
-              <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
-              <span class="sr-only">Next</span>
-            </a>
-          </div>
-          <!-- FIN Carrusel -->
+                                <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
+                                    <!-- Indicators -->
+                                    <ol class="carousel-indicators">
+                                        <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
+                                        <li data-target="#carousel-example-generic" data-slide-to="1"></li>
+                                        <li data-target="#carousel-example-generic" data-slide-to="2"></li>
+                                    </ol>
+                                    <!-- Wrapper for slides -->
+                                    <div class="carousel-inner" role="listbox">
+                                        <div class="item active">
+                                            <img src="https://cldup.com/VvvJCGnUXw.png" alt="portal_open_data">
+                                            <div class="carousel-caption">
+                                                <h3>Portal de Open Data</h3>
+                                                <p>Multiples opciones de manejo de datos con estandares mundiales de Open Data</p>
+                                            </div>
+                                        </div>
+                                        <div class="item">
+                                            <img src="https://cldup.com/cwy7fakMG3.png" alt="apis_json">
+                                            <div class="carousel-caption">
+                                                <h3>APIS JSON</h3>
+                                                <p>api json y api json simple para integraciones y programación</p>
+                                            </div>
+                                        </div>
+                                        <div class="item">
+                                            <img src="https://cldup.com/e2fps1PMMd.png" alt="apis_json">
+                                            <div class="carousel-caption">
+                                                <h3>Visualizaciones</h3>
+                                                <p>Mapas y visualizaciónes básicas</p>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <!-- Controls -->
+                                    <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
+                                        <span class="glyphicon glyphicon-chevron-left" aria-hidden="false"></span>
+                                        <span class="sr-only">Previous</span>
+                                    </a>
+                                    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
+                                        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
+                                        <span class="sr-only">Next</span>
+                                    </a>
+                                </div>
+                                <!-- FIN Carrusel -->
                                 <!--          PRECIOS -->
                                 <section class="container-fluid" id="precios">
                                     <div class="col-sm-8 col-sm-offset-2 text-center">
                                         <h1>Precios</h1>
                                         <p class="lead">Tupale es una herramienta de código abierto, puede ser descargada e implementada libremente. Los valores propuestos cubren servicios de administración, hosting, reinversión en desarrollo, capacitación en uso y manejo.</p>
                                     </div>
-                                    <div class="container">
+                                    <div class="container col-md-12">
                                         <div class="row">
-                                            <!-- item -->
-                                            <div class="col-md-3">
+                                            <div class="col-sm-6 col-md-3">
                                                 <div class="panel panel-black">
                                                     <div class="panel-heading">
                                                         <h3 class="text-center">INSTANCIA DE TUPALE</h3>
@@ -856,9 +854,7 @@
                                                     <div class="panel-footer"> <a class="btn btn-lg btn-block btn-danger" href="#">Contáctanos</a> </div>
                                                 </div>
                                             </div>
-                                            <!-- /item -->
-                                            <!-- item -->
-                                            <div class="col-md-3">
+                                            <div class="col-sm-6 col-md-3">
                                                 <div class="panel panel-black">
                                                     <div class="panel-heading">
                                                         <h3 class="text-center">TALLER BÁSICO</h3>
@@ -888,9 +884,7 @@
                                                     <div class="panel-footer"> <a class="btn btn-lg btn-block btn-danger" href="#">CONTÁCTANOS</a> </div>
                                                 </div>
                                             </div>
-                                            <!-- /item -->
-                                            <!-- item -->
-                                            <div class="col-md-3">
+                                            <div class="col-sm-6 col-md-3">
                                                 <div class="panel panel-black">
                                                     <div class="panel-heading">
                                                         <h3 class="text-center">TALLER MEDIO</h3>
@@ -901,7 +895,7 @@
                                                     </div>
                                                     <ul class="list-group list-group-flush text-left">
                                                         <li class="list-group-item">
-                                                            <span class="glyphicon glyphicon-ok-sign"></span> TALLER BÁSICO</span>
+                                                            <span class="glyphicon glyphicon-ok-sign"></span> TALLER BÁSICO
                                                         </li>
                                                         <li class="list-group-item">
                                                             <span class="glyphicon glyphicon-ok-sign"></span> Uso de campos especiales
@@ -919,10 +913,7 @@
                                                     <div class="panel-footer"> <a class="btn btn-lg btn-block btn-danger" href="#">CONTÁCTANOS</a> </div>
                                                 </div>
                                             </div>
-                                            <!-- /item -->
-                                            
-                                            <!-- item -->
-                                            <div class="col-md-3">
+                                            <div class="col-sm-6 col-md-3">
                                                 <div class="panel panel-black">
                                                     <div class="panel-heading">
                                                         <h3 class="text-center">TALLER AVANZADO</h3>
@@ -933,7 +924,7 @@
                                                     </div>
                                                     <ul class="list-group list-group-flush text-left">
                                                         <li class="list-group-item">
-                                                            <span class="glyphicon glyphicon-ok-sign"></span> TALLER BÁSICO </span> TALLER MEDIO </span>
+                                                            <span class="glyphicon glyphicon-ok-sign"></span> TALLER BÁSICO + TALLER MEDIO
                                                         </li>
                                                         <li class="list-group-item">
                                                             <span class="glyphicon glyphicon-ok-sign"></span> Creación de usuarios
@@ -948,7 +939,6 @@
                                                     <div class="panel-footer"> <a class="btn btn-lg btn-block btn-danger" href="#">Contáctanos</a> </div>
                                                 </div>
                                             </div>
-                                            <!-- /item -->
                                         </div>
                                     </div>
                                 </section>
@@ -1026,8 +1016,8 @@
                                         <div class="row">
                                             <div class="col-sm-4 col-lg-4">
                                                 <img class="img-circle" src="temas/landingpage/images/equipo_manada.png" alt="manada malinois" width="140" height="140">
-                                                <h2>La manada malinois</h2>
-                                                <p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Praesent commodo cursus magna.
+                                                <h2>La manada Malinois</h2>
+                                                <p>Donec sed odio dui. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.
                                                 </p>
                                                 <p><a class="btn btn-default" href="#" role="button">Conocer más</a></p>
                                             </div>
@@ -1066,30 +1056,22 @@
                                 <section class="container-fluid" id="visitas">
                                     <div class="col-sm-8 col-sm-offset-2">
                                         <div class="text-center">
-                                            <h1>Estadísticas de visita Tupale</h1>
+                                            <h1 class="titulo">Estadísticas de visita Tupale</h1>
                                         </div>
                                     </div>
-                                    <div class="container col-lg-8 col-md-offset-2 text-center">
+                                    <div class="container col-sm-8 col-lg-8 text-center">
                                         <ul class="nav nav-tabs">
-                                            <li class="active"><a href="#real-time" data-toggle="tab" aria-expanded="true">Tiempo Real</a></li>
-                                            <li ><a href="#semanas" data-toggle="tab" aria-expanded="true">Ultimas semanas</a></li>
-                                            <li ><a href="#dias" data-toggle="tab" aria-expanded="true">Ultimos días</a></li>
+                                            <li><a href="https://stats.tupale.co/index.php?module=Widgetize&action=iframe&widget=1&moduleToWidgetize=Live&actionToWidgetize=getSimpleLastVisitCount&idSite=1&period=day&date=yesterday&disableLink=1&widget=1" target="search_iframe">Tiempo Real</a></li>
+                                            <li >
+                                                <a class="active" href="https://stats.tupale.co/index.php?module=Widgetize&action=iframe&forceView=1&viewDataTable=graphEvolution&widget=1&moduleToWidgetize=VisitsSummary&actionToWidgetize=getEvolutionGraph&idSite=1&period=day&date=yesterday&disableLink=1&widget=1" target="search_iframe">Últimas Semanas</a>
+                                            </li>
+                                            <li >
+                                                <a href="https://stats.tupale.co/index.php?module=Widgetize&action=iframe&widget=1&moduleToWidgetize=VisitTime&actionToWidgetize=getByDayOfWeek&idSite=1&period=month&date=yesterday&disableLink=1&widget=1" target="search_iframe">Ultimos días</a>
+                                            </li>
                                         </ul>
-                                        <div id="myTabContent" class="tab-content">
-                                            <div class="tab-pane fade active in" id="real-time">
-                                                <div class="embed-responsive embed-responsive-16by9">
-                                                    <iframe class="embed-responsive-item" id="real-time" scrolling="no" src="https://stats.tupale.co/index.php?module=Widgetize&action=iframe&widget=1&moduleToWidgetize=Live&actionToWidgetize=getSimpleLastVisitCount&idSite=1&period=day&date=yesterday&disableLink=1&widget=1"></iframe>
-                                                </div>
-                                            </div>
-                                            <div class="tab-pane fade" id="semanas">
-                                                <div class="embed-responsive embed-responsive-16by9">
-                                                    <iframe scrolling="no" class="embed-responsive-item" src="https://stats.tupale.co/index.php?module=Widgetize&action=iframe&forceView=1&viewDataTable=graphEvolution&widget=1&moduleToWidgetize=VisitsSummary&actionToWidgetize=getEvolutionGraph&idSite=1&period=week&date=yesterday&disableLink=1&widget=1"></iframe>
-                                                </div>
-                                            </div>
-                                            <div class="tab-pane fade" id="dias">
-                                                <div class="embed-responsive embed-responsive-16by9">
-                                                    <iframe scrolling="no" class="embed-responsive-item" src="https://stats.tupale.co/index.php?module=Widgetize&action=iframe&widget=1&moduleToWidgetize=VisitTime&actionToWidgetize=getByDayOfWeek&idSite=1&period=month&date=yesterday&disableLink=1&widget=1"></iframe>
-                                                </div>
+                                        <div class="tab-pane fade active in" id="real-time">
+                                            <div class="embed-responsive embed-responsive-16by9">
+                                                <iframe scrolling="no" src="https://stats.tupale.co/index.php?module=Widgetize&action=iframe&forceView=1&viewDataTable=graphEvolution&widget=1&moduleToWidgetize=VisitsSummary&actionToWidgetize=getEvolutionGraph&idSite=1&period=day&date=yesterday&disableLink=1&widget=1" width="100%" height="200%" name="search_iframe"></iframe>
                                             </div>
                                         </div>
                                     </div>
@@ -1143,8 +1125,8 @@
                                                         </div>
                                                         <div class="form-group">
                                                             <div class="input-group">
-                                                                <span class="input-group-addon"><i class="fa fa-file-text" aria-hidden="true"></i></span>
-                                                                <textarea class="form-control" placeholder="Escribenos" rows="2" id="comment"></textarea>
+                                                                <span class="input-group-addon"><i class="fa fa-file-text fa-lg" aria-hidden="true"></i></span>
+                                                                <textarea class="form-control" placeholder="Escríbenos" rows="2" id="comment"></textarea>
                                                                 <span class="input-group-btn">
                                                                     <button class="btn btn-danger" type="button">Enviar</button>
                                                                 </span>
@@ -1152,12 +1134,12 @@
                                                         </div>
                                                     </div>
                                                     </div> <!-- end widget1 -->
-                                                    <div class="col-sm-12 col-md-4">
+                                                    <div class="col-sm-6 col-md-4">
                                                         <div id="search-3" class="widget widgetFooter widget_search"><h4 class="widgettitle">Busca en el sitio:</h4>
                                                             <div class="form-group">
                                                                 <label class="control-label">Quieres buscar en Tupale</label>
                                                                 <div class="input-group">
-                                                                    <span class="input-group-addon">¿Que buscas?</span>
+                                                                    <span class="input-group-addon">¿Qué buscas?</span>
                                                                     <input class="form-control" placeholder="Palabra clave" type="text">
                                                                     <span class="input-group-btn">
                                                                         <button class="btn btn-danger" type="button">Buscar</button>
diff --git a/temas/landingpage/css/landingpage.css b/temas/landingpage/css/landingpage.css
index ed42dc8..eb36238 100644
--- a/temas/landingpage/css/landingpage.css
+++ b/temas/landingpage/css/landingpage.css
@@ -35,6 +35,10 @@ p{
 
 }
 
+ul, ol {
+    padding-left: 0px;
+}
+
 .container-principal{
   padding-left: 0px;
   padding-right: 0px;
@@ -68,6 +72,7 @@ p{
 
 }
 
+
 /* USING BOOTSTRAP 3.0.3 */
 
 /*NAVBAR BRAND*/
@@ -272,16 +277,43 @@ filter: grayscale(0);
   padding-bottom: 50px;
 }
 
+.titulo{
+  padding-bottom: 50px;
+}
 /*Estadisticas*/
 
-.nav > li > a {
-    color: red;
+.embed-responsive-16by9 {
+    padding-bottom: 36.25% !important;
+}
+
+.nav-tabs {
+  background-color: black;
+}
+
+.nav-tabs > li > a {
+
+    border-right: 1px solid white;
+    border-radius: 0 0 0 0 ;
+    margin-right: 0px !important;
+    margin-top: 7px;
+    text-transform: uppercase;
+    color: white;
 }
 
 .nav-tabs > li > a:hover {
-    background-color: #333333;
+    background-color: #ff0000;
 }
 
+.nav > li > a:focus {
+
+    background-color: white;
+    color: black;
+    
+
+}
+
+
+
 .v-center {
     padding-top:10%;
     font-size:30px;
@@ -387,6 +419,9 @@ filter: grayscale(0);
 #home {
     padding-top:20px !important;  
 }
+.embed-responsive-16by9 {
+    padding-bottom: 49.25% !important;
+}
 
 }
 
@@ -528,11 +563,25 @@ margin-top: 50px;
 }
 
 .embed-responsive-16by9 {
-    padding-bottom: 134.25%;
+    padding-bottom: 69.25%;
 }
+.box_proyectos {
+  display: inline-grid;
+}
+
 
 }
 /*fin móbiles*/
 
+@media (min-width: 767px){
+  .col-sm-8 {
+  float: none !important;
+}
+
+.embed-responsive-16by9 {
+    padding-bottom: 89.25%;
+}
+
+}