From 52e1e9995cf06f9e3a090a5bce9a36e359580597 Mon Sep 17 00:00:00 2001 From: Aldarien Date: Sun, 20 Dec 2020 20:28:40 -0300 Subject: [PATCH] Afinando --- assets/js/main.js | 14 + assets/sass/_reset.scss | 46 +++ assets/sass/main.scss | 222 ++++++++-- public/assets/images/Medidas stand.svg | 154 +++++++ public/assets/images/fondo23.png | Bin 0 -> 8758 bytes public/assets/images/fondo5.png | Bin 0 -> 3302 bytes public/assets/images/logo.svg | 450 +++++++++++++++++++++ public/assets/scripts/main.js | 14 + public/assets/scripts/main.min.js | 2 +- public/assets/scripts/maps/main.min.js.map | 2 +- public/assets/styles/main.css | 220 ++++++++-- public/assets/styles/main.min.css | 2 +- public/assets/styles/maps/main.min.css.map | 2 +- public/index.html | 165 ++++---- 14 files changed, 1165 insertions(+), 128 deletions(-) create mode 100644 assets/sass/_reset.scss create mode 100644 public/assets/images/Medidas stand.svg create mode 100644 public/assets/images/fondo23.png create mode 100644 public/assets/images/fondo5.png create mode 100644 public/assets/images/logo.svg diff --git a/assets/js/main.js b/assets/js/main.js index d70297a..c78bae4 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -1,5 +1,19 @@ +function resize() { + let p = 400 / 1030 + $('.container').each(function(i, el) { + let height = $(this).height + let width = $(this).width + + $(this).width = height * p; + }) +} + $(document).ready(function() { $('.sticky').sticky({ context: '#column' }) + + $('.shopping.cart').innerText = 0 + + window.onresize = resize; }) diff --git a/assets/sass/_reset.scss b/assets/sass/_reset.scss new file mode 100644 index 0000000..b78f47f --- /dev/null +++ b/assets/sass/_reset.scss @@ -0,0 +1,46 @@ +*, *:before, *:after{ + box-sizing: border-box; +} + +html, body, div, span, object, iframe, figure, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, code, em, img, small, strike, strong, sub, sup, tt, b, u, i, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td, main, canvas, embed, footer, header, nav, section, video{ + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + text-size-adjust: none; +} + +footer, header, nav, section, main{ + display: block; +} + +body{ + line-height: 1; +} + +ol, ul{ + list-style: none; +} + +blockquote, q{ + quotes: none; +} + +blockquote:before, blockquote:after, q:before, q:after{ + content: ''; + content: none; +} + +table{ + border-collapse: collapse; + border-spacing: 0; +} + +input{ + -webkit-appearance: none; + border-radius: 0; +} diff --git a/assets/sass/main.scss b/assets/sass/main.scss index 70711a1..0eb7257 100644 --- a/assets/sass/main.scss +++ b/assets/sass/main.scss @@ -1,16 +1,35 @@ +@use "sass:map"; +@import 'reset'; + +body { + font-family: Roboto, sans; +} + .ui.container { - position: relative; + max-width: 1030px; +} +section>.container { + height: 100%; + &>.column1 { + width: (1030*2/3/16)+rem; + } + &>.column2 { + width: (1030/3/16)+rem; + } } #header { background-image: url('../images/header.png'); background-repeat: no-repeat; background-size: auto; - background-color: rgba(100, 100, 0, .3); + $header-background: rgba(100, 100, 0, .3); + background-color: $header-background; color: rgb(255, 255, 255); width: 100%; - height: 30rem; + &>.container { + height: 400px; + } .ui.menu { border: none !important; @@ -26,6 +45,17 @@ .item { color: inherit !important; + font-size: 2rem; + + .shopping.cart div { + position: relative; + color: black; + display: inline-block; + top: -2.6rem; + left: 0.2rem; + font-size: 1rem; + font-family: Roboto, sans; + } } } @@ -34,10 +64,10 @@ margin: 0 !important; img { - width: 10rem; + width: 50%; } .frase1 { - font-size: 2rem; + font-size: 1.5rem; } .frase2 { font-size: 1rem; @@ -57,49 +87,93 @@ } } +$heights: ( + "seccion1": 25, + "seccion2": 27.5, + "dimensiones": 27.5, + "construido": 21.875, + "corporativos": 25, + "felices": 21.875, + "formulario": 30 +); + #seccion1 { background-image: linear-gradient(rgb(200, 200, 200), rgb(200, 200, 200)); - background-position: left 3rem; - background-size: 100% 5rem; + background-position: left 6.3rem; + background-size: 100% (134/16)+rem; background-repeat: no-repeat; - height: 20rem; + height: (map.get($heights, "seccion1"))+rem; + margin-bottom: 2rem !important; + + .column1 { + width: (1030*2/3/16)+rem; + + .image-container { + display: flex; + justify-content: space-between; + + img { + height: 9.6875rem; + margin-top: 5rem; + } + } + } .ui.simple.segment { background: none !important; + + margin-top: 2rem !important; + + font-size: 1.1667rem; + + .header { + font-size: 1.833rem; + + margin-bottom: 1rem; + } + + } + + .grid .column { + &, & .column { + padding-top: 0; + } } img { - height: 10rem; + height: 9.6875rem; + + margin-top: 5rem; } } #seccion2 { - height: 20rem; + height: (map.get($heights, "seccion2"))+rem; background-image: url('../images/fondo23.png'); background-color: rgb(240, 240, 240); + + } #dimensiones { - height: 20rem; + height: (map.get($heights, "dimensiones"))+rem; background-image: url('../images/fondo23.png'); - background-color: rgb(240, 240, 240); } #construido { - height: 20rem; + height: (map.get($heights, "construido"))+rem; background-image: url('../images/fondo4.png'); background-color: rgb(100, 200, 255); } #corporativos { - height: 20rem; + height: (map.get($heights, "corporativos"))+rem; background-image: url('../images/fondo5.png'); - background-color: rgb(250, 250, 250); } #felices { @@ -108,31 +182,125 @@ background-size: 100% 5rem; background-repeat: no-repeat; - height: 20rem; + height: (map.get($heights, "felices"))+rem; } #formulario { - height: 30rem; + height: (map.get($heights, "formulario"))+rem; .whatsapp-link { color: inherit; } } +$column1: 0; +$sticky: 0; +@each $name, $val in $heights { + $sticky: $sticky + $val; + @if $name != 'corporativos' and $name != 'felices' and $name != 'formulario' { + $column1: $column1 + $val; + } +} #sticky_container { - position: absolute; - width: 100%; - height: 75rem; + position: relative; + height: ($column1)+rem; + top: -($sticky)+rem; - top: 30rem; - left: 1rem; - - .column { - height: inherit; + #column { + position: absolute; + width: (1030*2/3/16)+rem; + height: ($column1)+rem; + top: 0; + left: 0; padding: 0; } - .sticky .grid { - margin: 1rem !important; + .sticky { + float: right; + height: (265/16)+rem; + width: (310/16)+rem; + padding-top: ((265-170-35-16)/16)+rem; + + .row:first-child { + height: (170/16)+rem; + + .column1 { + display: inline-block; + + .titulo { + font-size: (25/12)+rem; + } + .precio { + font-size: (16/12)+rem; + } + font-size: (14/12)+rem; + + .colores { + vertical-align: center; + + .white { + border: thin solid rgb(0, 0, 0); + background-color: rgb(255, 255, 255); + } + .black { + background-color: rgb(0, 0, 0); + } + .blue { + background-color: rgb(0, 0, 255); + } + .green { + background-color: rgb(0, 255, 0); + } + .yellow { + background-color: rgb(255, 255, 0); + } + .orange { + background-color: rgb(255, 130, 0); + } + .red { + background-color: rgb(255, 0, 0); + } + .circle { + display: inline-block; + width: 1rem; + height: 1rem; + border-radius: 8000px; + } + } + .input { + width: 4.5rem; + border: thin solid rgb(0, 0, 0); + text-align: center; + padding: .5rem 0.05rem; + + button { + background: none; + border: none; + width: 1rem; + margin: 0; + padding: 0; + cursor: pointer; + } + input { + width: 2rem; + background: none; + margin: 0; + border: 0; + padding: 0; + text-align: right; + } + } + } + .column2 { + display: inline-block; + width: (170/16)+rem; + } + } + .row:last-child { + .button { + border-radius: 0 !important; + width: 100%; + } + } } } diff --git a/public/assets/images/Medidas stand.svg b/public/assets/images/Medidas stand.svg new file mode 100644 index 0000000..e54117f --- /dev/null +++ b/public/assets/images/Medidas stand.svg @@ -0,0 +1,154 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 15 cm + + + 7 cm + +7 cm + diff --git a/public/assets/images/fondo23.png b/public/assets/images/fondo23.png new file mode 100644 index 0000000000000000000000000000000000000000..7184014a3bb8626d96341083881c35cc5bd228b0 GIT binary patch literal 8758 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 HR>uDUH`Z58 literal 0 HcmV?d00001 diff --git a/public/assets/images/fondo5.png b/public/assets/images/fondo5.png new file mode 100644 index 0000000000000000000000000000000000000000..30490cbab152ef67ec1127c23b2391f793cc186e GIT binary patch literal 3302 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 literal 0 HcmV?d00001 diff --git a/public/assets/images/logo.svg b/public/assets/images/logo.svg new file mode 100644 index 0000000..4bfa1f7 --- /dev/null +++ b/public/assets/images/logo.svg @@ -0,0 +1,450 @@ + + + + + + + + + + + + + + + + + + + diff --git a/public/assets/scripts/main.js b/public/assets/scripts/main.js index d70297a..c78bae4 100644 --- a/public/assets/scripts/main.js +++ b/public/assets/scripts/main.js @@ -1,5 +1,19 @@ +function resize() { + let p = 400 / 1030 + $('.container').each(function(i, el) { + let height = $(this).height + let width = $(this).width + + $(this).width = height * p; + }) +} + $(document).ready(function() { $('.sticky').sticky({ context: '#column' }) + + $('.shopping.cart').innerText = 0 + + window.onresize = resize; }) diff --git a/public/assets/scripts/main.min.js b/public/assets/scripts/main.min.js index 09bfa51..8484da3 100644 --- a/public/assets/scripts/main.min.js +++ b/public/assets/scripts/main.min.js @@ -1,2 +1,2 @@ -$(document).ready(function(){$(".sticky").sticky({context:"#column"})}); +function resize(){$(".container").each(function(i,t){var n=$(this).height;$(this).width;$(this).width=n*(400/1030)})}$(document).ready(function(){$(".sticky").sticky({context:"#column"}),$(".shopping.cart").innerText=0,window.onresize=resize}); //# sourceMappingURL=maps/main.min.js.map diff --git a/public/assets/scripts/maps/main.min.js.map b/public/assets/scripts/maps/main.min.js.map index 0b89ab9..428deb3 100644 --- a/public/assets/scripts/maps/main.min.js.map +++ b/public/assets/scripts/maps/main.min.js.map @@ -1 +1 @@ -{"version":3,"sources":["main.js"],"names":["$","document","ready","sticky","context"],"mappings":"AAAAA,EAAEC,UAAUC,MAAM,WAChBF,EAAE,WAAWG,OAAO,CAClBC,QAAS","file":"../main.min.js","sourcesContent":["$(document).ready(function() {\r\n $('.sticky').sticky({\r\n context: '#column'\r\n })\r\n})\r\n"]} \ No newline at end of file +{"version":3,"sources":["main.js"],"names":["resize","$","each","i","el","height","this","width","ready","sticky","context","innerText","window","onresize"],"mappings":"AAAA,SAASA,SAEPC,EAAE,cAAcC,KAAK,SAAAC,EAAAC,GACnB,IAAIC,EAASJ,EAAEK,MAAMD,OACTJ,EAAEK,MAAMC,MAFtBN,EAAAK,MAAAC,MAAAF,GADQ,IAAM,QAUdJ,EAAAA,UAAEO,MAAWC,WACXC,EAAAA,WAASD,OAAA,CADXC,QAAA,YADFT,EAAA,kBAAAU,UAAA,EAOEC,OAAOC,SAAWb","file":"../main.min.js","sourcesContent":["function resize() {\r\n let p = 400 / 1030\r\n $('.container').each(function(i, el) {\r\n let height = $(this).height\r\n let width = $(this).width\r\n\r\n $(this).width = height * p;\r\n })\r\n}\r\n\r\n$(document).ready(function() {\r\n $('.sticky').sticky({\r\n context: '#column'\r\n })\r\n\r\n $('.shopping.cart').innerText = 0\r\n\r\n window.onresize = resize;\r\n})\r\n"]} \ No newline at end of file diff --git a/public/assets/styles/main.css b/public/assets/styles/main.css index c4f9307..88bee71 100644 --- a/public/assets/styles/main.css +++ b/public/assets/styles/main.css @@ -1,5 +1,66 @@ +*, *:before, *:after { + box-sizing: border-box; +} + +html, body, div, span, object, iframe, figure, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, code, em, img, small, strike, strong, sub, sup, tt, b, u, i, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td, main, canvas, embed, footer, header, nav, section, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + text-size-adjust: none; +} + +footer, header, nav, section, main { + display: block; +} + +body { + line-height: 1; +} + +ol, ul { + list-style: none; +} + +blockquote, q { + quotes: none; +} + +blockquote:before, blockquote:after, q:before, q:after { + content: ""; + content: none; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +input { + -webkit-appearance: none; + border-radius: 0; +} + +body { + font-family: Roboto, sans; +} + .ui.container { - position: relative; + max-width: 1030px; +} + +section > .container { + height: 100%; +} +section > .container > .column1 { + width: 42.9166666667rem; +} +section > .container > .column2 { + width: 21.4583333333rem; } #header { @@ -9,7 +70,9 @@ background-color: rgba(100, 100, 0, 0.3); color: white; width: 100%; - height: 30rem; +} +#header > .container { + height: 400px; } #header .ui.menu { border: none !important; @@ -24,16 +87,26 @@ } #header .ui.menu .item { color: inherit !important; + font-size: 2rem; +} +#header .ui.menu .item .shopping.cart div { + position: relative; + color: black; + display: inline-block; + top: -2.6rem; + left: 0.2rem; + font-size: 1rem; + font-family: Roboto, sans; } #header .logo { padding: 0 !important; margin: 0 !important; } #header .logo img { - width: 10rem; + width: 50%; } #header .logo .frase1 { - font-size: 2rem; + font-size: 1.5rem; } #header .logo .frase2 { font-size: 1rem; @@ -52,40 +125,60 @@ #seccion1 { background-image: linear-gradient(#c8c8c8, #c8c8c8); - background-position: left 3rem; - background-size: 100% 5rem; + background-position: left 6.3rem; + background-size: 100% 8.375rem; background-repeat: no-repeat; - height: 20rem; + height: 25rem; + margin-bottom: 2rem !important; +} +#seccion1 .column1 { + width: 42.9166666667rem; +} +#seccion1 .column1 .image-container { + display: flex; + justify-content: space-between; +} +#seccion1 .column1 .image-container img { + height: 9.6875rem; + margin-top: 5rem; } #seccion1 .ui.simple.segment { background: none !important; + margin-top: 2rem !important; + font-size: 1.1667rem; +} +#seccion1 .ui.simple.segment .header { + font-size: 1.833rem; + margin-bottom: 1rem; +} +#seccion1 .grid .column, #seccion1 .grid .column .column { + padding-top: 0; } #seccion1 img { - height: 10rem; + height: 9.6875rem; + margin-top: 5rem; } #seccion2 { - height: 20rem; + height: 27.5rem; background-image: url("../images/fondo23.png"); background-color: #f0f0f0; } #dimensiones { - height: 20rem; + height: 27.5rem; background-image: url("../images/fondo23.png"); - background-color: #f0f0f0; } #construido { - height: 20rem; + height: 21.875rem; background-image: url("../images/fondo4.png"); background-color: #64c8ff; } #corporativos { - height: 20rem; + height: 25rem; background-image: url("../images/fondo5.png"); - background-color: #fafafa; } #felices { @@ -93,7 +186,7 @@ background-position: left 3rem; background-size: 100% 5rem; background-repeat: no-repeat; - height: 20rem; + height: 21.875rem; } #formulario { @@ -104,18 +197,97 @@ } #sticky_container { - position: absolute; - width: 100%; - height: 75rem; - top: 30rem; - left: 1rem; + position: relative; + height: 101.875rem; + top: -178.75rem; } -#sticky_container .column { - height: inherit; +#sticky_container #column { + position: absolute; + width: 42.9166666667rem; + height: 101.875rem; + top: 0; + left: 0; padding: 0; } -#sticky_container .sticky .grid { - margin: 1rem !important; +#sticky_container .sticky { + float: right; + height: 16.5625rem; + width: 19.375rem; + padding-top: 2.75rem; +} +#sticky_container .sticky .row:first-child { + height: 10.625rem; +} +#sticky_container .sticky .row:first-child .column1 { + display: inline-block; + font-size: 1.1666666667rem; +} +#sticky_container .sticky .row:first-child .column1 .titulo { + font-size: 2.0833333333rem; +} +#sticky_container .sticky .row:first-child .column1 .precio { + font-size: 1.3333333333rem; +} +#sticky_container .sticky .row:first-child .column1 .colores { + vertical-align: center; +} +#sticky_container .sticky .row:first-child .column1 .colores .white { + border: thin solid black; + background-color: white; +} +#sticky_container .sticky .row:first-child .column1 .colores .black { + background-color: black; +} +#sticky_container .sticky .row:first-child .column1 .colores .blue { + background-color: blue; +} +#sticky_container .sticky .row:first-child .column1 .colores .green { + background-color: lime; +} +#sticky_container .sticky .row:first-child .column1 .colores .yellow { + background-color: yellow; +} +#sticky_container .sticky .row:first-child .column1 .colores .orange { + background-color: #ff8200; +} +#sticky_container .sticky .row:first-child .column1 .colores .red { + background-color: red; +} +#sticky_container .sticky .row:first-child .column1 .colores .circle { + display: inline-block; + width: 1rem; + height: 1rem; + border-radius: 8000px; +} +#sticky_container .sticky .row:first-child .column1 .input { + width: 4.5rem; + border: thin solid black; + text-align: center; + padding: 0.5rem 0.05rem; +} +#sticky_container .sticky .row:first-child .column1 .input button { + background: none; + border: none; + width: 1rem; + margin: 0; + padding: 0; + cursor: pointer; +} +#sticky_container .sticky .row:first-child .column1 .input input { + width: 2rem; + background: none; + margin: 0; + border: 0; + padding: 0; + text-align: right; +} +#sticky_container .sticky .row:first-child .column2 { + display: inline-block; + width: 10.625rem; +} +#sticky_container .sticky .row:last-child .button { + border-radius: 0 !important; + width: 100%; } .fondo-blanco { diff --git a/public/assets/styles/main.min.css b/public/assets/styles/main.min.css index 6df56cd..e7ea6a9 100644 --- a/public/assets/styles/main.min.css +++ b/public/assets/styles/main.min.css @@ -1,2 +1,2 @@ -.ui.container{position:relative}#header{background-image:url("../images/header.png");background-repeat:no-repeat;background-size:auto;background-color:rgba(100,100,0,.3);color:#fff;width:100%;height:30rem}#header .ui.menu{border:none !important;background:none !important;box-shadow:none !important;margin:0 !important}#header .ui.menu .dropdown .menu{background:none !important;border:none !important;box-shadow:none !important}#header .ui.menu .item{color:inherit !important}#header .logo{padding:0 !important;margin:0 !important}#header .logo img{width:10rem}#header .logo .frase1{font-size:2rem}#header .logo .frase2{font-size:1rem}.simple.segment{border:none !important;border-radius:0 !important;box-shadow:none !important;margin:0 !important;padding:0 !important}.simple.segment>.ui.grid{height:100%}#seccion1{background-image:linear-gradient(#c8c8c8, #c8c8c8);background-position:left 3rem;background-size:100% 5rem;background-repeat:no-repeat;height:20rem}#seccion1 .ui.simple.segment{background:none !important}#seccion1 img{height:10rem}#seccion2{height:20rem;background-image:url("../images/fondo23.png");background-color:#f0f0f0}#dimensiones{height:20rem;background-image:url("../images/fondo23.png");background-color:#f0f0f0}#construido{height:20rem;background-image:url("../images/fondo4.png");background-color:#64c8ff}#corporativos{height:20rem;background-image:url("../images/fondo5.png");background-color:#fafafa}#felices{background-image:linear-gradient(#c8c8c8, #c8c8c8);background-position:left 3rem;background-size:100% 5rem;background-repeat:no-repeat;height:20rem}#formulario{height:30rem}#formulario .whatsapp-link{color:inherit}#sticky_container{position:absolute;width:100%;height:75rem;top:30rem;left:1rem}#sticky_container .column{height:inherit;padding:0}#sticky_container .sticky .grid{margin:1rem !important}.fondo-blanco{background-color:rgba(255,255,255,.5)} +*,*:before,*:after{box-sizing:border-box}html,body,div,span,object,iframe,figure,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,code,em,img,small,strike,strong,sub,sup,tt,b,u,i,ol,ul,li,fieldset,form,label,table,caption,tbody,tfoot,thead,tr,th,td,main,canvas,embed,footer,header,nav,section,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;text-size-adjust:none}footer,header,nav,section,main{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}input{-webkit-appearance:none;border-radius:0}body{font-family:Roboto,sans}.ui.container{max-width:1030px}section>.container{height:100%}section>.container>.column1{width:42.9166666667rem}section>.container>.column2{width:21.4583333333rem}#header{background-image:url("../images/header.png");background-repeat:no-repeat;background-size:auto;background-color:rgba(100,100,0,.3);color:#fff;width:100%}#header>.container{height:400px}#header .ui.menu{border:none !important;background:none !important;box-shadow:none !important;margin:0 !important}#header .ui.menu .dropdown .menu{background:none !important;border:none !important;box-shadow:none !important}#header .ui.menu .item{color:inherit !important;font-size:2rem}#header .ui.menu .item .shopping.cart div{position:relative;color:#000;display:inline-block;top:-2.6rem;left:.2rem;font-size:1rem;font-family:Roboto,sans}#header .logo{padding:0 !important;margin:0 !important}#header .logo img{width:50%}#header .logo .frase1{font-size:1.5rem}#header .logo .frase2{font-size:1rem}.simple.segment{border:none !important;border-radius:0 !important;box-shadow:none !important;margin:0 !important;padding:0 !important}.simple.segment>.ui.grid{height:100%}#seccion1{background-image:linear-gradient(#c8c8c8, #c8c8c8);background-position:left 6.3rem;background-size:100% 8.375rem;background-repeat:no-repeat;height:25rem;margin-bottom:2rem !important}#seccion1 .column1{width:42.9166666667rem}#seccion1 .column1 .image-container{display:flex;justify-content:space-between}#seccion1 .column1 .image-container img{height:9.6875rem;margin-top:5rem}#seccion1 .ui.simple.segment{background:none !important;margin-top:2rem !important;font-size:1.1667rem}#seccion1 .ui.simple.segment .header{font-size:1.833rem;margin-bottom:1rem}#seccion1 .grid .column,#seccion1 .grid .column .column{padding-top:0}#seccion1 img{height:9.6875rem;margin-top:5rem}#seccion2{height:27.5rem;background-image:url("../images/fondo23.png");background-color:#f0f0f0}#dimensiones{height:27.5rem;background-image:url("../images/fondo23.png")}#construido{height:21.875rem;background-image:url("../images/fondo4.png");background-color:#64c8ff}#corporativos{height:25rem;background-image:url("../images/fondo5.png")}#felices{background-image:linear-gradient(#c8c8c8, #c8c8c8);background-position:left 3rem;background-size:100% 5rem;background-repeat:no-repeat;height:21.875rem}#formulario{height:30rem}#formulario .whatsapp-link{color:inherit}#sticky_container{position:relative;height:101.875rem;top:-178.75rem}#sticky_container #column{position:absolute;width:42.9166666667rem;height:101.875rem;top:0;left:0;padding:0}#sticky_container .sticky{float:right;height:16.5625rem;width:19.375rem;padding-top:2.75rem}#sticky_container .sticky .row:first-child{height:10.625rem}#sticky_container .sticky .row:first-child .column1{display:inline-block;font-size:1.1666666667rem}#sticky_container .sticky .row:first-child .column1 .titulo{font-size:2.0833333333rem}#sticky_container .sticky .row:first-child .column1 .precio{font-size:1.3333333333rem}#sticky_container .sticky .row:first-child .column1 .colores{vertical-align:center}#sticky_container .sticky .row:first-child .column1 .colores .white{border:thin solid #000;background-color:#fff}#sticky_container .sticky .row:first-child .column1 .colores .black{background-color:#000}#sticky_container .sticky .row:first-child .column1 .colores .blue{background-color:blue}#sticky_container .sticky .row:first-child .column1 .colores .green{background-color:lime}#sticky_container .sticky .row:first-child .column1 .colores .yellow{background-color:#ff0}#sticky_container .sticky .row:first-child .column1 .colores .orange{background-color:#ff8200}#sticky_container .sticky .row:first-child .column1 .colores .red{background-color:red}#sticky_container .sticky .row:first-child .column1 .colores .circle{display:inline-block;width:1rem;height:1rem;border-radius:8000px}#sticky_container .sticky .row:first-child .column1 .input{width:4.5rem;border:thin solid #000;text-align:center;padding:.5rem .05rem}#sticky_container .sticky .row:first-child .column1 .input button{background:none;border:none;width:1rem;margin:0;padding:0;cursor:pointer}#sticky_container .sticky .row:first-child .column1 .input input{width:2rem;background:none;margin:0;border:0;padding:0;text-align:right}#sticky_container .sticky .row:first-child .column2{display:inline-block;width:10.625rem}#sticky_container .sticky .row:last-child .button{border-radius:0 !important;width:100%}.fondo-blanco{background-color:rgba(255,255,255,.5)} /*# sourceMappingURL=maps/main.min.css.map */ diff --git a/public/assets/styles/maps/main.min.css.map b/public/assets/styles/maps/main.min.css.map index 7b4b8d1..1aa2bb5 100644 --- a/public/assets/styles/maps/main.min.css.map +++ b/public/assets/styles/maps/main.min.css.map @@ -1 +1 @@ -{"version":3,"sources":["main.css"],"names":[],"mappings":"AAAA,cACE,kBAGF,QACE,6CACA,4BACA,qBACA,oCACA,WACA,WACA,aAEF,iBACE,uBACA,2BACA,2BACA,oBAEF,iCACE,2BACA,uBACA,2BAEF,uBACE,yBAEF,cACE,qBACA,oBAEF,kBACE,YAEF,sBACE,eAEF,sBACE,eAGF,gBACE,uBACA,2BACA,2BACA,oBACA,qBAEF,yBACE,YAGF,UACE,mDACA,8BACA,0BACA,4BACA,aAEF,6BACE,2BAEF,cACE,aAGF,UACE,aACA,8CACA,yBAGF,aACE,aACA,8CACA,yBAGF,YACE,aACA,6CACA,yBAGF,cACE,aACA,6CACA,yBAGF,SACE,mDACA,8BACA,0BACA,4BACA,aAGF,YACE,aAEF,2BACE,cAGF,kBACE,kBACA,WACA,aACA,UACA,UAEF,0BACE,eACA,UAEF,gCACE,uBAGF,cACE","file":"../main.min.css","sourcesContent":[".ui.container {\n position: relative;\n}\n\n#header {\n background-image: url(\"../images/header.png\");\n background-repeat: no-repeat;\n background-size: auto;\n background-color: rgba(100, 100, 0, 0.3);\n color: white;\n width: 100%;\n height: 30rem;\n}\n#header .ui.menu {\n border: none !important;\n background: none !important;\n box-shadow: none !important;\n margin: 0 !important;\n}\n#header .ui.menu .dropdown .menu {\n background: none !important;\n border: none !important;\n box-shadow: none !important;\n}\n#header .ui.menu .item {\n color: inherit !important;\n}\n#header .logo {\n padding: 0 !important;\n margin: 0 !important;\n}\n#header .logo img {\n width: 10rem;\n}\n#header .logo .frase1 {\n font-size: 2rem;\n}\n#header .logo .frase2 {\n font-size: 1rem;\n}\n\n.simple.segment {\n border: none !important;\n border-radius: 0 !important;\n box-shadow: none !important;\n margin: 0 !important;\n padding: 0 !important;\n}\n.simple.segment > .ui.grid {\n height: 100%;\n}\n\n#seccion1 {\n background-image: linear-gradient(#c8c8c8, #c8c8c8);\n background-position: left 3rem;\n background-size: 100% 5rem;\n background-repeat: no-repeat;\n height: 20rem;\n}\n#seccion1 .ui.simple.segment {\n background: none !important;\n}\n#seccion1 img {\n height: 10rem;\n}\n\n#seccion2 {\n height: 20rem;\n background-image: url(\"../images/fondo23.png\");\n background-color: #f0f0f0;\n}\n\n#dimensiones {\n height: 20rem;\n background-image: url(\"../images/fondo23.png\");\n background-color: #f0f0f0;\n}\n\n#construido {\n height: 20rem;\n background-image: url(\"../images/fondo4.png\");\n background-color: #64c8ff;\n}\n\n#corporativos {\n height: 20rem;\n background-image: url(\"../images/fondo5.png\");\n background-color: #fafafa;\n}\n\n#felices {\n background-image: linear-gradient(#c8c8c8, #c8c8c8);\n background-position: left 3rem;\n background-size: 100% 5rem;\n background-repeat: no-repeat;\n height: 20rem;\n}\n\n#formulario {\n height: 30rem;\n}\n#formulario .whatsapp-link {\n color: inherit;\n}\n\n#sticky_container {\n position: absolute;\n width: 100%;\n height: 75rem;\n top: 30rem;\n left: 1rem;\n}\n#sticky_container .column {\n height: inherit;\n padding: 0;\n}\n#sticky_container .sticky .grid {\n margin: 1rem !important;\n}\n\n.fondo-blanco {\n background-color: rgba(255, 255, 255, 0.5);\n}"]} \ No newline at end of file +{"version":3,"sources":["main.css"],"names":[],"mappings":"AAAA,mBACE,sBAGF,sPACE,SACA,UACA,SACA,eACA,aACA,wBACA,kCACA,mCACA,sBAGF,+BACE,cAGF,KACE,cAGF,MACE,gBAGF,aACE,YAGF,oDACE,WACA,aAGF,MACE,yBACA,iBAGF,MACE,wBACA,gBAGF,KACE,wBAGF,cACE,iBAGF,mBACE,YAEF,4BACE,uBAEF,4BACE,uBAGF,QACE,6CACA,4BACA,qBACA,oCACA,WACA,WAEF,mBACE,aAEF,iBACE,uBACA,2BACA,2BACA,oBAEF,iCACE,2BACA,uBACA,2BAEF,uBACE,yBACA,eAEF,0CACE,kBACA,WACA,qBACA,YACA,WACA,eACA,wBAEF,cACE,qBACA,oBAEF,kBACE,UAEF,sBACE,iBAEF,sBACE,eAGF,gBACE,uBACA,2BACA,2BACA,oBACA,qBAEF,yBACE,YAGF,UACE,mDACA,gCACA,8BACA,4BACA,aACA,8BAEF,mBACE,uBAEF,oCACE,aACA,8BAEF,wCACE,iBACA,gBAEF,6BACE,2BACA,2BACA,oBAEF,qCACE,mBACA,mBAEF,wDACE,cAEF,cACE,iBACA,gBAGF,UACE,eACA,8CACA,yBAGF,aACE,eACA,8CAGF,YACE,iBACA,6CACA,yBAGF,cACE,aACA,6CAGF,SACE,mDACA,8BACA,0BACA,4BACA,iBAGF,YACE,aAEF,2BACE,cAGF,kBACE,kBACA,kBACA,eAEF,0BACE,kBACA,uBACA,kBACA,MACA,OACA,UAEF,0BACE,YACA,kBACA,gBACA,oBAEF,2CACE,iBAEF,oDACE,qBACA,0BAEF,4DACE,0BAEF,4DACE,0BAEF,6DACE,sBAEF,oEACE,uBACA,sBAEF,oEACE,sBAEF,mEACE,sBAEF,oEACE,sBAEF,qEACE,sBAEF,qEACE,yBAEF,kEACE,qBAEF,qEACE,qBACA,WACA,YACA,qBAEF,2DACE,aACA,uBACA,kBACA,qBAEF,kEACE,gBACA,YACA,WACA,SACA,UACA,eAEF,iEACE,WACA,gBACA,SACA,SACA,UACA,iBAEF,oDACE,qBACA,gBAEF,kDACE,2BACA,WAGF,cACE","file":"../main.min.css","sourcesContent":["*, *:before, *:after {\n box-sizing: border-box;\n}\n\nhtml, body, div, span, object, iframe, figure, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, code, em, img, small, strike, strong, sub, sup, tt, b, u, i, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td, main, canvas, embed, footer, header, nav, section, video {\n margin: 0;\n padding: 0;\n border: 0;\n font-size: 100%;\n font: inherit;\n vertical-align: baseline;\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n text-size-adjust: none;\n}\n\nfooter, header, nav, section, main {\n display: block;\n}\n\nbody {\n line-height: 1;\n}\n\nol, ul {\n list-style: none;\n}\n\nblockquote, q {\n quotes: none;\n}\n\nblockquote:before, blockquote:after, q:before, q:after {\n content: \"\";\n content: none;\n}\n\ntable {\n border-collapse: collapse;\n border-spacing: 0;\n}\n\ninput {\n -webkit-appearance: none;\n border-radius: 0;\n}\n\nbody {\n font-family: Roboto, sans;\n}\n\n.ui.container {\n max-width: 1030px;\n}\n\nsection > .container {\n height: 100%;\n}\nsection > .container > .column1 {\n width: 42.9166666667rem;\n}\nsection > .container > .column2 {\n width: 21.4583333333rem;\n}\n\n#header {\n background-image: url(\"../images/header.png\");\n background-repeat: no-repeat;\n background-size: auto;\n background-color: rgba(100, 100, 0, 0.3);\n color: white;\n width: 100%;\n}\n#header > .container {\n height: 400px;\n}\n#header .ui.menu {\n border: none !important;\n background: none !important;\n box-shadow: none !important;\n margin: 0 !important;\n}\n#header .ui.menu .dropdown .menu {\n background: none !important;\n border: none !important;\n box-shadow: none !important;\n}\n#header .ui.menu .item {\n color: inherit !important;\n font-size: 2rem;\n}\n#header .ui.menu .item .shopping.cart div {\n position: relative;\n color: black;\n display: inline-block;\n top: -2.6rem;\n left: 0.2rem;\n font-size: 1rem;\n font-family: Roboto, sans;\n}\n#header .logo {\n padding: 0 !important;\n margin: 0 !important;\n}\n#header .logo img {\n width: 50%;\n}\n#header .logo .frase1 {\n font-size: 1.5rem;\n}\n#header .logo .frase2 {\n font-size: 1rem;\n}\n\n.simple.segment {\n border: none !important;\n border-radius: 0 !important;\n box-shadow: none !important;\n margin: 0 !important;\n padding: 0 !important;\n}\n.simple.segment > .ui.grid {\n height: 100%;\n}\n\n#seccion1 {\n background-image: linear-gradient(#c8c8c8, #c8c8c8);\n background-position: left 6.3rem;\n background-size: 100% 8.375rem;\n background-repeat: no-repeat;\n height: 25rem;\n margin-bottom: 2rem !important;\n}\n#seccion1 .column1 {\n width: 42.9166666667rem;\n}\n#seccion1 .column1 .image-container {\n display: flex;\n justify-content: space-between;\n}\n#seccion1 .column1 .image-container img {\n height: 9.6875rem;\n margin-top: 5rem;\n}\n#seccion1 .ui.simple.segment {\n background: none !important;\n margin-top: 2rem !important;\n font-size: 1.1667rem;\n}\n#seccion1 .ui.simple.segment .header {\n font-size: 1.833rem;\n margin-bottom: 1rem;\n}\n#seccion1 .grid .column, #seccion1 .grid .column .column {\n padding-top: 0;\n}\n#seccion1 img {\n height: 9.6875rem;\n margin-top: 5rem;\n}\n\n#seccion2 {\n height: 27.5rem;\n background-image: url(\"../images/fondo23.png\");\n background-color: #f0f0f0;\n}\n\n#dimensiones {\n height: 27.5rem;\n background-image: url(\"../images/fondo23.png\");\n}\n\n#construido {\n height: 21.875rem;\n background-image: url(\"../images/fondo4.png\");\n background-color: #64c8ff;\n}\n\n#corporativos {\n height: 25rem;\n background-image: url(\"../images/fondo5.png\");\n}\n\n#felices {\n background-image: linear-gradient(#c8c8c8, #c8c8c8);\n background-position: left 3rem;\n background-size: 100% 5rem;\n background-repeat: no-repeat;\n height: 21.875rem;\n}\n\n#formulario {\n height: 30rem;\n}\n#formulario .whatsapp-link {\n color: inherit;\n}\n\n#sticky_container {\n position: relative;\n height: 101.875rem;\n top: -178.75rem;\n}\n#sticky_container #column {\n position: absolute;\n width: 42.9166666667rem;\n height: 101.875rem;\n top: 0;\n left: 0;\n padding: 0;\n}\n#sticky_container .sticky {\n float: right;\n height: 16.5625rem;\n width: 19.375rem;\n padding-top: 2.75rem;\n}\n#sticky_container .sticky .row:first-child {\n height: 10.625rem;\n}\n#sticky_container .sticky .row:first-child .column1 {\n display: inline-block;\n font-size: 1.1666666667rem;\n}\n#sticky_container .sticky .row:first-child .column1 .titulo {\n font-size: 2.0833333333rem;\n}\n#sticky_container .sticky .row:first-child .column1 .precio {\n font-size: 1.3333333333rem;\n}\n#sticky_container .sticky .row:first-child .column1 .colores {\n vertical-align: center;\n}\n#sticky_container .sticky .row:first-child .column1 .colores .white {\n border: thin solid black;\n background-color: white;\n}\n#sticky_container .sticky .row:first-child .column1 .colores .black {\n background-color: black;\n}\n#sticky_container .sticky .row:first-child .column1 .colores .blue {\n background-color: blue;\n}\n#sticky_container .sticky .row:first-child .column1 .colores .green {\n background-color: lime;\n}\n#sticky_container .sticky .row:first-child .column1 .colores .yellow {\n background-color: yellow;\n}\n#sticky_container .sticky .row:first-child .column1 .colores .orange {\n background-color: #ff8200;\n}\n#sticky_container .sticky .row:first-child .column1 .colores .red {\n background-color: red;\n}\n#sticky_container .sticky .row:first-child .column1 .colores .circle {\n display: inline-block;\n width: 1rem;\n height: 1rem;\n border-radius: 8000px;\n}\n#sticky_container .sticky .row:first-child .column1 .input {\n width: 4.5rem;\n border: thin solid black;\n text-align: center;\n padding: 0.5rem 0.05rem;\n}\n#sticky_container .sticky .row:first-child .column1 .input button {\n background: none;\n border: none;\n width: 1rem;\n margin: 0;\n padding: 0;\n cursor: pointer;\n}\n#sticky_container .sticky .row:first-child .column1 .input input {\n width: 2rem;\n background: none;\n margin: 0;\n border: 0;\n padding: 0;\n text-align: right;\n}\n#sticky_container .sticky .row:first-child .column2 {\n display: inline-block;\n width: 10.625rem;\n}\n#sticky_container .sticky .row:last-child .button {\n border-radius: 0 !important;\n width: 100%;\n}\n\n.fondo-blanco {\n background-color: rgba(255, 255, 255, 0.5);\n}"]} \ No newline at end of file diff --git a/public/index.html b/public/index.html index bc72475..5145d28 100644 --- a/public/index.html +++ b/public/index.html @@ -5,11 +5,14 @@ Stand + + + -
-
+ -
-
-
-
-
- -
-
- -
-
- -
+
+
+
+
+ + + +
+

+

+ LOREM IPSUM DOLOR SIT AMET, CONSECTETUR
-
-
- 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 -
+ 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 +

-
+
-
-
-
-
-
- -
-
-
+
+
+
+
-
+
+
-
- 3 -
+
+
+ DIMENSIONES +
+
-
+
+
+
+ CONSTRUIDOS EN IMPRESIÓN 3D +
+
+
+
+
+ +
+
- 4 -
-
-
-
- -
-
-
- 5 + CORPORATIVOS
COTIZA CON NOSOSTROS
-
+ +
-
+
+
CLIENTES FELICES -
+ +
-
+
+
@@ -124,23 +126,40 @@
-
+ +
-
-
-
-
-
-
- STAND
- $ 5.990
- COLOR -
-
- -
+
+
+
+
+
+
+ STAND +
+
+ $ 5.990 +
+
+ COLOR +
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+