├── script.js
├── food.html
├── contact.html
├── about.html
├── menu.html
├── index.html
└── style.css
/script.js:
--------------------------------------------------------------------------------
1 | // Example JavaScript functionality
2 | document.querySelector('.btn').addEventListener('click', function() {
3 | alert('Redirecting to menu...');
4 | // Add functionality to navigate to the menu section
5 | });
6 |
--------------------------------------------------------------------------------
/food.html:
--------------------------------------------------------------------------------
1 |
2 | Foodie
3 |
8 |
9 |
--------------------------------------------------------------------------------
/contact.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Contact Us - Foodie
7 |
11 | Foodie
12 |
17 |
18 |
19 |
35 |
36 |
37 | © 2025 Foodie Delivery
38 |
39 |
40 |
41 |
--------------------------------------------------------------------------------
/about.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | About Us - Foodie
7 |
11 | Foodie
12 |
17 |
18 |
19 |
20 | About Foodie
21 | At Foodie, we believe in delivering delicious meals right to your doorstep. Our team is dedicated to providing fast and friendly service, ensuring you enjoy every bite.
22 | Our Team
23 |
24 |
25 |
26 |
Chef John
27 |
Head Chef with over 20 years of culinary experience.
28 |
29 |
30 |
31 |
Driver Sarah
32 |
Ensuring timely deliveries with a smile.
33 |
34 |
36 |
37 |
38 | © 2025 Foodie Delivery
39 |
40 |
41 |
42 |
--------------------------------------------------------------------------------
/menu.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Menu - Foodie
7 |
11 | Foodie
12 |
17 |
18 |
19 |
42 |
43 |
44 | © 2025 Foodie Delivery
45 |
46 |
47 |
48 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 | Food Delivery
7 |
48 | About Us
49 | At Foodie, we believe in serving quality food that's both tasty and nutritious. Our team is dedicated to bringing you the best culinary experience.
50 |
51 |
52 |
57 |
58 |
59 |
60 |
61 |
--------------------------------------------------------------------------------
/style.css:
--------------------------------------------------------------------------------
1 | /* Reset default styles */
2 | * {
3 | margin: 0;
4 | padding: 0;
5 | box-sizing: border-box;
6 | }
7 |
8 | /* Body and general styles */
9 | body {
10 | font-family: Arial, sans-serif;
11 | line-height: 1.6;
12 | background-color: #f4f4f4;
13 | color: #333;
14 | }
15 |
16 | /* Header and navigation */
17 | header {
18 | background-color: #333;
19 | color: #fff;
20 | padding: 20px 0;
21 | text-align: center;
22 | }
23 |
24 | nav .logo {
25 | font-size: 2rem;
26 | font-weight: bold;
27 | }
28 |
29 | nav ul {
30 | list-style: none;
31 | display: flex;
32 | justify-content: center;
33 | margin-top: 10px;
34 | }
35 |
36 | nav ul li {
37 | margin: 0 15px;
38 | }
39 |
40 | nav ul li a {
41 | color: #fff;
42 | text-decoration: none;
43 | font-size: 1.1rem;
44 | }
45 |
46 | .hero {
47 | margin-top: 20px;
48 | }
49 |
50 | .hero h1 {
51 | font-size: 2.5rem;
52 | margin-bottom: 10px;
53 | }
54 |
55 | .hero p {
56 | font-size: 1.2rem;
57 | margin-bottom: 20px;
58 | }
59 |
60 | .hero .btn {
61 | background-color: #e67e22;
62 | color: #fff;
63 | padding: 10px 20px;
64 | text-decoration: none;
65 | border-radius: 5px;
66 | font-size: 1.1rem;
67 | }
68 |
69 | /* Menu section */
70 | #menu {
71 | padding: 40px 20px;
72 | text-align: center;
73 | }
74 |
75 | #menu h2 {
76 | font-size: 2rem;
77 | margin-bottom: 20px;
78 | }
79 |
80 | .menu-items {
81 | display: flex;
82 | justify-content: space-around;
83 | }
84 |
85 | .menu-item {
86 | background-color: #fff;
87 | padding: 20px;
88 | border-radius: 10px;
89 | box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
90 | width: 30%;
91 | text-align: center;
92 | }
93 |
94 | .menu-item img {
95 | width: 100%;
96 | border-radius: 10px;
97 | margin-bottom: 10px;
98 | }
99 |
100 | .menu-item h3 {
101 | font-size: 1.5rem;
102 | margin-bottom: 10px;
103 | }
104 |
105 | .menu-item p {
106 | font-size: 1rem;
107 | color: #555;
108 | }
109 |
110 | /* About section */
111 | #about {
112 | padding: 40px 20px;
113 | background-color: #fff;
114 | text-align: center;
115 | }
116 |
117 | #about h2 {
118 | font-size: 2rem;
119 | margin-bottom: 20px;
120 | }
121 |
122 | #about p {
123 | font-size: 1.2rem;
124 | color: #555;
125 | }
126 |
127 | /* Footer */
128 | footer {
129 | padding: 20px;
130 | background-color: #333;
131 | color: #fff;
132 | text-align: center;
133 | }
134 |
135 | footer h2 {
136 | font-size: 1.8rem;
137 | margin-bottom: 10px;
138 | }
139 |
140 | footer p {
141 | font-size: 1.1rem;
142 | }
143 |
--------------------------------------------------------------------------------
26 | 
31 | 
24 | 
30 | 
36 |