Base
This commit is contained in:
5
public/assets/scripts/main.js
Normal file
5
public/assets/scripts/main.js
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
$(document).ready(function() {
|
||||||
|
$('.sticky').sticky({
|
||||||
|
context: '#column'
|
||||||
|
})
|
||||||
|
})
|
2
public/assets/scripts/main.min.js
vendored
Normal file
2
public/assets/scripts/main.min.js
vendored
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
$(document).ready(function(){$(".sticky").sticky({context:"#column"})});
|
||||||
|
//# sourceMappingURL=maps/main.min.js.map
|
1
public/assets/scripts/maps/main.min.js.map
Normal file
1
public/assets/scripts/maps/main.min.js.map
Normal file
@ -0,0 +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"]}
|
123
public/assets/styles/main.css
Normal file
123
public/assets/styles/main.css
Normal file
@ -0,0 +1,123 @@
|
|||||||
|
.ui.container {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
#header {
|
||||||
|
background-image: url("../images/header.png");
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: auto;
|
||||||
|
background-color: rgba(100, 100, 0, 0.3);
|
||||||
|
color: white;
|
||||||
|
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, 0.5);
|
||||||
|
}
|
2
public/assets/styles/main.min.css
vendored
Normal file
2
public/assets/styles/main.min.css
vendored
Normal file
@ -0,0 +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)}
|
||||||
|
/*# sourceMappingURL=maps/main.min.css.map */
|
1
public/assets/styles/maps/main.min.css.map
Normal file
1
public/assets/styles/maps/main.min.css.map
Normal file
@ -0,0 +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}"]}
|
152
public/index.html
Normal file
152
public/index.html
Normal file
@ -0,0 +1,152 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="es">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<title>Stand</title>
|
||||||
|
<meta name="keywords" content="stand, chile, celular, smartphone, telefono" />
|
||||||
|
<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="stylesheet" href="./assets/styles/main.min.css" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="ui container">
|
||||||
|
<header id="header">
|
||||||
|
<nav class="ui borderless menu">
|
||||||
|
<div class="ui simple dropdown item">
|
||||||
|
<div class="text">
|
||||||
|
<i class="bars icon"></i>
|
||||||
|
</div>
|
||||||
|
<div class="menu">
|
||||||
|
<a class="item" href="./">Inicio</a>
|
||||||
|
<a class="item" href="./#seccion1">Seccion 1</a>
|
||||||
|
<a class="item" href="./#seccion2">Seccion 2</a>
|
||||||
|
<a class="item" href="./#dimensiones">Dimensiones</a>
|
||||||
|
<a class="item" href="./#construido">Constrido en Impresora 3D</a>
|
||||||
|
<a class="item" href="./#corporativos">Regalos Corporativos</a>
|
||||||
|
<a class="item" href="./#felices">Clientes Felices</a>
|
||||||
|
<a class="item" href="./#formulario">Conversemos</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="right menu">
|
||||||
|
<a class="item" href="./#formulario">
|
||||||
|
<i class="shopping cart icon"></i>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<div class="logo ui center aligned basic segment">
|
||||||
|
<img src="./assets/images/logo.png" />
|
||||||
|
<div class="frase1">
|
||||||
|
SOPORTES PARA SMARTPHONE Y TABLETS
|
||||||
|
</div>
|
||||||
|
<div class="frase2">
|
||||||
|
Diseñado y Fabricado en Chile
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<section id="seccion1" class="ui simple segment">
|
||||||
|
<div class="ui grid">
|
||||||
|
<div class="ten wide column">
|
||||||
|
<div class="ui center aligned three columns wide grid">
|
||||||
|
<div class="column">
|
||||||
|
<img src="./assets/images/tablet-front.png" />
|
||||||
|
</div>
|
||||||
|
<div class="column">
|
||||||
|
<img src="./assets/images/tablet-back.png" />
|
||||||
|
</div>
|
||||||
|
<div class="column">
|
||||||
|
<img src="./assets/images/phone.png" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="ui simple segment">
|
||||||
|
<div class="header">
|
||||||
|
LOREM IPSUM DOLOR SIT AMET, CONSECTETUR
|
||||||
|
</div>
|
||||||
|
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
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="seccion2" class="ui simple segment">
|
||||||
|
<div class="ui grid">
|
||||||
|
<div class="ten wide column">
|
||||||
|
<div class="ui grid">
|
||||||
|
<div class="eight wide column">
|
||||||
|
<img src="./assets/images/phone-pc.png" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="dimensiones" class="ui simple segment">
|
||||||
|
3
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="construido" class="ui simple segment">
|
||||||
|
<div class="ui grid">
|
||||||
|
<div class="ten wide column">
|
||||||
|
4
|
||||||
|
</div>
|
||||||
|
<div class="six wide column fondo-blanco">
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="corporativos" class="ui simple segment">
|
||||||
|
<div class="ui grid">
|
||||||
|
<div class="ten wide column">
|
||||||
|
5
|
||||||
|
</div>
|
||||||
|
<div class="six wide column fondo-blanco">
|
||||||
|
COTIZA CON NOSOSTROS
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="felices" class="ui simple segment">
|
||||||
|
CLIENTES FELICES
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="formulario" class="ui simple segment">
|
||||||
|
<div class="ui grid">
|
||||||
|
<div class="eight wide column">
|
||||||
|
</div>
|
||||||
|
<div class="eight wide column">
|
||||||
|
<div class="ui grid">
|
||||||
|
<div class="five wide column">
|
||||||
|
</div>
|
||||||
|
<div class="center aligned eleven wide column">
|
||||||
|
CONVERSEMOS! <a href="whatsapp" class="whatsapp-link"><i class="green whatsapp icon"></i></a>
|
||||||
|
<form class="ui form">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<div class="ui grid" id="sticky_container">
|
||||||
|
<div class="ten wide column" id="column"></div>
|
||||||
|
<div class="five wide column">
|
||||||
|
<div class="ui sticky">
|
||||||
|
<div class="ui grid">
|
||||||
|
<div class="ten wide column">
|
||||||
|
STAND<br />
|
||||||
|
$ 5.990<br />
|
||||||
|
COLOR
|
||||||
|
</div>
|
||||||
|
<div class="six wide column">
|
||||||
|
<img src="./assets/images/stand.png" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Scripts -->
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha512-bLT0Qm9VnAYZDflyKcBaQ2gg0hSYNQrJ8RilYldYQ1FxQYoCLtUjuuRuZo+fjqhx/qtq/1itJ0C2ejDxltZVFg==" crossorigin="anonymous"></script>
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.7/semantic.min.js" integrity="sha512-1Nyd5H4Aad+OyvVfUOkO/jWPCrEvYIsQENdnVXt1+Jjc4NoJw28nyRdrpOCyFH4uvR3JmH/5WmfX1MJk2ZlhgQ==" crossorigin="anonymous"></script>
|
||||||
|
<script type="text/javascript" src="./assets/scripts/main.min.js"></script>
|
||||||
|
</body>
|
Reference in New Issue
Block a user