1
+ <!DOCTYPE html>
2
+ < html >
3
+ < head >
4
+ < title > Urban Motive</ title >
5
+ <!-- Nav bar starts -->
6
+ < link rel ="stylesheet " href ="bootstrap.min.css ">
7
+ < link rel ="stylesheet " href ="style1.css ">
8
+ < link rel ="stylesheet " href ="style3.css ">
9
+ < link rel ="preload " as ="style " href ="additional.css "> < link rel ="stylesheet " href ="additional.css " type ="text/css ">
10
+ <!-- nav bar ends -->
11
+
12
+ < script src ="https://kit.fontawesome.com/8f92dba009.js " crossorigin ="anonymous "> </ script > <!-- ICONS FOR FOOTER -->
13
+ < meta charset ="UTF-8 ">
14
+ < meta name ="viewport " content ="width=device-width, initial-scale=1.0 ">
15
+ < link rel ="stylesheet " href ="assets/socicon/css/styles.css ">
16
+
17
+
18
+ < link rel ="stylesheet " href ="style.css ">
19
+
20
+
21
+
22
+
23
+ < body >
24
+
25
+
26
+ < section class ="menu menu2 header-1 " once ="menu " id ="menu-5-1 ">
27
+ < nav class ="navbar navbar-dropdown navbar-fixed-top navbar-expand-lg " style ="background-color: #FFFFFF; ">
28
+ < div class ="container ">
29
+ < div class ="navbar-brand ">
30
+ < span class ="navbar-logo ">
31
+ < a href ="index.html ">
32
+ < img src ="logo.jpg "
33
+ style ="height: 4.3rem; "> <!-- logo image -->
34
+ </ a >
35
+ </ span >
36
+ < span class ="navbar-caption-wrap ">
37
+ < a class ="navbar-caption text-black display-4 mt-2 " href ="# "> Urban Motive</ a >
38
+ </ span >
39
+ </ div >
40
+ < button class ="navbar-toggler " type ="button " data-toggle ="collapse "
41
+ data-bs-toggle ="collapse " data-target ="#navbarSupportedContent "
42
+ data-bs-target ="#navbarSupportedContent "
43
+ aria-controls ="navbarNavAltMarkup " aria-expanded ="false "
44
+ aria-label ="Toggle navigation ">
45
+ < div class ="hamburger ">
46
+ </ div >
47
+ </ button >
48
+ < div class ="collapse navbar-collapse " id ="navbarSupportedContent ">
49
+ < ul class ="navbar-nav nav-dropdown " data-app-modern-menu ="true ">
50
+ </ li >
51
+ < li class ="nav-item ">
52
+ < a class ="nav-link link text-black display-4 " class ="active " href ="index.html "> Home</ a >
53
+ </ li >
54
+ < li class ="nav-item ">
55
+ < a class ="nav-link link text-black display-4 " href ="aboutus.html "> About us</ a >
56
+ </ li >
57
+
58
+ < li class ="navbar-buttons dropdown ">
59
+ < a class ="nav-link link text-black dropdown-toggle display-4 " href ="# " id ="navbarDropdown " role ="button " data-toggle ="dropdown " aria-haspopup ="true " aria-expanded ="false "> Categories</ a >
60
+ < div class ="dropdown ">
61
+ < ul class ="dropdown-menu " style ="background-color: #FFFFFF; ">
62
+ < li > < a class ="dropdown-item " href ="Rice&Grains.html "> Rice & Grains</ a > </ li >
63
+ < li > < a class ="dropdown-item " href ="DairyProducts.html "> DairyProducts</ a > </ li >
64
+ < li > < a class ="dropdown-item " href ="Fruits.html "> Fruits</ a > </ li >
65
+ < li > < a class ="dropdown-item " href ="Vegitables.html "> Vegetables</ a > </ li >
66
+ < li > < a class ="dropdown-item " href ="LeafVegitables.html "> Leafy Vegetables</ a > </ li >
67
+ </ ul >
68
+ </ div >
69
+ </ li >
70
+ < li class ="nav-item ">
71
+ < a class ="nav-link link text-black display-4 " href ="contact us.html "> Contact us</ a >
72
+ </ li >
73
+ < li class ="nav-item ">
74
+ < a class ="nav-link link text-black display-4 " href ="services.html "> services</ a >
75
+ </ li >
76
+ </ ul >
77
+ < div class ="navbar-buttons ">
78
+ < a class ="btn btn-primary display-4 " href ="chatbot.html "> Chat Bot</ a >
79
+ </ div >
80
+ </ div >
81
+ </ div >
82
+ </ nav >
83
+ </ section >
84
+
85
+
86
+
87
+ </ head >
88
+ < body >
89
+
90
+ < header >
91
+ < h1 > Fruits </ h1 >
92
+ </ header >
93
+
94
+ < section >
95
+ < div class ="product ">
96
+ < img src ="mango.jpg " alt ="Product 1 ">
97
+ < strong > Mango </ strong align-center>
98
+ < p > Price: ₹300</ p >
99
+ < label for ="quantity1 "> Quantity (kg):</ label >
100
+ < input type ="number " id ="quantity1 " min ="1 " value ="1 ">
101
+ < button onclick ="addToCart('Mango ', 300, 'quantity1') "> Add to Cart</ button > </ div >
102
+
103
+ < div class ="product ">
104
+ < img src ="guava.jpg
105
+ " alt ="Product 2 ">
106
+ < strong > Guava </ strong >
107
+ < p > Price: ₹50</ p >
108
+ < label for ="quantity2 "> Quantity (kg):</ label >
109
+ < input type ="number " id ="quantity2 " min ="1 " value ="1 ">
110
+ < button onclick ="addToCart('Guava', 49.99, 'quantity2') "> Add to Cart</ button > </ div >
111
+
112
+ < div class ="product ">
113
+ < img src ="Papaya.jpg " alt ="Product 2 ">
114
+ < strong > Papaya </ strong >
115
+ < p > Price: ₹50</ p >
116
+ < label for ="quantity3 "> Quantity (kg):</ label >
117
+ < input type ="number " id ="quantity3 " min ="1 " value ="1 ">
118
+ < button onclick ="addToCart('Papaya', 50, 'quantity3') "> Add to Cart</ button > </ div >
119
+ </ section >
120
+
121
+ < section >
122
+ < div class ="product ">
123
+ < img src ="water melon.jpg " alt ="Product 2 ">
124
+ < strong > Water Melon </ strong >
125
+ < p > Price: ₹150</ p >
126
+ < label for ="quantity4 "> Quantity (kg):</ label >
127
+ < input type ="number " id ="quantity4 " min ="1 " value ="1 ">
128
+ < button onclick ="addToCart('Water Melon', 150, 'quantity4') "> Add to Cart</ button > </ div >
129
+
130
+
131
+
132
+
133
+ < div class ="product ">
134
+ < img src ="sapota (2).jpg " alt ="Product 1 ">
135
+ < strong > Sapota</ strong align-center>
136
+ < p > Price: ₹110</ p >
137
+ < label for ="quantity5 "> Quantity (kg):</ label >
138
+ < input type ="number " id ="quantity5 " min ="1 " value ="1 ">
139
+ < button onclick ="addToCart('Sapota', 110, 'quantity5') "> Add to Cart</ button > </ div >
140
+
141
+ < div class ="product ">
142
+ < img src ="orange.jpg " alt ="Product 2 ">
143
+ < strong > Oranges</ strong >
144
+ < p > Price: ₹60</ p >
145
+ < label for ="quantity6 "> Quantity (kg):</ label >
146
+ < input type ="number " id ="quantity6 " min ="1 " value ="1 ">
147
+ < button onclick ="addToCart('Oranges', 60, 'quantity6') "> Add to Cart</ button > </ div >
148
+ </ section >
149
+
150
+ < section >
151
+ < div class ="product ">
152
+ < img src ="Muskumelon.jpg " alt ="Product 2 ">
153
+ < strong > Muskmelon</ strong >
154
+ < p > Price: ₹40</ p >
155
+ < label for ="quantity7 "> Quantity (kg):</ label >
156
+ < input type ="number " id ="quantity7 " min ="1 " value ="1 ">
157
+ < button onclick ="addToCart('Muskmelon', 40, 'quantity7') "> Add to Cart</ button > </ div >
158
+
159
+
160
+ < div class ="product ">
161
+ < img src ="dragon fruit.jpg " alt ="Product 2 ">
162
+ < strong > Dragon Fruit</ strong >
163
+ < p > Price: ₹130</ p >
164
+ < label for ="quantity8 "> Quantity (kg):</ label >
165
+ < input type ="number " id ="quantity8 " min ="1 " value ="1 ">
166
+ < button onclick ="addToCart('Dragon Fruit', 130, 'quantity8') "> Add to Cart</ button > </ div >
167
+
168
+ </ section >
169
+
170
+
171
+ < script >
172
+ function addToCart ( productName , price , quantityId ) {
173
+ var quantity = document . getElementById ( quantityId ) . value ;
174
+ var totalPrice = price * quantity ;
175
+
176
+ // Display popup message//
177
+ alert ( 'Added to Cart!\nProduct: ' + productName + '\nQuantity: ' + quantity + '\nTotal Price: ₹' + totalPrice . toFixed ( 2 ) ) ;
178
+ }
179
+ </ script >
180
+
181
+ <!-- dropdown -->
182
+ < script src ="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js "> </ script >
183
+ < script src ="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js "> </ script >
184
+
185
+
186
+ </ body >
187
+ </ html >
0 commit comments