Skip to content

Commit

Permalink
actualizo repo Binary Brains
Browse files Browse the repository at this point in the history
  • Loading branch information
TamaraPiccinni committed Nov 1, 2023
1 parent acfa26d commit 6848b81
Show file tree
Hide file tree
Showing 2,315 changed files with 233,760 additions and 106 deletions.
27 changes: 0 additions & 27 deletions LaboratorioIV/JS/e-commerce2022/client/js/index.js

This file was deleted.

30 changes: 0 additions & 30 deletions LaboratorioIV/JS/e-commerce2022/client/js/products.js

This file was deleted.

Binary file not shown.
20 changes: 0 additions & 20 deletions LaboratorioIV/JS/e-commerce2022/client/media/index.html

This file was deleted.

Binary file not shown.
Binary file not shown.
Binary file not shown.
Original file line number Diff line number Diff line change
@@ -1,35 +1,32 @@
const modalContainer = document.getElementById("modalContainer");
const modalContent = document.getElementById("modal-overlay");
const modalContainer = document.getElementById("modal-container");
const modalOverlay = document.getElementById("modal-overlay");

const cartBtn = document.getElementById("cart-btn");

const displayCart = () => {
modalContainer.innerHTML = "";
modalContainer.style.display = "block";
modalOverlay.style.display = "block";
//modal Header
//modal header
const modalHeader = document.createElement("div");

const modalClose = document.createElement("div");
modalClose.innerText = "X";
modalClose.innerText = "❌";
modalClose.className = "modal-close";
modalHeader.append(modalClose);
modalHeader.append(modalClose);

modalClose.addEventListener("click", () => {
modalClose.addEventListener("click", ()=>{
modalContainer.style.display = "none";
modalOverlay.style.display = "none";
})
});

const modalTitle = document.createElement("div");
modalTitle.innerText = "Cart";
modalTitle.innerText = "cart";
modalTitle.className = "modal-title";
modalHeader.append(modalTitle);

modalContainer.append(modalHeader);

//modal Body
cart.
};


cartBtn.addEventListener("click", displayCart)
cartBtn.addEventListener("click", displayCart);
29 changes: 29 additions & 0 deletions LaboratorioIV/JavaScript/Clase 1/e-commerce/client/js/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
const shopContent = document.getElementById("shopContent");
const cart =[];//Este es nuestro carrito, un array vacio

productos.forEach((product) =>{
const content = document.createElement("div");
content.innerHTML = `
<img src="${product.img}">
<h3>${product.productName}</h3>
<p>${product.price} $</p>
`;
shopContent.append(content);

const buyButton = document.createElement('button');
buyButton.innerText = "Comprar";

content.append(buyButton);

buyButton.addEventListener("click", () => {
cart.push({
id: product.id,
productName: product.productName,
price: product.price,
quanty: product.quanty,
img: product.img,
})
console.log(cart)
})

});
61 changes: 61 additions & 0 deletions LaboratorioIV/JavaScript/Clase 1/e-commerce/client/js/products.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
const productos = [
{
id: 1,
productName: "Brochette de verduras",
price: 2800,
quanty: 1,
img: "/client/media/brochette_de_verduras.png",
},
{
id: 2,
productName: "Hamburguesa de soja",
price: 2500,
quanty: 1,
img: "/client/media/hamburguesa_de_soja.png",
},
{
id: 3,
productName: "Salteado de verduras",
price: 1500,
quanty: 1,
img: "/client/media/salteado_de_verduras.png",
},


{
id: 4,
productName: "Proteico de vegetales",
price: 2800,
quanty: 1,
img: "/client/media/Proteico_vegetales.jpg",
},
{
id: 5,
productName: "Sushi con degustación de vinos (para compartir)",
price: 3200,
quanty: 1,
img: "/client/media/Sushi_degustación_vinos.jpg",
},
{
id: 6,
productName: "Sushi y vino",
price: 2800,
quanty: 1,
img: "/client/media/sushi_vino.jpg",
},
{
id: 7,
productName: "Mix vegetales y queso",
price: 2100,
quanty: 1,
img: "/client/media/Mix_vegetales_queso.jpg",
},
{
id: 8,
productName: "Ensalada proteica con frutos rojos o piña",
price: 2000,
quanty: 1,
img: "/client/media/Ensalada_proteica_con_frutosRojos_o_piña.jpg",
},

];
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<title>E-Commerce</title>
</head>
<body>
<div class="card-products-container">
<div class="card-products" id="shopContent"></div>
</div>

