Skip to content

Commit cde2b3b

Browse files
tajulafreentajulafreen
committed
solve the linter
1 parent 1d4bde7 commit cde2b3b

File tree

1 file changed

+143
-144
lines changed

1 file changed

+143
-144
lines changed

‎Source-Code/E-CommerceWebsite/style.css‎

Lines changed: 143 additions & 144 deletions
Original file line numberDiff line numberDiff line change
@@ -1,145 +1,144 @@
11
body {
2-
font-family: Arial, sans-serif;
3-
margin: 0;
4-
padding: 0;
5-
background-color: #f9f9f9;
6-
}
7-
8-
header {
9-
background-color: #333;
10-
color: #fff;
11-
padding: 10px 20px;
12-
text-align: center;
13-
}
14-
15-
.navbar {
16-
display: flex;
17-
justify-content: space-between;
18-
align-items: center;
19-
}
20-
21-
#cart-btn {
22-
background-color: #28a745;
23-
color: white;
24-
border: none;
25-
padding: 10px 20px;
26-
font-size: 1rem;
27-
cursor: pointer;
28-
border-radius: 5px;
29-
}
30-
31-
#cart-btn:hover {
32-
background-color: #218838;
33-
}
34-
35-
.container {
36-
margin: 50px auto;
37-
padding: 20px;
38-
background: #fff;
39-
border-radius: 10px;
40-
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
41-
max-width: 1000px;
42-
}
43-
44-
h1 {
45-
margin-bottom: 30px;
46-
}
47-
48-
.products-container {
49-
display: grid;
50-
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
51-
gap: 20px;
52-
}
53-
54-
.product {
55-
border: 1px solid #ddd;
56-
border-radius: 10px;
57-
padding: 10px;
58-
text-align: center;
59-
background-color: #fff;
60-
}
61-
62-
.product img {
63-
max-width: 100%;
64-
height: 300px;
65-
border-radius: 10px;
66-
}
67-
68-
.product .title {
69-
font-size: 1.1rem;
70-
font-weight: bold;
71-
margin: 10px 0;
72-
height: 60px;
73-
overflow: hidden;
74-
}
75-
76-
.product .price {
77-
font-size: 1rem;
78-
color: #333;
79-
margin: 10px 0;
80-
}
81-
82-
.product button {
83-
background-color: #007bff;
84-
color: white;
85-
border: none;
86-
padding: 10px;
87-
font-size: 1rem;
88-
cursor: pointer;
89-
border-radius: 5px;
90-
width: 100%;
91-
}
92-
93-
.product button:hover {
94-
background-color: #0056b3;
95-
}
96-
97-
/* Cart Modal Styles */
98-
.cart-modal {
99-
position: fixed;
100-
top: 0;
101-
left: 0;
102-
width: 100%;
103-
height: 100%;
104-
background-color: rgba(0, 0, 0, 0.7);
105-
display: none;
106-
justify-content: center;
107-
align-items: center;
108-
z-index: 1000;
109-
}
110-
111-
.cart-content {
112-
background-color: white;
113-
padding: 20px;
114-
border-radius: 10px;
115-
max-width: 500px;
116-
width: 100%;
117-
text-align: left;
118-
}
119-
120-
#cart-items {
121-
list-style-type: none;
122-
padding: 0;
123-
}
124-
125-
#cart-items li {
126-
display: flex;
127-
justify-content: space-between;
128-
padding: 5px 0;
129-
}
130-
131-
#close-cart {
132-
margin-top: 20px;
133-
background-color: #dc3545;
134-
color: white;
135-
border: none;
136-
padding: 10px;
137-
font-size: 1rem;
138-
cursor: pointer;
139-
border-radius: 5px;
140-
}
141-
142-
#close-cart:hover {
143-
background-color: #c82333;
144-
}
145-
2+
font-family: Arial, sans-serif;
3+
margin: 0;
4+
padding: 0;
5+
background-color: #f9f9f9;
6+
}
7+
8+
header {
9+
background-color: #333;
10+
color: #fff;
11+
padding: 10px 20px;
12+
text-align: center;
13+
}
14+
15+
.navbar {
16+
display: flex;
17+
justify-content: space-between;
18+
align-items: center;
19+
}
20+
21+
#cart-btn {
22+
background-color: #28a745;
23+
color: white;
24+
border: none;
25+
padding: 10px 20px;
26+
font-size: 1rem;
27+
cursor: pointer;
28+
border-radius: 5px;
29+
}
30+
31+
#cart-btn:hover {
32+
background-color: #218838;
33+
}
34+
35+
.container {
36+
margin: 50px auto;
37+
padding: 20px;
38+
background: #fff;
39+
border-radius: 10px;
40+
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
41+
max-width: 1000px;
42+
}
43+
44+
h1 {
45+
margin-bottom: 30px;
46+
}
47+
48+
.products-container {
49+
display: grid;
50+
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
51+
gap: 20px;
52+
}
53+
54+
.product {
55+
border: 1px solid #ddd;
56+
border-radius: 10px;
57+
padding: 10px;
58+
text-align: center;
59+
background-color: #fff;
60+
}
61+
62+
.product img {
63+
max-width: 100%;
64+
height: 300px;
65+
border-radius: 10px;
66+
}
67+
68+
.product .title {
69+
font-size: 1.1rem;
70+
font-weight: bold;
71+
margin: 10px 0;
72+
height: 60px;
73+
overflow: hidden;
74+
}
75+
76+
.product .price {
77+
font-size: 1rem;
78+
color: #333;
79+
margin: 10px 0;
80+
}
81+
82+
.product button {
83+
background-color: #007bff;
84+
color: white;
85+
border: none;
86+
padding: 10px;
87+
font-size: 1rem;
88+
cursor: pointer;
89+
border-radius: 5px;
90+
width: 100%;
91+
}
92+
93+
.product button:hover {
94+
background-color: #0056b3;
95+
}
96+
97+
/* Cart Modal Styles */
98+
.cart-modal {
99+
position: fixed;
100+
top: 0;
101+
left: 0;
102+
width: 100%;
103+
height: 100%;
104+
background-color: rgba(0, 0, 0, 0.7);
105+
display: none;
106+
justify-content: center;
107+
align-items: center;
108+
z-index: 1000;
109+
}
110+
111+
.cart-content {
112+
background-color: white;
113+
padding: 20px;
114+
border-radius: 10px;
115+
max-width: 500px;
116+
width: 100%;
117+
text-align: left;
118+
}
119+
120+
#cart-items {
121+
list-style-type: none;
122+
padding: 0;
123+
}
124+
125+
#cart-items li {
126+
display: flex;
127+
justify-content: space-between;
128+
padding: 5px 0;
129+
}
130+
131+
#close-cart {
132+
margin-top: 20px;
133+
background-color: #dc3545;
134+
color: white;
135+
border: none;
136+
padding: 10px;
137+
font-size: 1rem;
138+
cursor: pointer;
139+
border-radius: 5px;
140+
}
141+
142+
#close-cart:hover {
143+
background-color: #c82333;
144+
}

0 commit comments

Comments
 (0)