Myntra-Clone/bag.html at main · rafia-codes/Myntra-Clone · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Shop Now!-Exclusive Deals,Offers and Many More</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"
        integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg=="
        crossorigin="anonymous" referrerpolicy="no-referrer" />
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="utils.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap"
        rel="stylesheet">
    <link rel="icon" type="image/png"
        href="data:image/png;base64,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"
        sizes="64x64">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"
        integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg=="
        crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<body>
    <header class="container flex space-around vw100">
        <nav class="flex space-around w100">
            <div class="left flex items-center">&nbsp;
                <img src="https://logolook.net/wp-content/uploads/2023/01/Myntra-Emblem-2048x1152.png" alt=""
                    class="p-left40">
                <ul class="flex uppercase">
                    <li><a href="">MEN</a></li>
                    <li><a href="">WOMEN</a></li>
                    <li><a href="">KIDS</a></li>
                    <li><a href="">HOME & LIVING</a></li>
                    <li><a href="">BEAUTY</a></li>
                    <li class="studio"><a href="">STUDIO<sup style="color: crimson">NEW</sup></a></li>
                </ul>
            </div>
            <div class="right flex items-center justify-right">
                <div class="flex items-center search"><i class="fa-solid fa-magnifying-glass"></i><input type="text"
                        class="" placeholder="Search for products, brands and more"></div>
                <div class="flex"><a href=""><i class="fa-regular fa-user text-center"></i><span>Profile</span></a>
                </div>
                <div class="flex"><a href=""><i class="fa-regular fa-heart text-center"></i><span>Wishlist</span></a>
                </div>
                <div class="flex"><a href="bag.html"><i class="fa-solid fa-cart-shopping text-center"><sup
                                class="item-order"></sup></i><span>Bag</span></a>
                </div>
            </div>
        </nav>
    </header>
    <main>
        <div class="bag-page space-around flex">
            <div class="bag-items-container">
                <div class="display-items flex space-between"></div>
            </div>
            <div class="bag-summary space-between">
                <p style="font-weight: 500; color: rgb(41,41,41);">PRICE DETAILS(0 Items)</p>
                <div class="price-details space-between flex">
                        <div style="color: #696b79;;">
                        <p>Total MRP</p>
                        <p>Discount on MRP</p>
                        <p>Convenience Fee</p></div>
                        <div>
                            <p>Rs. 1243</p>
                            <p style="color: rgb(65, 112, 178);;">-Rs. 143</p>
                            <p>Rs. 40</p>
                        </div>
                </div>
                <hr>
                <div class="flex space-between"><div>Total Amount</div><div>Rs. 1100</div></div>
                <button class="add-to-bg" id="placeorder" style="margin: 20px 0;">PLACE ORDER</button>
            </div>
        </div>
    </main>
    <footer>
        <div class="foot  flex space-between">
            <div class="left-foot flex">
                <ul><span>ONLINE SHOPPING</span>
                    <li><a href="">Men</a></li>
                    <li><a href="">Women</a></li>
                    <li><a href="">Kids</a></li>
                    <li><a href="">Home & Living</a></li>
                    <li><a href="">Beauty</a></li>
                    <li><a href="">Gift Cards</a></li>
                    <li><a href="">Myntra Insider</a></li>
                </ul>
                <ul class=""><span>USEFUL LINKS</span>
                    <li><a href="">Blog</a></li>
                    <li><a href="">Careers</a></li>
                    <li><a href="">Site Map</a></li>
                    <li><a href="">Corporate Information</a></li>
                    <li><a href="">Whitehat</a></li>
                    <li><a href="">Cleartrip</a></li>
                </ul>
                <ul class=""><span>EXPERIENCE MYNTRA APP ON MOBILE</span>
                    <div class="flex">
                        <li><a href=""><img class="fix-size"
                                    src="https://constant.myntassets.com/web/assets/img/80cc455a-92d2-4b5c-a038-7da0d92af33f1539674178924-google_play.png"></a>
                        </li>
                        <li><a href=""><img class="fix-size"
                                    src="https://constant.myntassets.com/web/assets/img/bc5e11ad-0250-420a-ac71-115a57ca35d51539674178941-apple_store.png"></a>
                        </li>
                    </div>
                </ul>
            </div>
            <div class="right-foot flex">
                <div class="socials .text-left m-20 p-left40"><span>KEEP IN TOUCH</span>
                    <ul class="flex p0 ">
                        <li><a href=""><img
                                    src="https://constant.myntassets.com/web/assets/img/d2bec182-bef5-4fab-ade0-034d21ec82e31574604275433-fb.png"
                                    style="width: 20px; height: 20px;"></a></li>
                        <li><a href=""><img
                                    src="https://constant.myntassets.com/web/assets/img/f10bc513-c5a4-490c-9a9c-eb7a3cc8252b1574604275383-twitter.png"
                                    style="width: 20px; height: 20px;"></a></li>
                        <li><a href=""><img
                                    src="https://constant.myntassets.com/web/assets/img/a7e3c86e-566a-44a6-a733-179389dd87111574604275355-yt.png"
                                    style="width: 28px; height: 20px;"></a></li>
                        <li><a href=""><i style="transform: scale(1.5);position: relative; bottom: 4px;"
                                    class="fa-brands fa-square-instagram"></i></a></li>
                    </ul>
                    <div class="return flex">
                        <img src="https://assets.myntassets.com/assets/images/retaillabs/2023/5/22/becb1b16-86cc-4e78-bdc7-7801c17947831684737106127-Return-Window-image.png"
                            alt="" style="width: 48px; height: 49px;">
                        <div><span style="font-weight: 500;">Return within 14days</span>&nbsp;of<br>receiving your order
                        </div>
                    </div>
                </div>
                <div class="links">
                    <ul class=""><span>Registered Office Address</span>
                        <li><a href="">Buildings Alyssa,</a></li>
                        <li><a href="">Begonia and Clover situated in Embassy Tech Village,</a></li>
                        <li><a href="">Outer Ring Road,</a></li>
                        <li><a href="">Devarabeesanahalli Village,</a></li>
                        <li><a href="">Varthur Hobli,</a></li>
                        <li><a href="">Bengaluru – 560103, India</a></li>
                    </ul>
                    <ul style="margin-top: 80px;"><span>CUSTOMER POLICIES</span>
                        <li><a href="">Contant Us</a></li>
                        <li><a href="">FAQ</a></li>
                        <li><a href="">T&C</a></li>
                        <li><a href="">Terms of Use</a></li>
                        <li><a href="">Track Orders</a></li>
                        <li><a href="">Shipping</a></li>
                        <li><a href="">Cancellation</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <p class="vw100">POPULAR SEARCHES</p>
        <p><a href="">Makeup | Dresses For Girls | T-Shirts | Sandals | Headphones | Babydolls | Blazers For Men |
                Handbags | Ladies Watches | Bags | Sport Shoes | Reebok Shoes | Puma Shoes | Boxers | Wallets | Tops |
                Earrings | Fastrack Watches | Kurtis | Nike | Smart Watches | Titan Watches | Designer Blouse | Gowns|
                Rings | Cricket Shoes | Forever 21 | Eye Makeup | Photo Frames | Punjabi Suits | Bikini | Myntra Fashion
                Show | Lipstick | Saree | Watches | Dresses | Lehenga | Nike Shoes | Goggles | Bras | Suit | Chinos |
                Shoes | Adidas Shoes | Woodland Shoes | Jewellery | Designers Sarees</a></p>
        <hr>
        <div class="flex space-between m-40">
            <div>
                <p>In case of any concern,<a href=""><span style="color: rgb(65, 112, 178);font-weight: 600;">Contact
                            us</span></a></p>
            </div>
            <div>
                <p>© 2025 www.myntra.com. All rights reserved.</p>
            </div>
            <div><a href="">A Flipkart Company</a></div>
        </div>
    </footer>
    <script src="data.js"></script>
    <script src="bag.js"></script>
</body>
</html>