v2.0.2-beta
This commit is contained in:
@ -8,7 +8,7 @@
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.7/semantic.min.css" integrity="sha512-g/MzOGVPy3OQ4ej1U+qe4D/xhLwUn5l5xL0Fa7gdC258ZWVJQGwsbIR47SWMpRxSPjD0tfu/xkilTy+Lhrl3xg==" crossorigin="anonymous" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet">
|
||||
|
||||
|
||||
<link rel="icon" type="image/png" href="./assets/images/favicon.png" />
|
||||
<link rel="stylesheet" type="text/css" href="./assets/styles/main.min.css" />
|
||||
</head>
|
||||
|
||||
@ -31,7 +31,7 @@
|
||||
</div>
|
||||
<div class="column">
|
||||
<div class="ui center aligned basic segment">
|
||||
<i class="angle icon"></i>
|
||||
<i class="angle font-icon"></i>
|
||||
<br />
|
||||
Ángulo preciso de inclinación para usar en conferencias
|
||||
</div>
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
<div class="ui grid">
|
||||
<div class="doubling two columns row">
|
||||
<div class="content column">
|
||||
<i class="chile icon"></i>
|
||||
<i class="chile font-icon"></i>
|
||||
<br />
|
||||
Diseñado y fabricado en Chile
|
||||
<br /><br />
|
||||
|
||||
@ -44,7 +44,7 @@
|
||||
<div class="titulo">
|
||||
COTIZA CON NOSOTROS
|
||||
</div>
|
||||
<form>
|
||||
<form class="ui form">
|
||||
<div class="row">
|
||||
<div class="input">
|
||||
LOGO
|
||||
|
||||
@ -3,16 +3,9 @@
|
||||
<div class="titulo">
|
||||
CLIENTES FELICES
|
||||
</div>
|
||||
<div class="ui grid">
|
||||
<div class="three columns row">
|
||||
<div class="column">
|
||||
<div class="testimonio ui card"></div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<div class="testimonio ui card"></div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<div class="testimonio ui card"></div>
|
||||
<div class="ui center aligned grid">
|
||||
<div class="one columns row">
|
||||
<div class="ui three center aligned cards testimonios">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
<section id="contacto">
|
||||
<div class="background"></div>
|
||||
<div class="ui container">
|
||||
<div class="ui stackable grid">
|
||||
<div class="column">
|
||||
@ -20,17 +21,17 @@
|
||||
<a href="mailto:contacto@3dstand.cl">
|
||||
contacto@3dstand.cl
|
||||
</a>
|
||||
<br />
|
||||
<br /><br />
|
||||
<i class="ui icons">
|
||||
<a href="http://instagram.com/stand">
|
||||
<i class="ui icons">
|
||||
<i class="circle icon"></i>
|
||||
<i class="large circle icon"></i>
|
||||
<i class="instagram icon"></i>
|
||||
</i>
|
||||
</a>
|
||||
<a href="http://facebook.com/stand">
|
||||
<i class="ui icons">
|
||||
<i class="circle icon"></i>
|
||||
<i class="large circle icon"></i>
|
||||
<i class="facebook f icon"></i>
|
||||
</i>
|
||||
</a>
|
||||
@ -50,10 +51,16 @@
|
||||
scing elit, sed do eiusmod tempor incididunt ut labore et
|
||||
dolore magna aliqua. Ut enim ad minim veniam, quis nosventas
|
||||
</div>
|
||||
<form class="ui form" id="contacto">
|
||||
<input type="text" name="nombre" placeholder="NOMBRE" />
|
||||
<input type="text" name="mail" placeholder="E-MAIL" />
|
||||
<textarea name="mensaje" placeholder="MENSAJE"></textarea>
|
||||
<form class="ui form" id="contacto_form">
|
||||
<div class="row">
|
||||
<input type="text" name="nombre" placeholder="NOMBRE" />
|
||||
</div>
|
||||
<div class="row">
|
||||
<input type="text" name="mail" placeholder="E-MAIL" />
|
||||
</div>
|
||||
<div class="row">
|
||||
<textarea name="mensaje" placeholder="MENSAJE"></textarea>
|
||||
</div>
|
||||
<button class="ui button">ENVIAR</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
@ -273,7 +273,7 @@ let cotiza_form = {
|
||||
}
|
||||
}
|
||||
let conversemos_form = {
|
||||
elem: $('#contacto'),
|
||||
elem: $('#contacto_form'),
|
||||
setup: function() {
|
||||
this.elem.submit((e) => {
|
||||
e.preventDefault()
|
||||
@ -302,38 +302,91 @@ let conversemos_form = {
|
||||
|
||||
let testimonios = {
|
||||
testimonios: [
|
||||
"Este soporte que compré en @Stand-cl me cambió la vida, me sirve para el teléfono y el ipad, y ya no tengo que andar acomodando los aparatos en cualquier parte para las videollamadas",
|
||||
"Siiii todo mi gusto.. me encantó lo completo que es. Gracias",
|
||||
"Está super cool se ve de buena calidad",
|
||||
"Llego el mío, y es excelente, estoy feliz con mi compra",
|
||||
"Hola!!Me llegó el pedido, Muchas gracias muy bello. Me salvaste la vida",
|
||||
"Perfecto el producto, funciona impecable, muchas gracias",
|
||||
"Están bacanes! muchísimas gracias. Le regalé a mis viejos y lo aman",
|
||||
"Hola! Quería decirte que me encantaron los soportes, Muy útiles!",
|
||||
"Compré 3 y olvidé decirte que los encontré geniales! Me encantaron",
|
||||
"Diseño simple y funcional, minimalista y excelente precio, despacho súper Rápido.. gracias!"
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Este soporte que compré en @Stand-cl me cambió la vida, me sirve para el teléfono y el ipad, y ya no tengo que andar acomodando los aparatos en cualquier parte para las videollamadas"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Siiii todo mi gusto.. me encantó lo completo que es. Gracias"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Está super cool se ve de buena calidad"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Llego el mío, y es excelente, estoy feliz con mi compra"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Hola!!Me llegó el pedido, Muchas gracias muy bello. Me salvaste la vida"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Perfecto el producto, funciona impecable, muchas gracias"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Están bacanes! muchísimas gracias. Le regalé a mis viejos y lo aman"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Hola! Quería decirte que me encantaron los soportes, Muy útiles!"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Compré 3 y olvidé decirte que los encontré geniales! Me encantaron"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Diseño simple y funcional, minimalista y excelente precio, despacho súper Rápido.. gracias!"
|
||||
}
|
||||
],
|
||||
elem: $('#felices .testimonios'),
|
||||
elem: $('#testimonios'),
|
||||
page: 0,
|
||||
setup: function() {
|
||||
if (this.amount != 3) {
|
||||
this.elem.find('.testimonios').removeClass('three')
|
||||
this.elem.find('.testimonios').addClass(this.word_amount[this.amount])
|
||||
}
|
||||
this.draw()
|
||||
},
|
||||
amount: 3,
|
||||
word_amount: {
|
||||
1: 'one',
|
||||
3: 'three'
|
||||
},
|
||||
draw: function() {
|
||||
var n = this.page * 3
|
||||
this.elem.find('.testimonio').each((i, el) => {
|
||||
var n = this.page * this.amount
|
||||
let p = this.elem.find('.testimonios')
|
||||
p.html('')
|
||||
for (var i = 0; i < this.amount; i ++) {
|
||||
if (n >= this.testimonios.length) {
|
||||
$(el).html('')
|
||||
return
|
||||
break
|
||||
}
|
||||
$(el).html(this.testimonios[n])
|
||||
n += 1
|
||||
})
|
||||
p.append(
|
||||
$('<div></div>').attr('class', 'ui centered fluid card').append(
|
||||
$('<div></div>').attr('class', 'center aligned content').append(
|
||||
$('<div></div>').attr('class', 'header').html(this.testimonios[n]['autor'].toUpperCase())
|
||||
).append(
|
||||
$('<div></div>').attr('class', 'description').html(this.testimonios[n]['contenido'])
|
||||
)
|
||||
).append(
|
||||
$('<div></div>').attr('class', 'center aligned content').append(
|
||||
$('<div></div>').attr('class', 'ui mini black rating disabled').attr('data-rating', '5').attr('data-max-rating', '5')
|
||||
)
|
||||
)
|
||||
)
|
||||
n ++
|
||||
}
|
||||
this.elem.find('.ui.rating').rating()
|
||||
this.draw_nav()
|
||||
},
|
||||
draw_nav: function() {
|
||||
let N = Math.ceil(this.testimonios.length / 3)
|
||||
let N = Math.ceil(this.testimonios.length / this.amount)
|
||||
let k = this.page
|
||||
let nav = this.elem.parent().find('.nav')
|
||||
let nav = this.elem.find('.nav')
|
||||
let tests = this
|
||||
nav.html('')
|
||||
for (var i = 0; i < N; i ++) {
|
||||
@ -351,7 +404,6 @@ let testimonios = {
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
|
||||
$('#menu.sticky').sticky()
|
||||
$('.column2 .sticky').sticky({
|
||||
context: '#column'
|
||||
@ -369,5 +421,15 @@ $(document).ready(function() {
|
||||
let cotiza_color = new Colors($('#corporativos .colores'))
|
||||
cotiza_form.setup()
|
||||
conversemos_form.setup()
|
||||
|
||||
window.mobileCheck = function() {
|
||||
let check = false;
|
||||
(function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))) check = true;})(navigator.userAgent||navigator.vendor||window.opera);
|
||||
return check;
|
||||
};
|
||||
|
||||
if (window.mobileCheck()) {
|
||||
testimonios.amount = 1
|
||||
}
|
||||
testimonios.setup()
|
||||
})
|
||||
|
||||
@ -4,3 +4,5 @@
|
||||
@import 'dimensiones';
|
||||
@import 'construidos';
|
||||
@import 'corporativos';
|
||||
@import 'testimonios';
|
||||
@import 'contacto';
|
||||
|
||||
58
assets/sass/_contacto.scss
Normal file
58
assets/sass/_contacto.scss
Normal file
@ -0,0 +1,58 @@
|
||||
#contacto {
|
||||
position: relative;
|
||||
margin-top: 1rem;
|
||||
|
||||
.background {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: $gris;
|
||||
clip-path: polygon(50% 0, 100% 0%, 100% 100%, 0% 100%);
|
||||
}
|
||||
|
||||
.column {
|
||||
height: 100%;
|
||||
}
|
||||
.column:first-child {
|
||||
width: 67%;
|
||||
}
|
||||
.column:last-child {
|
||||
width: 33%;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
}
|
||||
div.whatsapp {
|
||||
background-color: green;
|
||||
padding: .5rem 0;
|
||||
color: $blanco;
|
||||
}
|
||||
|
||||
.icons {
|
||||
.icon:first-child {
|
||||
color: $blanco;
|
||||
}
|
||||
.icon:last-child {
|
||||
color: $gris;
|
||||
}
|
||||
}
|
||||
|
||||
.paragraph {
|
||||
margin-bottom: .5rem;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
form {
|
||||
.row {
|
||||
margin-bottom: .5rem;
|
||||
|
||||
input {
|
||||
height: 1.5rem;
|
||||
}
|
||||
textarea {
|
||||
height: 5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
33
assets/sass/_fonts.scss
Normal file
33
assets/sass/_fonts.scss
Normal file
@ -0,0 +1,33 @@
|
||||
@font-face {
|
||||
font-family: 'icomoon';
|
||||
src: url('../fonts/icomoon.eotiedbpz');
|
||||
src: url('../fonts/icomoon.eot?iedbpz#iefix') format('embedded-opentype'),
|
||||
url('../fonts/icomoon.ttf?iedbpz') format('truetype'),
|
||||
url('../fonts/icomoon.woff?iedbpz') format('woff'),
|
||||
url('../fonts/icomoon.svg?iedbpz#icomoon') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-display: block;
|
||||
}
|
||||
|
||||
[class^="font-icon"], [class*=" font-icon"] {
|
||||
// use !important to prevent issues with browser extensions that change fonts
|
||||
font-family: 'icomoon' !important;
|
||||
speak: never;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
|
||||
// Better Font Rendering ===========
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
i.font-icon.angle:before {
|
||||
content: "\e900";
|
||||
}
|
||||
i.font-icon.chile:before {
|
||||
content: "\e901";
|
||||
}
|
||||
13
assets/sass/_testimonios.scss
Normal file
13
assets/sass/_testimonios.scss
Normal file
@ -0,0 +1,13 @@
|
||||
#testimonios {
|
||||
.testimonios {
|
||||
.ui.card {
|
||||
background-color: $gris;
|
||||
|
||||
.rating {
|
||||
.icon {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -3,8 +3,10 @@
|
||||
@import 'wide/descripcion';
|
||||
@import 'wide/ventajas';
|
||||
@import 'wide/dimensiones';
|
||||
|
||||
@import 'wide/construidos';
|
||||
@import 'wide/corporativos';
|
||||
@import 'wide/testimonios';
|
||||
@import 'wide/contacto';
|
||||
|
||||
.left.column {
|
||||
width: 67% !important;
|
||||
@ -20,52 +22,6 @@ section .titulo {
|
||||
padding-bottom: rem(25);
|
||||
}
|
||||
|
||||
#backgrounds {
|
||||
.seccion2 {
|
||||
height: (map.get($heights, "seccion2"))+rem;
|
||||
|
||||
background-image: $fondo_ventajas_dimensiones;
|
||||
|
||||
.diagonal {
|
||||
border-bottom: (map.get($heights, 'seccion2'))+rem solid rgba($gris, .5);
|
||||
border-right: rem(1900) solid transparent;
|
||||
}
|
||||
}
|
||||
.dimensiones {
|
||||
height: (map.get($heights, "dimensiones"))+rem;
|
||||
|
||||
background-image: $fondo_ventajas_dimensiones;
|
||||
.fondo-gris {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba($gris, .5);
|
||||
}
|
||||
}
|
||||
.construido {
|
||||
height: (map.get($heights, "construido"))+rem;
|
||||
|
||||
background-image: $fondo_construidos;
|
||||
}
|
||||
.corporativos {
|
||||
height: (map.get($heights, "corporativos"))+rem;
|
||||
|
||||
background-image: $fondo_corporativos;
|
||||
}
|
||||
.testimonios {
|
||||
height: (map.get($heights, "felices"))+rem;
|
||||
|
||||
background-image: linear-gradient($gris, $gris);
|
||||
background-position: left rem(115);
|
||||
background-size: 100% rem(118);
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.formulario {
|
||||
height: (map.get($heights, "formulario"))+rem;
|
||||
background-color: $gris;
|
||||
clip-path: polygon(50% 0, 100% 0%, 100% 100%, 0% 100%);
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
color: $gris_standard;
|
||||
}
|
||||
@ -90,128 +46,6 @@ body {
|
||||
}
|
||||
&>.column1 {
|
||||
width: percentage($column1/100);
|
||||
|
||||
|
||||
#seccion1 {
|
||||
height: (map.get($heights, "seccion1"))+rem;
|
||||
width: 100%;
|
||||
|
||||
.image-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
height: rem(112+128);
|
||||
|
||||
img {
|
||||
height: rem(155);
|
||||
width: rem(188);
|
||||
margin-top: rem(85);
|
||||
}
|
||||
}
|
||||
.paragraph {
|
||||
padding-top: rem(28);
|
||||
line-height: rem(14);
|
||||
text-align: justify;
|
||||
|
||||
.header {
|
||||
margin-bottom: 1rem;
|
||||
font-size: rem(22);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#seccion2 {
|
||||
height: (map.get($heights, "seccion2"))+rem;
|
||||
|
||||
&>.column {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
width: 50%;
|
||||
|
||||
&::after {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
.column1 {
|
||||
margin-top: rem(80);
|
||||
img {
|
||||
width: rem(317);
|
||||
height: rem(317);
|
||||
}
|
||||
}
|
||||
.column2 {
|
||||
margin-top: rem(114);
|
||||
.row:first-child {
|
||||
background-color: #00427b;
|
||||
color: rgb(255, 255, 255);
|
||||
height: rem(180);
|
||||
width: rem(380);
|
||||
padding: 2rem;
|
||||
margin-left: -3rem;
|
||||
|
||||
.header {
|
||||
font-weight: bold;
|
||||
font-size: rem(16);
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: disc inside;
|
||||
font-size: font-size(10);
|
||||
}
|
||||
}
|
||||
.row:last-child {
|
||||
margin-top: rem(18);
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
img {
|
||||
width: rem(70);
|
||||
height: rem(85);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#dimensiones {
|
||||
height: (map.get($heights, "dimensiones"))+rem;
|
||||
|
||||
.header {
|
||||
padding: rem(37) 0 !important;
|
||||
.bigger {
|
||||
font-size: rem(16);
|
||||
}
|
||||
}
|
||||
|
||||
.images {
|
||||
display: flex;
|
||||
|
||||
.column {
|
||||
float: left;
|
||||
|
||||
&>img {
|
||||
width: rem(313);
|
||||
height: rem(235);
|
||||
}
|
||||
|
||||
div {
|
||||
width: rem(313);
|
||||
margin-top: rem(25);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#construido {
|
||||
height: (map.get($heights, "construido"))+rem;
|
||||
padding-top: rem(23) !important;
|
||||
|
||||
.header {
|
||||
font-size: font_size(22);
|
||||
padding: rem(10) rem(43);
|
||||
background-color: rgba(255, 255, 255, .6);
|
||||
}
|
||||
}
|
||||
}
|
||||
&>.column2 {
|
||||
width: percentage($column2/100);
|
||||
@ -296,161 +130,6 @@ body {
|
||||
}
|
||||
}
|
||||
|
||||
#corporativos {
|
||||
width: 100%;
|
||||
height: (map.get($heights, "corporativos"))+rem;
|
||||
|
||||
margin-top: ($column_height1)+rem !important;
|
||||
|
||||
&>.column {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
|
||||
padding-left: 1rem !important;
|
||||
padding-right: 1rem !important;
|
||||
|
||||
&::after {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
.column1 {
|
||||
width: percentage(67/100);
|
||||
|
||||
&>.header {
|
||||
margin-top: rem(67);
|
||||
margin-bottom: rem(37);
|
||||
.bigger {
|
||||
font-size: rem(26);
|
||||
}
|
||||
}
|
||||
.opciones {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
|
||||
.opcion {
|
||||
display: inline-block;
|
||||
|
||||
.img-grande {
|
||||
display: inline-block;
|
||||
padding-right: rem(12);
|
||||
img {
|
||||
width: rem(135);
|
||||
height: rem(200);
|
||||
}
|
||||
}
|
||||
.descripcion {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
height: rem(200);
|
||||
padding-top: rem(20);
|
||||
|
||||
.content {
|
||||
display: block;
|
||||
.header {
|
||||
font-size: font_size(14);
|
||||
margin-bottom: rem(10);
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: disc inside;
|
||||
}
|
||||
}
|
||||
.images {
|
||||
margin-top: rem(34);
|
||||
img {
|
||||
width: rem(70);
|
||||
height: rem(85);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.column2 {
|
||||
width: percentage(33/100);
|
||||
height: 100%;
|
||||
|
||||
.header {
|
||||
margin-top: rem(46);
|
||||
margin-bottom: rem(24);
|
||||
font-size: rem(26);
|
||||
}
|
||||
|
||||
form {
|
||||
@include colors;
|
||||
|
||||
.row {
|
||||
margin-bottom: rem(9);
|
||||
}
|
||||
.colores.linea {
|
||||
//margin-bottom: rem(25-9);
|
||||
}
|
||||
.input.cantidad {
|
||||
width: 4.5rem;
|
||||
background: rgb(255, 255, 255);
|
||||
text-align: center;
|
||||
padding: .5rem 0.05rem;
|
||||
font-size: font_size(10);
|
||||
color: rgba(191, 191, 191, .87) !important;
|
||||
|
||||
button {
|
||||
background: none;
|
||||
border: none;
|
||||
width: 1rem;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
color: rgba(191, 191, 191, .87) !important;
|
||||
}
|
||||
input {
|
||||
width: 2rem;
|
||||
background: none;
|
||||
margin: 0;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
color: rgba(191, 191, 191, .87) !important;
|
||||
}
|
||||
}
|
||||
.input [type="file"] {
|
||||
display: none;
|
||||
}
|
||||
.input .file {
|
||||
display: inline-block;
|
||||
height: rem(20*12/10);
|
||||
//width: rem(150);
|
||||
padding-top: rem(3);
|
||||
margin-left: rem(5);
|
||||
//background-color: #cccccb;
|
||||
//border: thin solid #333;
|
||||
font-size: font_size(16);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.input [type="text"] {
|
||||
height: rem(18);
|
||||
background-color: rgba(255, 255, 255);
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
textarea {
|
||||
height: rem(72);
|
||||
background-color: rgba(255, 255, 255);
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
margin-bottom: rem(25-9);
|
||||
}
|
||||
.button {
|
||||
width: 100%;
|
||||
background-color: #666667;
|
||||
color: white;
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#felices {
|
||||
height: (map.get($heights, "felices"))+rem;
|
||||
|
||||
|
||||
@ -7,10 +7,11 @@ html {
|
||||
}
|
||||
|
||||
@import 'common';
|
||||
@import 'fonts';
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
@media screen and (orientation: portrait) {
|
||||
@import 'phone';
|
||||
}
|
||||
@media screen and (min-width: 800px) {
|
||||
@media screen and (orientation: landscape) {
|
||||
@import 'wide';
|
||||
}
|
||||
|
||||
3
assets/sass/wide/_construidos.scss
Normal file
3
assets/sass/wide/_construidos.scss
Normal file
@ -0,0 +1,3 @@
|
||||
#construidos {
|
||||
margin-top: rem(15);
|
||||
}
|
||||
12
assets/sass/wide/_contacto.scss
Normal file
12
assets/sass/wide/_contacto.scss
Normal file
@ -0,0 +1,12 @@
|
||||
#contacto {
|
||||
.image {
|
||||
margin: auto;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.button {
|
||||
width: 100%;
|
||||
background-color: #666667;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
@ -1,13 +1,12 @@
|
||||
#corporativos {
|
||||
margin-top: rem(15);
|
||||
|
||||
form {
|
||||
@include colors;
|
||||
|
||||
.row {
|
||||
margin-bottom: rem(9);
|
||||
}
|
||||
.colores.linea {
|
||||
//margin-bottom: rem(25-9);
|
||||
}
|
||||
.input.cantidad {
|
||||
width: 4.5rem;
|
||||
background: rgb(255, 255, 255);
|
||||
@ -41,34 +40,24 @@
|
||||
.input .file {
|
||||
display: inline-block;
|
||||
height: rem(20*12/10);
|
||||
//width: rem(150);
|
||||
padding-top: rem(3);
|
||||
margin-left: rem(5);
|
||||
//background-color: #cccccb;
|
||||
//border: thin solid #333;
|
||||
font-size: font_size(16);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.input [type="text"] {
|
||||
height: rem(18);
|
||||
background-color: rgba(255, 255, 255);
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
textarea {
|
||||
height: rem(72);
|
||||
background-color: rgba(255, 255, 255);
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
margin-bottom: rem(25-9);
|
||||
.row {
|
||||
input {
|
||||
height: 1.5rem;
|
||||
}
|
||||
textarea {
|
||||
height: 5rem;
|
||||
}
|
||||
}
|
||||
.button {
|
||||
width: 100%;
|
||||
background-color: #666667;
|
||||
color: white;
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
3
assets/sass/wide/_testimonios.scss
Normal file
3
assets/sass/wide/_testimonios.scss
Normal file
@ -0,0 +1,3 @@
|
||||
#testimonios {
|
||||
margin-top: rem(15);
|
||||
}
|
||||
BIN
public/assets/fonts/icomoon.eot
Normal file
BIN
public/assets/fonts/icomoon.eot
Normal file
Binary file not shown.
12
public/assets/fonts/icomoon.svg
Normal file
12
public/assets/fonts/icomoon.svg
Normal file
@ -0,0 +1,12 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||
<svg xmlns="http://www.w3.org/2000/svg">
|
||||
<metadata>Generated by IcoMoon</metadata>
|
||||
<defs>
|
||||
<font id="icomoon" horiz-adv-x="1024">
|
||||
<font-face units-per-em="1024" ascent="960" descent="-64" />
|
||||
<missing-glyph horiz-adv-x="1024" />
|
||||
<glyph unicode=" " horiz-adv-x="512" d="" />
|
||||
<glyph unicode="" glyph-name="angle" horiz-adv-x="1325" d="M1141.196 132.785h-457.624c-10.618 93.644-46.826 180.902-105.693 254.713l392.607 392.604c10.889 10.889 16.888 25.367 16.888 40.768s-5.998 29.878-16.886 40.764c-10.888 10.891-25.366 16.888-40.766 16.888s-29.877-5.997-40.768-16.886l-745.74-745.736c-11.067-11.065-17.217-26.386-16.873-42.034 0.062-2.823 0.333-5.655 0.805-8.418 0.721-4.228 1.919-8.388 3.569-12.375 8.955-21.621 29.863-35.591 53.265-35.591h957.217c31.791 0 57.654 25.863 57.654 57.654s-25.864 57.65-57.655 57.65zM567.304 132.785h-244.139l172.512 172.511c37.893-50.979 62.317-109.804 71.626-172.511z" />
|
||||
<glyph unicode="" glyph-name="chile" horiz-adv-x="1604" d="M1604.11-64h-1604.11v1021.898h1604.037v-1021.898zM67.638 3.566h1468.905v886.766h-1468.905v-886.766zM1604.11-64h-1604.11v544.659h1604.037v-544.659zM67.638 3.566h1468.905v409.528h-1468.905v-409.528zM628.754 413.093h-628.754v544.804h628.754v-544.804zM67.638 480.659h493.622v409.673h-493.622v-409.673zM314.341 632.32l-61.331-32.261 11.672 68.436-49.732 48.427 68.726 10.004 30.666 62.346 30.738-62.346 68.798-10.004-49.732-48.427 11.744-68.436zM230.536 569.104l16.022 93.519-67.856 66.188 93.737 13.629 41.83 85.037 41.975-85.037 93.809-13.629-67.783-66.188 16.094-93.447-84.022 44.077-83.805-44.15zM314.341 651.459l39.148-20.516-7.467 43.497 31.608 30.738-43.787 6.38-19.501 39.51-19.429-39.51-43.642-6.38 31.536-30.738-7.395-43.497 38.93 20.516z" />
|
||||
</font></defs></svg>
|
||||
|
After Width: | Height: | Size: 1.8 KiB |
BIN
public/assets/fonts/icomoon.ttf
Normal file
BIN
public/assets/fonts/icomoon.ttf
Normal file
Binary file not shown.
BIN
public/assets/fonts/icomoon.woff
Normal file
BIN
public/assets/fonts/icomoon.woff
Normal file
Binary file not shown.
@ -273,7 +273,7 @@ let cotiza_form = {
|
||||
}
|
||||
}
|
||||
let conversemos_form = {
|
||||
elem: $('#contacto'),
|
||||
elem: $('#contacto_form'),
|
||||
setup: function() {
|
||||
this.elem.submit((e) => {
|
||||
e.preventDefault()
|
||||
@ -302,38 +302,91 @@ let conversemos_form = {
|
||||
|
||||
let testimonios = {
|
||||
testimonios: [
|
||||
"Este soporte que compré en @Stand-cl me cambió la vida, me sirve para el teléfono y el ipad, y ya no tengo que andar acomodando los aparatos en cualquier parte para las videollamadas",
|
||||
"Siiii todo mi gusto.. me encantó lo completo que es. Gracias",
|
||||
"Está super cool se ve de buena calidad",
|
||||
"Llego el mío, y es excelente, estoy feliz con mi compra",
|
||||
"Hola!!Me llegó el pedido, Muchas gracias muy bello. Me salvaste la vida",
|
||||
"Perfecto el producto, funciona impecable, muchas gracias",
|
||||
"Están bacanes! muchísimas gracias. Le regalé a mis viejos y lo aman",
|
||||
"Hola! Quería decirte que me encantaron los soportes, Muy útiles!",
|
||||
"Compré 3 y olvidé decirte que los encontré geniales! Me encantaron",
|
||||
"Diseño simple y funcional, minimalista y excelente precio, despacho súper Rápido.. gracias!"
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Este soporte que compré en @Stand-cl me cambió la vida, me sirve para el teléfono y el ipad, y ya no tengo que andar acomodando los aparatos en cualquier parte para las videollamadas"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Siiii todo mi gusto.. me encantó lo completo que es. Gracias"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Está super cool se ve de buena calidad"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Llego el mío, y es excelente, estoy feliz con mi compra"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Hola!!Me llegó el pedido, Muchas gracias muy bello. Me salvaste la vida"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Perfecto el producto, funciona impecable, muchas gracias"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Están bacanes! muchísimas gracias. Le regalé a mis viejos y lo aman"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Hola! Quería decirte que me encantaron los soportes, Muy útiles!"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Compré 3 y olvidé decirte que los encontré geniales! Me encantaron"
|
||||
},
|
||||
{
|
||||
"autor": "John Master",
|
||||
"contenido": "Diseño simple y funcional, minimalista y excelente precio, despacho súper Rápido.. gracias!"
|
||||
}
|
||||
],
|
||||
elem: $('#felices .testimonios'),
|
||||
elem: $('#testimonios'),
|
||||
page: 0,
|
||||
setup: function() {
|
||||
if (this.amount != 3) {
|
||||
this.elem.find('.testimonios').removeClass('three')
|
||||
this.elem.find('.testimonios').addClass(this.word_amount[this.amount])
|
||||
}
|
||||
this.draw()
|
||||
},
|
||||
amount: 3,
|
||||
word_amount: {
|
||||
1: 'one',
|
||||
3: 'three'
|
||||
},
|
||||
draw: function() {
|
||||
var n = this.page * 3
|
||||
this.elem.find('.testimonio').each((i, el) => {
|
||||
var n = this.page * this.amount
|
||||
let p = this.elem.find('.testimonios')
|
||||
p.html('')
|
||||
for (var i = 0; i < this.amount; i ++) {
|
||||
if (n >= this.testimonios.length) {
|
||||
$(el).html('')
|
||||
return
|
||||
break
|
||||
}
|
||||
$(el).html(this.testimonios[n])
|
||||
n += 1
|
||||
})
|
||||
p.append(
|
||||
$('<div></div>').attr('class', 'ui centered fluid card').append(
|
||||
$('<div></div>').attr('class', 'center aligned content').append(
|
||||
$('<div></div>').attr('class', 'header').html(this.testimonios[n]['autor'].toUpperCase())
|
||||
).append(
|
||||
$('<div></div>').attr('class', 'description').html(this.testimonios[n]['contenido'])
|
||||
)
|
||||
).append(
|
||||
$('<div></div>').attr('class', 'center aligned content').append(
|
||||
$('<div></div>').attr('class', 'ui mini black rating disabled').attr('data-rating', '5').attr('data-max-rating', '5')
|
||||
)
|
||||
)
|
||||
)
|
||||
n ++
|
||||
}
|
||||
this.elem.find('.ui.rating').rating()
|
||||
this.draw_nav()
|
||||
},
|
||||
draw_nav: function() {
|
||||
let N = Math.ceil(this.testimonios.length / 3)
|
||||
let N = Math.ceil(this.testimonios.length / this.amount)
|
||||
let k = this.page
|
||||
let nav = this.elem.parent().find('.nav')
|
||||
let nav = this.elem.find('.nav')
|
||||
let tests = this
|
||||
nav.html('')
|
||||
for (var i = 0; i < N; i ++) {
|
||||
@ -351,7 +404,6 @@ let testimonios = {
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
|
||||
$('#menu.sticky').sticky()
|
||||
$('.column2 .sticky').sticky({
|
||||
context: '#column'
|
||||
@ -369,5 +421,15 @@ $(document).ready(function() {
|
||||
let cotiza_color = new Colors($('#corporativos .colores'))
|
||||
cotiza_form.setup()
|
||||
conversemos_form.setup()
|
||||
|
||||
window.mobileCheck = function() {
|
||||
let check = false;
|
||||
(function(a){if(/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))) check = true;})(navigator.userAgent||navigator.vendor||window.opera);
|
||||
return check;
|
||||
};
|
||||
|
||||
if (window.mobileCheck()) {
|
||||
testimonios.amount = 1
|
||||
}
|
||||
testimonios.setup()
|
||||
})
|
||||
|
||||
2
public/assets/scripts/main.min.js
vendored
2
public/assets/scripts/main.min.js
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,3 +1,4 @@
|
||||
@charset "UTF-8";
|
||||
*, *:before, *:after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
@ -153,7 +154,90 @@ html {
|
||||
text-indent: -1rem;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 800px) {
|
||||
#testimonios .testimonios .ui.card {
|
||||
background-color: #cccccc;
|
||||
}
|
||||
#testimonios .testimonios .ui.card .rating .icon {
|
||||
color: white;
|
||||
}
|
||||
|
||||
#contacto {
|
||||
position: relative;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
#contacto .background {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #cccccc;
|
||||
clip-path: polygon(50% 0, 100% 0%, 100% 100%, 0% 100%);
|
||||
}
|
||||
#contacto .column {
|
||||
height: 100%;
|
||||
}
|
||||
#contacto .column:first-child {
|
||||
width: 67%;
|
||||
}
|
||||
#contacto .column:last-child {
|
||||
width: 33%;
|
||||
}
|
||||
#contacto a {
|
||||
color: inherit;
|
||||
}
|
||||
#contacto div.whatsapp {
|
||||
background-color: green;
|
||||
padding: 0.5rem 0;
|
||||
color: white;
|
||||
}
|
||||
#contacto .icons .icon:first-child {
|
||||
color: white;
|
||||
}
|
||||
#contacto .icons .icon:last-child {
|
||||
color: #cccccc;
|
||||
}
|
||||
#contacto .paragraph {
|
||||
margin-bottom: 0.5rem;
|
||||
text-align: justify;
|
||||
}
|
||||
#contacto form .row {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
#contacto form .row input {
|
||||
height: 1.5rem;
|
||||
}
|
||||
#contacto form .row textarea {
|
||||
height: 5rem;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "icomoon";
|
||||
src: url("../fonts/icomoon.eotiedbpz");
|
||||
src: url("../fonts/icomoon.eot?iedbpz#iefix") format("embedded-opentype"), url("../fonts/icomoon.ttf?iedbpz") format("truetype"), url("../fonts/icomoon.woff?iedbpz") format("woff"), url("../fonts/icomoon.svg?iedbpz#icomoon") format("svg");
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-display: block;
|
||||
}
|
||||
[class^=font-icon], [class*=" font-icon"] {
|
||||
font-family: "icomoon" !important;
|
||||
speak: never;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
i.font-icon.angle:before {
|
||||
content: "";
|
||||
}
|
||||
|
||||
i.font-icon.chile:before {
|
||||
content: "";
|
||||
}
|
||||
|
||||
@media screen and (orientation: portrait) {
|
||||
#header {
|
||||
height: 25rem;
|
||||
background-size: 160%;
|
||||
@ -935,7 +1019,7 @@ html {
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 800px) {
|
||||
@media screen and (orientation: landscape) {
|
||||
#header {
|
||||
height: 31.25rem;
|
||||
background-size: 160%;
|
||||
@ -1024,6 +1108,13 @@ html {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
#construidos {
|
||||
margin-top: 0.9375rem;
|
||||
}
|
||||
|
||||
#corporativos {
|
||||
margin-top: 0.9375rem;
|
||||
}
|
||||
#corporativos form .colores {
|
||||
vertical-align: center;
|
||||
}
|
||||
@ -1106,25 +1197,30 @@ html {
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
#corporativos form .input [type=text] {
|
||||
height: 1.125rem;
|
||||
background-color: white;
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
#corporativos form .row input {
|
||||
height: 1.5rem;
|
||||
}
|
||||
#corporativos form textarea {
|
||||
height: 4.5rem;
|
||||
background-color: white;
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
margin-bottom: 1rem;
|
||||
#corporativos form .row textarea {
|
||||
height: 5rem;
|
||||
}
|
||||
#corporativos form .button {
|
||||
width: 100%;
|
||||
background-color: #666667;
|
||||
color: white;
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
#testimonios {
|
||||
margin-top: 0.9375rem;
|
||||
}
|
||||
|
||||
#contacto .image {
|
||||
margin: auto;
|
||||
vertical-align: middle;
|
||||
}
|
||||
#contacto .button {
|
||||
width: 100%;
|
||||
background-color: #666667;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.left.column {
|
||||
@ -1142,44 +1238,6 @@ html {
|
||||
padding-bottom: 1.5625rem;
|
||||
}
|
||||
|
||||
#backgrounds .seccion2 {
|
||||
height: rem;
|
||||
background-image: url("../images/tripode.png");
|
||||
}
|
||||
#backgrounds .seccion2 .diagonal {
|
||||
border-bottom: rem solid rgba(204, 204, 204, 0.5);
|
||||
border-right: 118.75rem solid transparent;
|
||||
}
|
||||
#backgrounds .dimensiones {
|
||||
height: 27.5rem;
|
||||
background-image: url("../images/tripode.png");
|
||||
}
|
||||
#backgrounds .dimensiones .fondo-gris {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(204, 204, 204, 0.5);
|
||||
}
|
||||
#backgrounds .construido {
|
||||
height: 21.875rem;
|
||||
background-image: url("../images/construido.jpg");
|
||||
}
|
||||
#backgrounds .corporativos {
|
||||
height: 32.5rem;
|
||||
background-image: url("../images/corporativo.png");
|
||||
}
|
||||
#backgrounds .testimonios {
|
||||
height: 21.875rem;
|
||||
background-image: linear-gradient(#cccccc, #cccccc);
|
||||
background-position: left 7.1875rem;
|
||||
background-size: 100% 7.375rem;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#backgrounds .formulario {
|
||||
height: 30rem;
|
||||
background-color: #cccccc;
|
||||
clip-path: polygon(50% 0, 100% 0%, 100% 100%, 0% 100%);
|
||||
}
|
||||
|
||||
body {
|
||||
color: #333333;
|
||||
}
|
||||
@ -1202,108 +1260,6 @@ html {
|
||||
#content > .column1 {
|
||||
width: 67%;
|
||||
}
|
||||
#content > .column1 #seccion1 {
|
||||
height: rem;
|
||||
width: 100%;
|
||||
}
|
||||
#content > .column1 #seccion1 .image-container {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
height: 15rem;
|
||||
}
|
||||
#content > .column1 #seccion1 .image-container img {
|
||||
height: 9.6875rem;
|
||||
width: 11.75rem;
|
||||
margin-top: 5.3125rem;
|
||||
}
|
||||
#content > .column1 #seccion1 .paragraph {
|
||||
padding-top: 1.75rem;
|
||||
line-height: 0.875rem;
|
||||
text-align: justify;
|
||||
}
|
||||
#content > .column1 #seccion1 .paragraph .header {
|
||||
margin-bottom: 1rem;
|
||||
font-size: 1.375rem;
|
||||
}
|
||||
#content > .column1 #seccion2 {
|
||||
height: rem;
|
||||
}
|
||||
#content > .column1 #seccion2 > .column {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
width: 50%;
|
||||
}
|
||||
#content > .column1 #seccion2 > .column::after {
|
||||
clear: both;
|
||||
}
|
||||
#content > .column1 #seccion2 .column1 {
|
||||
margin-top: 5rem;
|
||||
}
|
||||
#content > .column1 #seccion2 .column1 img {
|
||||
width: 19.8125rem;
|
||||
height: 19.8125rem;
|
||||
}
|
||||
#content > .column1 #seccion2 .column2 {
|
||||
margin-top: 7.125rem;
|
||||
}
|
||||
#content > .column1 #seccion2 .column2 .row:first-child {
|
||||
background-color: #00427b;
|
||||
color: white;
|
||||
height: 11.25rem;
|
||||
width: 23.75rem;
|
||||
padding: 2rem;
|
||||
margin-left: -3rem;
|
||||
}
|
||||
#content > .column1 #seccion2 .column2 .row:first-child .header {
|
||||
font-weight: bold;
|
||||
font-size: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
#content > .column1 #seccion2 .column2 .row:first-child ul {
|
||||
list-style: disc inside;
|
||||
font-size: 0.8333333333rem;
|
||||
}
|
||||
#content > .column1 #seccion2 .column2 .row:last-child {
|
||||
margin-top: 1.125rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
#content > .column1 #seccion2 .column2 .row:last-child img {
|
||||
width: 4.375rem;
|
||||
height: 5.3125rem;
|
||||
}
|
||||
#content > .column1 #dimensiones {
|
||||
height: 27.5rem;
|
||||
}
|
||||
#content > .column1 #dimensiones .header {
|
||||
padding: 2.3125rem 0 !important;
|
||||
}
|
||||
#content > .column1 #dimensiones .header .bigger {
|
||||
font-size: 1rem;
|
||||
}
|
||||
#content > .column1 #dimensiones .images {
|
||||
display: flex;
|
||||
}
|
||||
#content > .column1 #dimensiones .images .column {
|
||||
float: left;
|
||||
}
|
||||
#content > .column1 #dimensiones .images .column > img {
|
||||
width: 19.5625rem;
|
||||
height: 14.6875rem;
|
||||
}
|
||||
#content > .column1 #dimensiones .images .column div {
|
||||
width: 19.5625rem;
|
||||
margin-top: 1.5625rem;
|
||||
}
|
||||
#content > .column1 #construido {
|
||||
height: 21.875rem;
|
||||
padding-top: 1.4375rem !important;
|
||||
}
|
||||
#content > .column1 #construido .header {
|
||||
font-size: 1.8333333333rem;
|
||||
padding: 0.625rem 2.6875rem;
|
||||
background-color: rgba(255, 255, 255, 0.6);
|
||||
}
|
||||
#content > .column2 {
|
||||
width: 33%;
|
||||
height: 101.875rem;
|
||||
@ -1415,179 +1371,6 @@ html {
|
||||
border-radius: 0 !important;
|
||||
width: 100%;
|
||||
}
|
||||
#content #corporativos {
|
||||
width: 100%;
|
||||
height: 32.5rem;
|
||||
margin-top: 101.875rem !important;
|
||||
}
|
||||
#content #corporativos > .column {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
padding-left: 1rem !important;
|
||||
padding-right: 1rem !important;
|
||||
}
|
||||
#content #corporativos > .column::after {
|
||||
clear: both;
|
||||
}
|
||||
#content #corporativos .column1 {
|
||||
width: 67%;
|
||||
}
|
||||
#content #corporativos .column1 > .header {
|
||||
margin-top: 4.1875rem;
|
||||
margin-bottom: 2.3125rem;
|
||||
}
|
||||
#content #corporativos .column1 > .header .bigger {
|
||||
font-size: 1.625rem;
|
||||
}
|
||||
#content #corporativos .column1 .opciones {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
#content #corporativos .column1 .opciones .opcion {
|
||||
display: inline-block;
|
||||
}
|
||||
#content #corporativos .column1 .opciones .opcion .img-grande {
|
||||
display: inline-block;
|
||||
padding-right: 0.75rem;
|
||||
}
|
||||
#content #corporativos .column1 .opciones .opcion .img-grande img {
|
||||
width: 8.4375rem;
|
||||
height: 12.5rem;
|
||||
}
|
||||
#content #corporativos .column1 .opciones .opcion .descripcion {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
height: 12.5rem;
|
||||
padding-top: 1.25rem;
|
||||
}
|
||||
#content #corporativos .column1 .opciones .opcion .descripcion .content {
|
||||
display: block;
|
||||
}
|
||||
#content #corporativos .column1 .opciones .opcion .descripcion .content .header {
|
||||
font-size: 1.1666666667rem;
|
||||
margin-bottom: 0.625rem;
|
||||
}
|
||||
#content #corporativos .column1 .opciones .opcion .descripcion .content ul {
|
||||
list-style: disc inside;
|
||||
}
|
||||
#content #corporativos .column1 .opciones .opcion .descripcion .images {
|
||||
margin-top: 2.125rem;
|
||||
}
|
||||
#content #corporativos .column1 .opciones .opcion .descripcion .images img {
|
||||
width: 4.375rem;
|
||||
height: 5.3125rem;
|
||||
}
|
||||
#content #corporativos .column2 {
|
||||
width: 33%;
|
||||
height: 100%;
|
||||
}
|
||||
#content #corporativos .column2 .header {
|
||||
margin-top: 2.875rem;
|
||||
margin-bottom: 1.5rem;
|
||||
font-size: 1.625rem;
|
||||
}
|
||||
#content #corporativos .column2 form .colores {
|
||||
vertical-align: center;
|
||||
}
|
||||
#content #corporativos .column2 form .colores .text {
|
||||
margin-right: 0.1875rem;
|
||||
}
|
||||
#content #corporativos .column2 form .colores .white {
|
||||
border: thin solid black;
|
||||
background-color: white;
|
||||
}
|
||||
#content #corporativos .column2 form .colores .black {
|
||||
background-color: black;
|
||||
}
|
||||
#content #corporativos .column2 form .colores .blue {
|
||||
background-color: blue;
|
||||
}
|
||||
#content #corporativos .column2 form .colores .green {
|
||||
background-color: lime;
|
||||
}
|
||||
#content #corporativos .column2 form .colores .yellow {
|
||||
background-color: yellow;
|
||||
}
|
||||
#content #corporativos .column2 form .colores .orange {
|
||||
background-color: #ff8200;
|
||||
}
|
||||
#content #corporativos .column2 form .colores .red {
|
||||
background-color: red;
|
||||
}
|
||||
#content #corporativos .column2 form .colores .circle {
|
||||
display: inline-block;
|
||||
width: 1.25rem;
|
||||
height: 1.25rem;
|
||||
border-radius: 8000px;
|
||||
margin: auto 0.0625rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
#content #corporativos .column2 form .colores .circle.selected {
|
||||
width: 1.375rem;
|
||||
height: 1.375rem;
|
||||
cursor: default;
|
||||
}
|
||||
#content #corporativos .column2 form .row {
|
||||
margin-bottom: 0.5625rem;
|
||||
}
|
||||
#content #corporativos .column2 form .input.cantidad {
|
||||
width: 4.5rem;
|
||||
background: white;
|
||||
text-align: center;
|
||||
padding: 0.5rem 0.05rem;
|
||||
font-size: 0.8333333333rem;
|
||||
color: rgba(191, 191, 191, 0.87) !important;
|
||||
}
|
||||
#content #corporativos .column2 form .input.cantidad button {
|
||||
background: none;
|
||||
border: none;
|
||||
width: 1rem;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
color: rgba(191, 191, 191, 0.87) !important;
|
||||
}
|
||||
#content #corporativos .column2 form .input.cantidad input {
|
||||
width: 2rem;
|
||||
background: none;
|
||||
margin: 0;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
color: rgba(191, 191, 191, 0.87) !important;
|
||||
}
|
||||
#content #corporativos .column2 form .input [type=file] {
|
||||
display: none;
|
||||
}
|
||||
#content #corporativos .column2 form .input .file {
|
||||
display: inline-block;
|
||||
height: 1.5rem;
|
||||
padding-top: 0.1875rem;
|
||||
margin-left: 0.3125rem;
|
||||
font-size: 1.3333333333rem;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
#content #corporativos .column2 form .input [type=text] {
|
||||
height: 1.125rem;
|
||||
background-color: white;
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
#content #corporativos .column2 form textarea {
|
||||
height: 4.5rem;
|
||||
background-color: white;
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
#content #corporativos .column2 form .button {
|
||||
width: 100%;
|
||||
background-color: #666667;
|
||||
color: white;
|
||||
border: none !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
#content #felices {
|
||||
height: 21.875rem;
|
||||
padding: 0 1rem !important;
|
||||
|
||||
2
public/assets/styles/main.min.css
vendored
2
public/assets/styles/main.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user