Skip to content

Commit 725ad7e

Browse files
NicoRob92NicoRob92
authored
Merge pull request #69 from NicoRob92/royner
Royner
2 parents c31a6a5 + 9980cf9 commit 725ad7e

File tree

5 files changed

+86
-90
lines changed

5 files changed

+86
-90
lines changed

Diff for: ‎src/components/Categorie/_Categorie.module.scss

+5-7
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,9 @@
77
font-size: 1.01rem;
88
}
99

10-
@media screen and (max-width:1440px) {
11-
.categorieContainer{
12-
font-size: .7rem;
13-
margin:4px;
10+
@media screen and (max-width: 1440px) {
11+
.categorieContainer {
12+
font-size: 0.7rem;
13+
margin: 4px;
1414
}
15-
16-
17-
}
15+
}

Diff for: ‎src/containers/Categories/Categories.js

+9-11
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,14 @@
1-
import { useLocation } from 'react-router-dom';
1+
import Categorie from "../../components/Categorie/Categorie";
2+
import FilterReset from "../../components/Filters/FilterReset";
3+
import FilterSubmit from "../../components/Filters/FilterSubmit";
24

3-
import Categorie from '../../components/Categorie/Categorie';
4-
import FilterReset from '../../components/Filters/FilterReset';
5-
import FilterSubmit from '../../components/Filters/FilterSubmit';
6-
7-
import styles from './_Categories.module.scss';
5+
import styles from "./_Categories.module.scss";
86

97
const Categories = ({ categories, setCategories, chosenCategories }) => {
10-
const location = useLocation();
118
return (
12-
<form className={styles.categoriesContainer} id='categories'>
13-
<div className={styles.categories}>
9+
<form className={styles.categoriesContainer} id="categories">
10+
<div className={styles.categories}>
11+
<br></br>
1412
{categories?.map((e) => (
1513
<Categorie
1614
key={e.id}
@@ -20,12 +18,12 @@ const Categories = ({ categories, setCategories, chosenCategories }) => {
2018
chosenCategories={chosenCategories}
2119
/>
2220
))}
23-
</div>
2421
<div className={styles.button}>
2522
<FilterReset setCategories={setCategories} />
2623
<FilterSubmit setCategories={setCategories} />
2724
</div>
28-
</form>
25+
</div>
26+
</form>
2927
);
3028
};
3129

Diff for: ‎src/containers/Categories/_Categories.module.scss

+6-4
Original file line numberDiff line numberDiff line change
@@ -6,17 +6,19 @@
66
border-radius: 0.3em;
77
box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.4);
88
position: absolute;
9-
width: 15%;
10-
height: 65%;
9+
width: 15vw;
10+
height: 65vh;
1111
margin-top: 10px;
1212
left: 2%;
13-
top: 10%;
13+
// top: 10%; retire los porcentajes y agregue vh y vw Besitos roy :v
1414
font-weight: bolder;
15-
font-family: 'Mitr', sans-serif;
15+
font-family: "Mitr", sans-serif;
1616
color: black;
1717
text-shadow: 1px 1px 1px white;
1818
justify-content: space-around;
1919
align-items: center;
20+
overflow: auto;
21+
padding-top: 400px;
2022
}
2123

