File tree Expand file tree Collapse file tree 12 files changed +488
-69
lines changed Expand file tree Collapse file tree 12 files changed +488
-69
lines changed Original file line number Diff line number Diff line change 1+ .cart-dropdown {
2+ position : absolute ;
3+ width : 240px ;
4+ height : 340px ;
5+ display : flex ;
6+ flex-direction : column ;
7+ padding : 20px ;
8+ border : 1px solid black ;
9+ background-color : white ;
10+ top : 90px ;
11+ right : 40px ;
12+ z-index : 5 ;
13+
14+ .cart-items {
15+ height : 240px ;
16+ display : flex ;
17+ flex-direction : column ;
18+ overflow : scroll ;
19+ }
20+
21+ button {
22+ margin-top : auto ;
23+ }
24+ }
Original file line number Diff line number Diff line change 1+ .cart-icon {
2+ width : 45px ;
3+ height : 45px ;
4+ position : relative ;
5+ display : flex ;
6+ align-items : center ;
7+ justify-content : center ;
8+ cursor : pointer ;
9+
10+ .shopping-icon {
11+ width : 24px ;
12+ height : 24px ;
13+ }
14+
15+ .item-count {
16+ position : absolute ;
17+ font-size : 10px ;
18+ font-weight : bold ;
19+ bottom : 12px ;
20+ }
21+ }
Original file line number Diff line number Diff line change 1+ .cart-item {
2+ width : 100% ;
3+ display : flex ;
4+ height : 80px ;
5+ margin-bottom : 15px ;
6+
7+ img {
8+ width : 30% ;
9+ }
10+
11+ .item-details {
12+ width : 70% ;
13+ display : flex ;
14+ flex-direction : column ;
15+ align-items : flex-start ;
16+ justify-content : center ;
17+ padding : 10px 20px ;
18+
19+ .name {
20+ font-size : 16px ;
21+ }
22+ }
23+ }
Original file line number Diff line number Diff line change 1+ .checkout-item {
2+ width : 100% ;
3+ display : flex ;
4+ min-height : 100px ;
5+ border-bottom : 1px solid darkgrey ;
6+ padding : 15px 0 ;
7+ font-size : 20px ;
8+ align-items : center ;
9+
10+ .image-container {
11+ width : 23% ;
12+ padding-right : 15px ;
13+
14+ img {
15+ width : 100% ;
16+ height : 100% ;
17+ }
18+ }
19+ .name ,
20+ .quantity ,
21+ .price {
22+ width : 23% ;
23+ }
24+
25+ .quantity {
26+ padding-left : 20px ;
27+ }
28+
29+ .remove-button {
30+ padding-left : 12px ;
31+ cursor : pointer ;
32+ }
33+ }
Original file line number Diff line number Diff line change 1+ .checkout-page {
2+ width : 55% ;
3+ min-height : 90vh ;
4+ display : flex ;
5+ flex-direction : column ;
6+ align-items : center ;
7+ margin : 50px auto 0 ;
8+
9+ .checkout-header {
10+ width : 100% ;
11+ padding : 10px 0 ;
12+ display : flex ;
13+ justify-content : space-between ;
14+ border-bottom : 1px solid darkgrey ;
15+
16+ .header-block {
17+ text-transform : capitalize ;
18+ width : 23% ;
19+
20+ & :last-child {
21+ width : 8% ;
22+ }
23+ }
24+ }
25+
26+ .total {
27+ margin-top : 30px ;
28+ margin-left : auto ;
29+ font-size : 36px ;
30+ }
31+ }
Original file line number Diff line number Diff line change 1+ .collection-item {
2+ width : 22% ;
3+ display : flex ;
4+ flex-direction : column ;
5+ height : 350px ;
6+ align-items : center ;
7+ position : relative ;
8+
9+ .image {
10+ width : 100% ;
11+ height : 95% ;
12+ background-size : cover ;
13+ background-position : center ;
14+ margin-bottom : 5px ;
15+ }
16+
17+ .custom-button {
18+ width : 80% ;
19+ opacity : 0.7 ;
20+ position : absolute ;
21+ top : 255px ;
22+ display : none ;
23+ }
24+
25+ & :hover {
26+ .image {
27+ opacity : 0.8 ;
28+ }
29+
30+ .custom-button {
31+ opacity : 0.85 ;
32+ display : flex ;
33+ }
34+ }
35+
36+ .collection-footer {
37+ width : 100% ;
38+ height : 5% ;
39+ display : flex ;
40+ justify-content : space-between ;
41+ font-size : 18px ;
42+
43+ .name {
44+ width : 90% ;
45+ margin-bottom : 15px ;
46+ }
47+
48+ .price {
49+ width : 10% ;
50+ }
51+ }
52+ }
Original file line number Diff line number Diff line change 1313 font-weight : bolder ;
1414 border : none ;
1515 cursor : pointer ;
16+ display : flex ;
17+ justify-content : center ;
1618
1719 & :hover {
1820 background-color : white ;
1921 color : black ;
2022 border : 1px solid black ;
2123 }
24+
25+ & .google-sign-in {
26+ background-color : #4285f4 ;
27+ color : white ;
28+
29+ & :hover {
30+ background-color : #357ae8 ;
31+ border : none ;
32+ }
33+ }
34+
35+ & .inverted {
36+ background-color : white ;
37+ color : black ;
38+ border : 1px solid black ;
39+
40+ & :hover {
41+ background-color : black ;
42+ color : white ;
43+ border : none ;
44+ }
45+ }
2246}
Load Diff This file was deleted.
You can’t perform that action at this time.
0 commit comments