diff --git a/dist/css/base.css b/dist/css/base.css index a6e0823..36e01bd 100644 --- a/dist/css/base.css +++ b/dist/css/base.css @@ -1 +1 @@ -@import"https://fonts.googleapis.com/css?family=Muli|Open+Sans";*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:"Open Sans",sans-serif}header{background-color:#44a;box-shadow:0 5px 5px #999}nav{background-color:#3d3d7c;color:#fff}section{overflow:hidden;transition:height 150ms ease-out;height:auto}footer{background-color:#333;color:#eee;box-shadow:inset 0 5px 5px #999;padding:40px}.contenedor{max-width:1200px;width:80%;margin:auto}.col-1{width:8.33%}.col-2{width:16.66%}.col-3{width:25%}.col-4{width:33.33%}.col-5{width:41.66%}.col-6{width:50%}.col-7{width:58.33%}.col-8{width:66.66%}.col-9{width:75%}.col-10{width:83.33%}.col-11{width:91.66%}.col-12{width:100%}[class*=col-]{float:left}.row::after{content:"";clear:both;display:table}.center{text-align:center}#tituloP{padding:30px;color:#fff;font-size:50px;font-family:"Muli"}#tituloP--descripcion{padding:10px;font-size:large;font-family:"Open Sans"}.center{text-align:center}.boton{display:inline-block;margin:20px;border-radius:3px;box-shadow:1px 1px 3px #090909;padding:10px 30px;cursor:pointer;text-decoration:none}.mySeccion{overflow:hidden;transition:height 150ms ease-out;height:auto}#botonRegistro{background-color:green;color:#fff;font-size:large;transition:transform 200ms,box-shadow 200ms}#botonRegistro:hover{transform:translate(-1px, -1px);box-shadow:2px 2px 7px #050505}#botonInicioSesion{background-color:#fff;transition:transform 200ms,box-shadow 200ms}#botonInicioSesion:hover{transform:translate(-1px, -1px);box-shadow:2px 2px 7px #050505}#botonInicioSesion:visited{color:#000}.contenido{margin:40px 0}.image{padding:0 20px;width:100%;height:auto}.descripcionComida{padding:0 30px;text-align:center;font-size:large}.inicio_registro{color:#fff}input{min-width:80%;min-height:40px;padding:10px;color:#44a;font-size:large}.botonEnviarForm{background-color:#fff;box-shadow:1px 1px 2px gray;cursor:pointer;border:none;transition:background-color 250ms,color 250ms,transform 250ms,box-shadow 250ms}.botonEnviarForm:hover{background-color:#4949e2;color:#fff;transform:translate(-1px, -1px);box-shadow:2px 2px 2px gray}.google-button{height:40px;border-width:0;background:#fff;color:#737373;border-radius:5px;white-space:nowrap;box-shadow:1px 1px 0 1px rgba(0,0,0,.05);transition-property:background-color,box-shadow;transition-duration:150ms;transition-timing-function:ease-in-out;padding:0;cursor:pointer}.google-button:focus,.google-button:hover{box-shadow:1px 4px 5px 1px rgba(0,0,0,.1)}.google-button:active{background-color:#e5e5e5;box-shadow:none;transition-duration:10ms}.google-button__icon{display:inline-block;vertical-align:middle;margin:8px 0 8px 8px;width:18px;height:18px;box-sizing:border-box}.google-button__text{display:inline-block;vertical-align:middle;padding:0 24px;font-size:14px;font-weight:bold;font-family:"Roboto",arial,sans-serif}.unseen{visibility:hidden}.botonAddCart{background-color:#fff;padding:5px;color:#44a;box-shadow:.1px .1px gray;border-radius:2px;cursor:pointer;font-size:large;transition:background-color 250ms,color 250ms;user-select:none}.botonAddCart:hover{background-color:#44a;color:#fff}.caja{border-radius:4px;box-shadow:1px 1px 2px gray;padding:15px}.botonPayPal,.botonVisa{background-color:#0070ba;color:#fff;font-size:large;padding:10px;border:none;border-radius:5px;cursor:pointer;margin:0 5px}.botonVisa{background-color:#1a1f5e}.linksNavBar{margin:0}.linksNavBar li{list-style:none;float:left;transition:background-color 250ms}.linksNavBar li a{cursor:pointer;display:inline-block;padding:15px;color:#fff;text-decoration:none}.linksNavBar li:after{clear:both}.linksNavBar li:hover{background-color:#35356a}.plato--Titulo{font-size:x-large;font-weight:bold;font-family:"Muli";color:#3d3d7c}.plato--Descripcion{font-size:large;color:#333}.plato--Precio{font-size:large}.plato--Precio:before{color:green;content:"Precio unitario: "}.plato--Precio:after{content:" S/."}.plato--Cantidad{font-size:large;font-weight:bold;display:inline-table;padding:15px}.plato--Cantidad--Icon{display:table-cell;vertical-align:top;cursor:pointer;transition:color 250ms;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.plato--Cantidad--Icon:hover{color:#44a}.carrito{text-align:left}#carrito--elementos,#carrito--precio{padding:0 10px}.carritoElem:after{clear:both}.carritoElem--img{float:left;margin:10px 20px;width:200px}.carrito--subTotal{text-align:right;font-weight:bold;font-family:"Muli",sans-serif;font-size:x-large}.carrito--subTotal:before{content:"Subtotal: "}.carrito--subTotal:after{content:" S/."}.carrito--precio--contenido--titulo{text-align:center;font-family:"Muli",sans-serif;font-size:x-large;font-weight:900}.carrito--precio--contenido--botonPagar{display:inline-block;width:100%;text-align:center;padding:10px;background-color:#44a;color:#fff;border-radius:3px;cursor:pointer}.carrito--precio--contenido--botonPagar:hover{background-color:#3d3d7c}#carrito--boton--seguircomprando{margin:10px 0;padding:10px 20px;background-color:green;color:#fff;text-decoration:none;border-radius:4px}#carrito--boton--seguircomprando:visited{color:#fff}#carrito--tituloprincipal{text-align:center;font-size:xx-large;font-family:"Muli",sans-serif;font-weight:900;margin:10px 0}/*# sourceMappingURL=base.css.map */ +@import"https://fonts.googleapis.com/css?family=Muli|Open+Sans";*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:"Open Sans",sans-serif}header{background-color:#44a;box-shadow:0 5px 5px #999}nav{background-color:#3d3d7c;color:#fff}section{overflow:hidden;transition:height 150ms ease-out;height:auto}footer{background-color:#333;color:#eee;box-shadow:inset 0 5px 5px #999;padding:40px}.contenedor{max-width:1200px;width:80%;margin:auto}.col-1{width:8.33%}.col-2{width:16.66%}.col-3{width:25%}.col-4{width:33.33%}.col-5{width:41.66%}.col-6{width:50%}.col-7{width:58.33%}.col-8{width:66.66%}.col-9{width:75%}.col-10{width:83.33%}.col-11{width:91.66%}.col-12{width:100%}[class*=col-]{float:left}.row::after{content:"";clear:both;display:table}.center{text-align:center}#tituloP{padding:30px;color:#fff;font-size:50px;font-family:"Muli"}#tituloP--descripcion{padding:10px;font-size:large;font-family:"Open Sans"}.tituloP--mini{padding:10px !important;font-size:40px !important}.titulo--link{color:#fff;text-decoration:none}.center{text-align:center}.boton{display:inline-block;margin:20px;border-radius:3px;box-shadow:1px 1px 3px #090909;padding:10px 30px;cursor:pointer;text-decoration:none}.mySeccion{overflow:hidden;transition:height 150ms ease-out;height:auto}#botonRegistro{background-color:green;color:#fff;font-size:large;transition:transform 200ms,box-shadow 200ms}#botonRegistro:hover{transform:translate(-1px, -1px);box-shadow:2px 2px 7px #050505}#botonInicioSesion{background-color:#fff;transition:transform 200ms,box-shadow 200ms}#botonInicioSesion:hover{transform:translate(-1px, -1px);box-shadow:2px 2px 7px #050505}#botonInicioSesion:visited{color:#000}.contenido{margin:40px 0}.image{padding:0 20px;width:100%;height:auto}.descripcionComida{padding:0 30px;text-align:center;font-size:large}.inicio_registro{color:#fff}input{min-width:80%;min-height:40px;padding:10px;color:#44a;font-size:large}.botonEnviarForm{background-color:#fff;box-shadow:1px 1px 2px gray;cursor:pointer;border:none;transition:background-color 250ms,color 250ms,transform 250ms,box-shadow 250ms}.botonEnviarForm:hover{background-color:#4949e2;color:#fff;transform:translate(-1px, -1px);box-shadow:2px 2px 2px gray}.google-button{height:40px;border-width:0;background:#fff;color:#737373;border-radius:5px;white-space:nowrap;box-shadow:1px 1px 0 1px rgba(0,0,0,.05);transition-property:background-color,box-shadow;transition-duration:150ms;transition-timing-function:ease-in-out;padding:0;cursor:pointer}.google-button:focus,.google-button:hover{box-shadow:1px 4px 5px 1px rgba(0,0,0,.1)}.google-button:active{background-color:#e5e5e5;box-shadow:none;transition-duration:10ms}.google-button__icon{display:inline-block;vertical-align:middle;margin:8px 0 8px 8px;width:18px;height:18px;box-sizing:border-box}.google-button__text{display:inline-block;vertical-align:middle;padding:0 24px;font-size:14px;font-weight:bold;font-family:"Roboto",arial,sans-serif}.unseen{visibility:hidden}.botonAddCart{background-color:#fff;padding:5px;color:#44a;box-shadow:.1px .1px gray;border-radius:2px;cursor:pointer;font-size:large;transition:background-color 250ms,color 250ms;user-select:none}.botonAddCart:hover{background-color:#44a;color:#fff}.caja{border-radius:4px;box-shadow:1px 1px 2px gray;padding:15px}.botonPayPal,.botonVisa{background-color:#0070ba;color:#fff;font-size:large;padding:10px;border:none;border-radius:5px;cursor:pointer;margin:0 5px}.botonVisa{background-color:#1a1f5e}.linksNavBar{margin:0}.linksNavBar li{list-style:none;float:left;transition:background-color 250ms}.linksNavBar li a{cursor:pointer;display:inline-block;padding:15px;color:#fff;text-decoration:none}.linksNavBar li:after{clear:both}.linksNavBar li:hover{background-color:#35356a}.plato--Titulo{font-size:x-large;font-weight:bold;font-family:"Muli";color:#3d3d7c}.plato--Descripcion{font-size:large;color:#333}.plato--Precio{font-size:large}.plato--Precio:before{color:green;content:"Precio unitario: "}.plato--Precio:after{content:" S/."}.plato--Cantidad{font-size:large;font-weight:bold;display:inline-table;padding:15px}.plato--Cantidad--Icon{display:table-cell;vertical-align:top;cursor:pointer;transition:color 250ms;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.plato--Cantidad--Icon:hover{color:#44a}.carrito{text-align:left}#carrito--elementos,#carrito--precio{padding:0 10px}.carritoElem:after{clear:both}.carritoElem--img{float:left;margin:10px 20px;width:200px}.carrito--subTotal{text-align:right;font-weight:bold;font-family:"Muli",sans-serif;font-size:x-large}.carrito--subTotal:before{content:"Subtotal: "}.carrito--subTotal:after{content:" S/."}.carrito--precio--contenido--titulo{text-align:center;font-family:"Muli",sans-serif;font-size:x-large;font-weight:900}.carrito--precio--contenido--botonPagar{display:inline-block;width:100%;text-align:center;padding:10px;background-color:#44a;color:#fff;border-radius:3px;cursor:pointer}.carrito--precio--contenido--botonPagar:hover{background-color:#3d3d7c}#carrito--boton--seguircomprando{margin:10px 0;padding:10px 20px;background-color:green;color:#fff;text-decoration:none;border-radius:4px}#carrito--boton--seguircomprando:visited{color:#fff}#carrito--tituloprincipal{text-align:center;font-size:xx-large;font-family:"Muli",sans-serif;font-weight:900;margin:10px 0}.responsive-image{padding:0 20px;width:100%;height:auto}.tienda--titulo{text-align:center;font-family:"Muli",sans-serif;font-size:xx-large;font-weight:900;margin:10px 0}.tienda--tarjeta{padding:10px;margin:10px 5px;border-radius:3px;box-shadow:2px 2px 5px gray}.tienda--tarjeta--titulo{font-size:x-large;font-family:"Muli",sans-serif;color:#3d3d7c}.tienda--tarjeta--precio:before{content:"Precio unitario: ";color:green}.tienda--tarjeta--precio:after{content:" S/."}.tienda--tarjeta--cantidad:before{content:"Cantidad remove "}.tienda--tarjeta--botonComprar{background-color:#fff;color:#3d3d7c;padding:10px;cursor:pointer;border-radius:3px;transition:color 100ms,background-color 100ms;font-size:large;font-weight:bold;font-family:"Muli"}.tienda--tarjeta--botonComprar:hover{background-color:#3d3d7c;color:#fff}/*# sourceMappingURL=base.css.map */ diff --git a/index.php b/index.php index 5a27064..9e80f46 100644 --- a/index.php +++ b/index.php @@ -40,6 +40,10 @@ const headerMin = { template: `` }; +const headerMini = { + template: `` +}; + const inicio = { template: ``, components: { @@ -49,11 +53,53 @@ const inicio = { } }; +const tienda = function (resolve, reject) { + const ajax1 = new XMLHttpRequest(); + const ajax2 = new XMLHttpRequest(); + + ajax1.onreadystatechange = ajax2.onreadystatechange = () => { + if (ajax1.status === 200 && ajax1.readyState === 4 && ajax2.status === 200 && ajax2.readyState === 4) { + const platosD = JSON.parse(ajax2.responseText); + resolve({ + template: `${ajax1.responseText}`, + data: function () { + return { + platos: platosD, + itemActual: 1 + }; + }, + components: { + 'mi-footer': footer, + 'header-mini': headerMini, + 'nav-bar': navBar + }, + methods: { + cambiarContador: function () { + if (this.itemActual === 1 || this.itemActual === 2){ + this.itemActual++; + return true; + } else { + this.itemActual = 1; + return false; + } + } + } + }); + } + }; + + ajax1.open("GET","/ihc/src/componentes/tienda.vue",true); + ajax1.send(); + + ajax2.open("GET","/ihc/src/data/platos.json"); + ajax2.send(); +}; + const carrito = { template: ``, components: { 'mi-footer': footer, - 'header-min': headerMin, + 'header-mini': headerMini, 'nav-bar': navBar }, data: function () { @@ -105,7 +151,8 @@ const carrito = { const routes = [ {path: '/ihc/',component: inicio}, - {path: '/ihc/carrito/', component: carrito} + {path: '/ihc/carrito/', component: carrito}, + {path: '/ihc/tienda/', component: tienda} ]; const router = new VueRouter({ diff --git a/package.json b/package.json index 14327f0..ca9b089 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,8 @@ "main": "index.php", "scripts": { "uglify": "uglifyjs src/js/*.js -m -c -o dist/js/app.js", - "sass": "sass -s compressed src/sass:dist/css" + "sass": "sass -s compressed src/sass:dist/css", + "compile": "npm run uglify && npm run sass" }, "repository": { "type": "git", diff --git a/src/componentes/carrito.vue b/src/componentes/carrito.vue index aa6e0cd..f86d461 100644 --- a/src/componentes/carrito.vue +++ b/src/componentes/carrito.vue @@ -1,5 +1,5 @@
- + diff --git a/src/componentes/header-mini.vue b/src/componentes/header-mini.vue new file mode 100644 index 0000000..5335abf --- /dev/null +++ b/src/componentes/header-mini.vue @@ -0,0 +1,7 @@ + diff --git a/src/componentes/header.vue b/src/componentes/header.vue deleted file mode 100644 index 1927d31..0000000 --- a/src/componentes/header.vue +++ /dev/null @@ -1,10 +0,0 @@ - diff --git a/src/componentes/headerMin.vue b/src/componentes/headerMin.vue index ea855b0..6b6760f 100644 --- a/src/componentes/headerMin.vue +++ b/src/componentes/headerMin.vue @@ -1,7 +1,7 @@