<!--cart-btn-->
<div class="cart-btn" id="cart-btn">🛒</div>
<!--modal-->
<div class="modal-overlay" id="modal-overlay"></div>
<div class="modal-container" id="modal-container"></div>
<script src="/client/js/products.js"></script>
<script src="/client/js/index.js"></script>
<script src="/client/js/cart.js"></script>
</body>
</html>
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
/*products styles*/
.card-products-container {
margin: 5vh auto;
}
Expand All @@ -10,7 +11,7 @@
flex-wrap: wrap;
}

.card-products img {
.card-products img{
margin-top: 40px;
width: 250px;
height: 250px;
Expand All @@ -21,7 +22,7 @@
outline: 0;
padding: 10px;
color: white;
background-color: aqua;
background-color: rgb(5, 168, 32);
text-align: center;
cursor: pointer;
width: 100%;
Expand All @@ -32,48 +33,58 @@
opacity: 0.7;
}

.cart-btn:hover {
opacity: 0.9;
/*cart button*/
.cart-btn {
position: fixed;
top: 90vh;
right: 40px;
background-color: rgb(25, 25,25);
padding: 10px;
border-radius: 50%;
height: 24px;
width: 24px;
transition: transform 0.2 ease-in-out;
}
.cart-btn:hover{
cursor: pointer;
opacity: 0.9;
}

/*modal*/
.modal-overlay{
/modal/
.modal-overlay {
display: none;
background-color: rgba(0, 0, 0, 0.5);
background-color: (0,0,0, 0.5);
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
}
.modal-container{
.modal-container {
display: none;
background-color: #ffffff;
box-shadow: 0px 3px 6px#00000029;
box-shadow: 0px 3px 6px #00000029;
padding: 40px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
max-width: 100%;
max-width: 500px;
width: 100%;
z-index: 1;
max-height: 80vh;
overflow-y: auto;
}

.modal-container::-webkit-scrollbar {
.modal-container::-webkit-scrollbar{
display: none;
}

.modal-close{
.modal-close {
float: right;
cursor: pointer;
}
.modal-title{
.modal-title {
font-size: 24px;
font-weight: bold;
margin-bottom: 20px;
text-align: center;
}
}
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
32 changes: 32 additions & 0 deletions LaboratorioIV/JavaScript/Clase2/e-commerce/client/js/cart.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
const modalContainer = document.getElementById("modal-container");
const modalOverlay = document.getElementById("modal-overlay");

const cartBtn = document.getElementById("cart-btn");

const displayCart = () => {
modalContainer.innerHTML = "";
modalContainer.style.display = "block";
modalOverlay.style.display = "block";
//modal header
const modalHeader = document.createElement("div");

const modalClose = document.createElement("div");
modalClose.innerText = "❌";
modalClose.className = "modal-close";
modalHeader.append(modalClose);

modalClose.addEventListener("click", ()=>{
modalContainer.style.display = "none";
modalOverlay.style.display = "none";
});

const modalTitle = document.createElement("div");
modalTitle.innerText = "cart";
modalTitle.className = "modal-title";
modalHeader.append(modalTitle);

modalContainer.append(modalHeader);
};


cartBtn.addEventListener("click", displayCart);
Loading

0 comments on commit 6848b81

Please sign in to comment.