qwerty/tupali
4
1
Fork 1
Code Issues 25 Pull Requests Releases Wiki Activity

Landing page cc

Browse Source
This commit is contained in:
kleper 2017-03-07 08:52:38 -05:00
parent 4e304354f6
commit 1d5f58ca74
2 changed files with 1024 additions and 803 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

236
landingpage_a.html
View File

@ -284,7 +284,7 @@
document.oncopy = addLink;
</script>
</head>
<body data-spy='scroll' data-target='.navbar #toc' data-offset='50'>
<body data-spy="scroll" data-target=".navbar" data-offset="50">
<!-- <div class="text-center">
<a href="frida.php?redirect" >
<img class='center-block img img-responsive' src='https://tupale.co/milfs/images/frida.gif'>
@ -363,51 +363,24 @@
</div><!--/container-->
</section>
<!-- END #fh5co-offcanvas -->
<header id="fh5co-header">
<div class="row">
<div class='pull-right'>
<a href="#" class="js-fh5co-nav-toggle fh5co-nav-toggle"><i></i></a>
<ul class="fh5co-social list-inline intro-social-buttons ">
<li><a href="https://twitter.com/tupaleco"><i class="fa fa-twitter"></i></a></li>
<li><a href="https://www.facebook.com/Qwerty-co-146226688795185"><i class="fa fa-facebook"></i></a></li>
<li>
<div class=' btn btn-default btn-xs' onclick="xajax_milfs_session('116','707','708','','');">Login</div>
</li>
</ul>
</div>
<div id='meta_cabecera' class="col-lg-12 col-md-12 ">
<div class="row">
<div class="col-md-12 text-center">
<h1 id="fh5co-logo" data-toc-skip ><a href="./">Tupale</a></h1>
<div id='slogan_landingpage'><p>Te invitamos a usar nuestra plataforma, puedes crear tus campañas y causas, recuerda que Toda causa se gana
<section class='container-fluid' id='campana'>
<div class="col-sm-8 col-sm-offset-2 text-center">
<h1>Tupale</h1>
<div id='slogan_landingpage'><p class='lead'>Te invitamos a usar nuestra plataforma, puedes crear tus campañas y causas, recuerda que Toda causa se gana
</p></div>
</div>
<div id="asistento" class="col-md-12 text-center">
<a href='?asistento' class='btn btn-success'>Quiero crear una campaña </a>
<a href='?asistento' class='btn btn-danger'>Quiero crear una campaña </a>
</div>
<div class="col-md-12">
<div class='center-block'>
</div>
</div>
</div>
</div>
</header>
<div class="row fh5co-post-entry">
</section>
<!-- PROYECTOS -->
<section class='container-fluid' id='proyectos'>
<div class='col-sm-8 col-sm-offset-2 text-center intro'>
<div class='col-sm-8 col-sm-offset-2 text-center'>
<h1>Proyectos</h1>
<p class='lead'>Conoce los proyectos que usan Tupale.co para la implementación de sus herramientas, selecciona para conocer más</p>
</div>
@ -673,7 +646,6 @@
</a>
</div>
</div>
<div class='proyecto' title=''>
<div class='div_proyecto'>
<a href='e50' data-toggle='modal' data-target='#myModal'>
@ -735,10 +707,200 @@
</div>
</div>
</div>
</div>
</section>
<!-- FIN Proyectos -->
<section class='container-fluid' id='servicios'>
<div class="col-sm-8 col-sm-offset-2 text-center">
<h1>Servicios</h1>
<p class='lead'>Integramos a Tupale herramientas y servicios de código abierto que complementan el flujo de proyectos y que además puedes integrar a los procesos actuales de tu grupo de trabajo.
</p>
</div>
<div class="container">
<div class="row">
<div class="col-sm-6 col-md-3">
<div class="thumbnail">
<img src="http://www.consumer.es/imgs/2016/12/comprar-online-seguridad-consejos.jpg" alt="...">
<div class="caption">
<h3>RAW</h3>
<p>Convertimos los datos en visualizaciones con RAW. Tu tambien puedes crear tus visualizaciones de forma rápida y práctica, emplea la API simple de Tupale para experimentar con esta herramienta.</p>
<p>
<a href="http://rawgraphs.io/" class="btn btn-default " role="button">Fuente</a>
<a href="https://raw.tupale.co/" class="btn btn-danger pull-right" role="button">En tupale</a></p>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="thumbnail">
<img src="temas/landingpage/images/pad_servicios.jpg" alt="servicio_pad">
<div class="caption">
<h3>PAD</h3>
<p>Escribimos y compartimos ideas en textos digitales y todo comienza a suceder . Escribe tu tambien de forma colaborativa, crea documentos con tu equipo en tiempo real desde cualquier lugar.</p>
<p>
<a href="http://etherpad.org/" class="btn btn-default" role="button">Fuente</a>
<a href="https://pad.tupale.co/" class="btn btn-danger pull-right" role="button">En Tupale</a>
</p>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="thumbnail">
<img src="http://www.consumer.es/imgs/2016/06/compraenredessociales-sophia-portada1-750.png" alt="...">
<div class="caption">
<h3>CALC</h3>
<p>Las estructuras de datos que alimentan las aplicaciones en Tupale toman vida con CALC. Comienza, actualiza y comparte hojas de calculo en linea, desde cualquier lugar en tiempo real.</p>
<p>
<a href="https://ethercalc.net/" class="btn btn-default" role="button">Fuente</a>
<a href="https://calc.tupale.co/" class="btn btn-danger pull-right" role="button">En Tupale</a>
</p>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="thumbnail">
<img src="temas/landingpage/images/piwik_servicios.jpg" alt="servicio_piwik">
<div class="caption">
<h3>PIWIK</h3>
<p>¿Quien accede y visita tu sitio? Usamos PIWIK para la consulta de uso de Tupale.co y los diferentes proyectos alojados en Tupale. Tambien puedes implementarla para cualquier sitio</p>
<a href="https://stats.tupale.co" class="btn btn-default" role="button">Fuente</a>
<a href="https://piwik.org/" class="btn btn-danger pull-right" role="button">En Tupale</a></p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Fin sección servicios -->
<!-- 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="row">
<!-- item -->
<div class="col-md-3">
<div class="panel panel-black">
<div class="panel-heading">
<h3 class="text-center">INSTANCIA DE TUPALE</h3>
<p class="text-center">VALOR ANUAL</p>
</div>
<div class="panel-body text-center">
<p class="lead" style="font-size:30px"><strong>$250 USD</strong></p>
</div>
<ul class="list-group list-group-flush text-left">
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Aplicaciones ilimitadas
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Usuarios ilimitados
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Personalización visual básica y plantillas gráficas iniciales
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Redirección o integración con dominio o subdominio a Tupale.co.
</li>
</ul>
<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="panel panel-black">
<div class="panel-heading">
<h3 class="text-center">TALLER BÁSICO</h3>
<p class="text-center">VALOR PARA 6 PERSONAS</p>
</div>
<div class="panel-body text-center">
<p class="lead" style="font-size:30px"><strong>$240 USD</strong></p>
</div>
<ul class="list-group list-group-flush text-left">
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Creación de modelo de datos
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Creación de usuarios
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Creación de aplicacioes
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Creación y modificación de campos
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Guia básica de plantillas
</li>
</ul>
<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="panel panel-black">
<div class="panel-heading">
<h3 class="text-center">TALLER MEDIO</h3>
<p class="text-center">VALOR PARA 6 PERSONAS</p>
</div>
<div class="panel-body text-center">
<p class="lead" style="font-size:30px"><strong>$480 USD</strong></p>
</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 class="glyphicon glyphicon-plus"></span>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Uso de campos especiales
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Creación de mapas
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Guia avanzada de plantillas y parametrización
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Generación de informes
</li>
</ul>
<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="panel panel-black">
<div class="panel-heading">
<h3 class="text-center">TALLER AVANZADO</h3>
<p class="text-center">VALOR PARA 6 PERSONAS</p>
</div>
<div class="panel-body text-center">
<p class="lead" style="font-size:30px"><strong>$960 USD</strong></p>
</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 class="glyphicon glyphicon-plus"></span> TALLER MEDIO <span class="glyphicon glyphicon-plus"></span>
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Creación de usuarios
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Uso básico de las API para visualizacioens
</li>
<li class="list-group-item">
<span class="glyphicon glyphicon-ok-sign"></span> Exportación de datos a diferentes formatos
</li>
</ul>
<div class="panel-footer"> <a class="btn btn-lg btn-block btn-danger" href="#">Contáctanos</a> </div>
</div>
</div>
<!-- /item -->
</div>
</div>
</section>
<div class='container-fluid'> </div>
<footer id="fh5co-footer">
<small>

