-
Notifications
You must be signed in to change notification settings - Fork 0
/
food.html
144 lines (142 loc) · 4.7 KB
/
food.html
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
<html>
<head>
<title>Foodcubo</title>
<link rel="stylesheet" href="./src/css/style.css" />
</head>
<body>
<div class="landing">
<div class="landing-interact">
<div class="navbar">
<div class="branding">
<div><img class="logo" src="./src/images/logo.png" /></div>
<div class="logo-title">FOODCUBO</div>
</div>
<!--
<div class="links">
<div>
<button class="nav-button login">Login</button>
</div>
<div>
<button class="nav-button sign">Sign up</button>
</div>
</div>
-->
</div>
<div class="title">
<div id="typewriter" class="changing"></div>
<div class="sub-title">Find awesome restaurants near you.</div>
</div>
<div class="search">
<select
id="selection"
onchange="updateSelection(); document.getElementById('search').href=`./static/list.html?q=${this.value}`;"
class="search-bar"
type="text"
placeholder="Enter your delivery location"
>
<option value="" selected style="display: none"
>Select your location</option
>
<option value="11">Ahmedabad</option>
<option value="3">Bangalore</option>
<option value="7">Chennai</option>
<option value="1">Delhi</option>
<option value="6">Hyderabad</option>
<option value="2">Kolkata</option>
<option value="3">Mumbai</option>
<option value="5">Pune</option>
</select>
<a id="search" href="#"
><button
disabled
id="search-button"
class="search-bar search-submit"
type="submit"
>
Search
</button></a
>
<script>
function updateSelection() {
console.log("lol");
if (document.getElementById("selection").value == "") {
document.getElementById("search-button").disabled = true;
} else {
document.getElementById("search-button").disabled = false;
}
}
</script>
</div>
<div class=" cities ">
<div class="cities-title">CITIES SERVED IN INDIA</div>
<div class="cities-sub-title">
Ahmedabad, Bangalore, Chennai, Delhi, Hyderabad, Kolkata, Mumbai, &
Pune
</div>
</div>
</div>
<div class="landing-images ">
<img class="landing-image " src="./src/images/4.jpg " />
</div>
</div>
<div class="features">
<div class="feature">
<div><img class="feature-image" src="src/images/order.png" /></div>
<div class="feature-title">Variety & Choices</div>
<div class="feature-desc">
Loathing for Italian, Thai, Indian or Chinese food? We got restaurants
covering many cuisines.
</div>
</div>
<div class="feature">
<div><img class="feature-image" src="src/images/ice-cream.png" /></div>
<div class="feature-title">Close To You</div>
<div class="feature-desc">
Get to know awesome resturants near you. Find out what they offer and
see customer reviews.
</div>
</div>
</div>
<div class="mobile">
<div class="mob-1">
<img class="mobile-image" src="src/images/phone.png" />
</div>
<div class="mob-2">
<div class="changing">Restaurants in your pocket</div>
<div class="sub-title">
Discover new restaurants near you on the go, with the all-new Foodcubo
app.
</div>
<div class="stores">
<img
class="store-image"
onClick="alertFunction()"
src="src/images/play.webp"
/><img class="store-image" src="src/images/iOS.webp" onClick="alertFunction()"/>
</div>
</div>
</div>
<div class="footer">
<div class="credits">Made by Nilarjun Das | Inspired by Swiggy</div>
</div>
<script>
const alertFunction = () => {
window.alert("App is in development... or is it?");
};
</script>
<script src="./src/js/core.js"></script>
<script type="text/javascript">
const instance = new Typewriter("#typewriter", {
strings: [
"Feeling hungry?",
"Unexpected guests?",
"Cooking gone wrong?",
"Game night?",
"Movie marathon?"
],
autoStart: true,
loop: true
});
</script>
</body>
</html>