diff --git a/assets/js/main.js b/assets/js/main.js new file mode 100644 index 0000000..d70297a --- /dev/null +++ b/assets/js/main.js @@ -0,0 +1,5 @@ +$(document).ready(function() { + $('.sticky').sticky({ + context: '#column' + }) +}) diff --git a/assets/sass/main.scss b/assets/sass/main.scss new file mode 100644 index 0000000..70711a1 --- /dev/null +++ b/assets/sass/main.scss @@ -0,0 +1,141 @@ +.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: rgb(255, 255, 255); + + width: 100%; + height: 30rem; + + .ui.menu { + border: none !important; + background: none !important; + box-shadow: none !important; + margin: 0 !important; + + .dropdown .menu { + background: none !important; + border: none !important; + box-shadow: none !important; + } + + .item { + color: inherit !important; + } + } + + .logo { + padding: 0 !important; + margin: 0 !important; + + img { + width: 10rem; + } + .frase1 { + font-size: 2rem; + } + .frase2 { + font-size: 1rem; + } + } +} + +.simple.segment { + border: none !important; + border-radius: 0 !important; + box-shadow: none !important; + margin: 0 !important; + padding: 0 !important; + + &>.ui.grid { + height: 100%; + } +} + +#seccion1 { + background-image: linear-gradient(rgb(200, 200, 200), rgb(200, 200, 200)); + background-position: left 3rem; + background-size: 100% 5rem; + background-repeat: no-repeat; + + height: 20rem; + + .ui.simple.segment { + background: none !important; + } + + img { + height: 10rem; + } +} + +#seccion2 { + height: 20rem; + + background-image: url('../images/fondo23.png'); + background-color: rgb(240, 240, 240); +} + +#dimensiones { + height: 20rem; + + background-image: url('../images/fondo23.png'); + background-color: rgb(240, 240, 240); +} + +#construido { + height: 20rem; + + background-image: url('../images/fondo4.png'); + background-color: rgb(100, 200, 255); +} + +#corporativos { + height: 20rem; + + background-image: url('../images/fondo5.png'); + background-color: rgb(250, 250, 250); +} + +#felices { + background-image: linear-gradient(rgb(200, 200, 200), rgb(200, 200, 200)); + background-position: left 3rem; + background-size: 100% 5rem; + background-repeat: no-repeat; + + height: 20rem; +} + +#formulario { + height: 30rem; + + .whatsapp-link { + color: inherit; + } +} + +#sticky_container { + position: absolute; + width: 100%; + height: 75rem; + + top: 30rem; + left: 1rem; + + .column { + height: inherit; + padding: 0; + } + .sticky .grid { + margin: 1rem !important; + } +} + +.fondo-blanco { + background-color: rgba(255, 255, 255, .5); +}