2224
.button {

Diff for: ‎src/containers/Navbar/Navbar.js

+49-50
Original file line numberDiff line numberDiff line change
@@ -1,74 +1,71 @@
1-
import { useState } from 'react';
2-
import { NavLink, Link } from 'react-router-dom';
3-
import { useSelector, useDispatch } from 'react-redux';
1+
import { useState } from "react";
2+
import { NavLink, Link } from "react-router-dom";
3+
import { useSelector, useDispatch } from "react-redux";
44

5-
import Searchbar from '../../components/Searchbar/Searchbar';
6-
import Profile from '../../components/Profile/Profile';
7-
import Cart from '../../components/Cart/Cart';
8-
import { setAmount } from '../../helpers/setAmoun';
9-
import { setAmountProduct } from "../../helpers/getAmountProduct"
5+
import Searchbar from "../../components/Searchbar/Searchbar";
6+
import Profile from "../../components/Profile/Profile";
7+
import Cart from "../../components/Cart/Cart";
8+
import { setAmount } from "../../helpers/setAmoun";
9+
import { setAmountProduct } from "../../helpers/getAmountProduct";
1010

11-
import * as actionCreators from '../../ducks/actions/actionCreators';
11+
import * as actionCreators from "../../ducks/actions/actionCreators";
1212

13-
import styles from './_Navbar.module.scss';
13+
import styles from "./_Navbar.module.scss";
1414

1515
const Navbar = () => {
1616
const dispatch = useDispatch();
1717
const [showCart, setShowCart] = useState(false);
1818
const [showLogin, setShowLogin] = useState(false);
19-
const amount = useSelector(state => state.reducer.amount)
20-
const amountByPost = useSelector(state => state.reducer.amountByPost)
19+
const amount = useSelector((state) => state.reducer.amount);
20+
const amountByPost = useSelector((state) => state.reducer.amountByPost);
2121
const cart = useSelector((state) => state.reducer.cart);
22-
console.log(cart)
22+
console.log(cart);
2323

24-
const logged = localStorage.getItem('logged');
24+
const logged = localStorage.getItem("logged");
2525

2626
const show = () => {
2727
setShowLogin(!showLogin);
2828
};
2929

3030
const removePost = (e) => {
3131
let id = Number(e);
32-
let posts = JSON.parse(localStorage.getItem('posts'));
32+
let posts = JSON.parse(localStorage.getItem("posts"));
3333
posts.item = posts?.item?.filter((e) => e.id !== Number(id));
3434
dispatch(actionCreators.setCart(posts));
35-
localStorage.setItem('posts', JSON.stringify(posts));
36-
setAmount(dispatch,actionCreators)
35+
localStorage.setItem("posts", JSON.stringify(posts));
36+
setAmount(dispatch, actionCreators);
3737
};
3838

3939
const incrementQuantity = (e) => {
4040
let id = Number(e);
41-
let posts = JSON.parse(localStorage.getItem('posts'));
41+
let posts = JSON.parse(localStorage.getItem("posts"));
4242
posts.item.forEach((e) => {
4343
e.id === id && e.stock > e.quantity && e.quantity++;
4444
});
4545
dispatch(actionCreators.setCart(posts));
46-
localStorage.setItem('posts', JSON.stringify(posts));
47-
setAmount(dispatch, actionCreators)
48-
46+
localStorage.setItem("posts", JSON.stringify(posts));
47+
setAmount(dispatch, actionCreators);
4948
};
5049

5150
const decrementQuantity = (e) => {
5251
let id = Number(e);
53-
let posts = JSON.parse(localStorage.getItem('posts'));
52+
let posts = JSON.parse(localStorage.getItem("posts"));
5453
posts.item.forEach((e) => {
5554
e.id === id && e.quantity > 1 && e.quantity--;
5655
});
5756
dispatch(actionCreators.setCart(posts));
58-
localStorage.setItem('posts', JSON.stringify(posts));
59-
setAmount(dispatch,actionCreators)
57+
localStorage.setItem("posts", JSON.stringify(posts));
58+
setAmount(dispatch, actionCreators);
6059
};
6160

62-
63-
6461
return (
6562
<div className={styles.navbar}>
6663
{/* Ecommerce */}
6764
<div className={styles.containertitle}>
68-
<Link to={'/'} className={styles.market}>
69-
<h1>Kwik-E-Mart</h1>
65+
<Link to={"/"} className={styles.market}>
66+
<h3>Kwik-E-Mart</h3>
7067
</Link>
71-
<Link to={'/market'} className={styles.market}>
68+
<Link to={"/market"} className={styles.market}>
7269
<h4>Market</h4>
7370
</Link>
7471
</div>
@@ -80,27 +77,28 @@ const Navbar = () => {
8077
{/* Profile */}
8178
{!logged ? (
8279
<div className={styles.containerLogin}>
83-
<NavLink to='/login' className={styles.login}>
84-
{' '}
80+
<NavLink to="/login" className={styles.login}>
81+
{" "}
8582
Login
8683
</NavLink>
8784
<div className={styles.cart}>
8885
<button onClick={() => setShowCart(!showCart)}>
8986
<svg
90-
width='33'
91-
height='21'
92-
viewBox='0 0 33 21'
93-
fill='none'
94-
xmlns='http://www.w3.org/2000/svg'>
87+
width="33"
88+
height="21"
89+
viewBox="0 0 33 21"
90+
fill="none"
91+
xmlns="http://www.w3.org/2000/svg"
92+
>
9593
<path
96-
fillRule='evenodd'
97-
clipRule='evenodd'
98-
d='M10 0.359009L15 13.359H29L33 1.35901V0.359009H23V1.35901H31.9459L28.2792 12.359H15.6868L10.9333 2.97129e-05L10 0.359009ZM10 0.359009H0V1.35901H10V0.359009ZM17.5 19.359C18.3284 19.359 19 18.6874 19 17.859C19 17.0306 18.3284 16.359 17.5 16.359C16.6716 16.359 16 17.0306 16 17.859C16 18.6874 16.6716 19.359 17.5 19.359ZM17.5 20.359C18.8807 20.359 20 19.2397 20 17.859C20 16.4783 18.8807 15.359 17.5 15.359C16.1193 15.359 15 16.4783 15 17.859C15 19.2397 16.1193 20.359 17.5 20.359ZM28 17.859C28 18.6874 27.3284 19.359 26.5 19.359C25.6716 19.359 25 18.6874 25 17.859C25 17.0306 25.6716 16.359 26.5 16.359C27.3284 16.359 28 17.0306 28 17.859ZM29 17.859C29 19.2397 27.8807 20.359 26.5 20.359C25.1193 20.359 24 19.2397 24 17.859C24 16.4783 25.1193 15.359 26.5 15.359C27.8807 15.359 29 16.4783 29 17.859Z'
99-
fill='white'
94+
fillRule="evenodd"
95+
clipRule="evenodd"
96+
d="M10 0.359009L15 13.359H29L33 1.35901V0.359009H23V1.35901H31.9459L28.2792 12.359H15.6868L10.9333 2.97129e-05L10 0.359009ZM10 0.359009H0V1.35901H10V0.359009ZM17.5 19.359C18.3284 19.359 19 18.6874 19 17.859C19 17.0306 18.3284 16.359 17.5 16.359C16.6716 16.359 16 17.0306 16 17.859C16 18.6874 16.6716 19.359 17.5 19.359ZM17.5 20.359C18.8807 20.359 20 19.2397 20 17.859C20 16.4783 18.8807 15.359 17.5 15.359C16.1193 15.359 15 16.4783 15 17.859C15 19.2397 16.1193 20.359 17.5 20.359ZM28 17.859C28 18.6874 27.3284 19.359 26.5 19.359C25.6716 19.359 25 18.6874 25 17.859C25 17.0306 25.6716 16.359 26.5 16.359C27.3284 16.359 28 17.0306 28 17.859ZM29 17.859C29 19.2397 27.8807 20.359 26.5 20.359C25.1193 20.359 24 19.2397 24 17.859C24 16.4783 25.1193 15.359 26.5 15.359C27.8807 15.359 29 16.4783 29 17.859Z"
97+
fill="white"
10098
/>
10199
</svg>
102100
</button>
103-
</div>
101+
</div>
104102

105103
<Cart
106104
showCart={showCart}
@@ -119,16 +117,17 @@ const Navbar = () => {
119117
<div className={styles.cart}>
120118
<button onClick={() => setShowCart(!showCart)}>
121119
<svg
122-
width='33'
123-
height='21'
124-
viewBox='0 0 33 21'
125-
fill='none'
126-
xmlns='http://www.w3.org/2000/svg'>
120+
width="33"
121+
height="21"
122+
viewBox="0 0 33 21"
123+
fill="none"
124+
xmlns="http://www.w3.org/2000/svg"
125+
>
127126
<path
128-
fillRule='evenodd'
129-
clipRule='evenodd'
130-
d='M10 0.359009L15 13.359H29L33 1.35901V0.359009H23V1.35901H31.9459L28.2792 12.359H15.6868L10.9333 2.97129e-05L10 0.359009ZM10 0.359009H0V1.35901H10V0.359009ZM17.5 19.359C18.3284 19.359 19 18.6874 19 17.859C19 17.0306 18.3284 16.359 17.5 16.359C16.6716 16.359 16 17.0306 16 17.859C16 18.6874 16.6716 19.359 17.5 19.359ZM17.5 20.359C18.8807 20.359 20 19.2397 20 17.859C20 16.4783 18.8807 15.359 17.5 15.359C16.1193 15.359 15 16.4783 15 17.859C15 19.2397 16.1193 20.359 17.5 20.359ZM28 17.859C28 18.6874 27.3284 19.359 26.5 19.359C25.6716 19.359 25 18.6874 25 17.859C25 17.0306 25.6716 16.359 26.5 16.359C27.3284 16.359 28 17.0306 28 17.859ZM29 17.859C29 19.2397 27.8807 20.359 26.5 20.359C25.1193 20.359 24 19.2397 24 17.859C24 16.4783 25.1193 15.359 26.5 15.359C27.8807 15.359 29 16.4783 29 17.859Z'
131-
fill='white'
127+
fillRule="evenodd"
128+
clipRule="evenodd"
129+
d="M10 0.359009L15 13.359H29L33 1.35901V0.359009H23V1.35901H31.9459L28.2792 12.359H15.6868L10.9333 2.97129e-05L10 0.359009ZM10 0.359009H0V1.35901H10V0.359009ZM17.5 19.359C18.3284 19.359 19 18.6874 19 17.859C19 17.0306 18.3284 16.359 17.5 16.359C16.6716 16.359 16 17.0306 16 17.859C16 18.6874 16.6716 19.359 17.5 19.359ZM17.5 20.359C18.8807 20.359 20 19.2397 20 17.859C20 16.4783 18.8807 15.359 17.5 15.359C16.1193 15.359 15 16.4783 15 17.859C15 19.2397 16.1193 20.359 17.5 20.359ZM28 17.859C28 18.6874 27.3284 19.359 26.5 19.359C25.6716 19.359 25 18.6874 25 17.859C25 17.0306 25.6716 16.359 26.5 16.359C27.3284 16.359 28 17.0306 28 17.859ZM29 17.859C29 19.2397 27.8807 20.359 26.5 20.359C25.1193 20.359 24 19.2397 24 17.859C24 16.4783 25.1193 15.359 26.5 15.359C27.8807 15.359 29 16.4783 29 17.859Z"
130+
fill="white"
132131
/>
133132
</svg>
134133
</button>

Diff for: ‎src/containers/Navbar/_Navbar.module.scss

+17-18
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
@import '../../sass/variables.scss';
2-
@import '../../sass/mixins.scss';
1+
@import "../../sass/variables.scss";
2+
@import "../../sass/mixins.scss";
33

44
.navbar {
55
display: flex;
@@ -13,13 +13,14 @@
1313
rgba(72, 138, 74, 0.9808298319327731) 49%,
1414
rgba(0, 116, 62, 1) 78%
1515
);
16-
z-index: 1;
16+
z-index: 1;
17+
position: fixed;
1718
}
1819

1920
.login {
2021
display: flex;
21-
justify-content:center;
22-
align-items:center;
22+
justify-content: center;
23+
align-items: center;
2324
margin-left: 15%;
2425
width: 15%;
2526
height: 40%;
@@ -29,16 +30,15 @@
2930
text-decoration: none;
3031
text-align: center;
3132
border: none;
32-
border-radius:4px;
33-
background-color:#AAAAAA;
33+
border-radius: 4px;
34+
background-color: #aaaaaa;
3435
box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.4);
35-
transition: 0.3s;
36+
transition: 0.3s;
3637
}
3738

3839
.login:hover {
39-
color: black;
40-
background-color:#524f4f;
41-
40+
color: black;
41+
background-color: #524f4f;
4242
}
4343

4444
.cart {
@@ -55,11 +55,10 @@
5555
}
5656
}
5757

58-
5958
.market {
6059
text-decoration: none;
6160
color: black;
62-
font-family: 'Kaushan Script', cursive;
61+
font-family: "Kaushan Script", cursive;
6362
:hover {
6463
text-decoration: none;
6564
color: black;
@@ -135,20 +134,20 @@
135134
align-items: center;
136135
}
137136

138-
.login{
139-
font-size: .8rem
137+
.login {
138+
font-size: 0.8rem;
140139
}
141140

142141
.containersearch {
143142
width: 50%;
144-
height:100%;
143+
height: 100%;
145144
}
146145

147146
.containertitle {
148-
h1{
147+
h1 {
149148
font-size: 1.7rem;
150149
}
151-
h4{
150+
h4 {
152151
font-size: 1.2rem;
153152
}
154153
}

0 commit comments

Comments
 (0)