67
temas/landingpage/css/landingpage.css
View File

@ -6,7 +6,7 @@ html,body {
}
body {
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 1.42857143;
color: #333;
@ -34,6 +34,33 @@ p{
margin: 0 0 10px;
}
.btn {
margin-right: 0px;
}
.btn-danger{
font-family:"Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
display: inline-block;
font-weight: normal;
text-align: center;
font-size: 13px;
line-height: 1.846;
}
.btn-default{
font-family:"Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
display: inline-block;
font-weight: normal;
text-align: center;
font-size: 13px;
line-height: 1.846;
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active {
background: #ff0000 !important;
border-color: #ff0000 !important;
}
/* USING BOOTSTRAP 3.0.3 */
@ -62,7 +89,7 @@ transition: all 0.3s ease;
}
/* textos menú*/
a {
.navbar a {
font-size: 18px;
padding-bottom: 40px !important;
padding-top: 40px !important;
@ -171,6 +198,9 @@ filter: grayscale(0);
section {
padding-top:110px;
padding-bottom:70px;
position: relative;
height: 100%;
overflow-y: scroll;
}
#campana{
@ -209,6 +239,36 @@ section {
.collapse.in {
margin-top: 20px;
}
/*precios*/
.panel-black .panel-heading{
background-color: black;
color: white;
}
.panel {
transition: padding 0.5s;
-moz-transition: padding 0.5s; /* Firefox 4 */
-webkit-transition: padding 0.5s; /* Safari and Chrome */
-o-transition: padding 0.5s; /* Opera */
-ms-transition:padding 0.5s; /* IE9 (maybe) */
}
.panel:hover {
padding:10px;
}
.panel-black:hover .panel-heading{
background-color: #ff0000;
}
.panel-black:hover .glyphicon-ok-sign{
color: green;
/* FOOTER*/
@ -353,7 +413,7 @@ section {
/* textos menú*/
a {
.navbar a {
font-size: 23px;
padding-bottom: 23px !important;
padding-top: 23px !important;
@ -431,7 +491,6 @@ margin-top: 50px;
}
}
/*fin móbiles*/