-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
152 lines (141 loc) · 6.72 KB
/
index.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
145
146
147
148
149
150
151
152
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LuckyLunch Ladybug</title>
<link rel="shortcut icon" href="logo.ico" type="image/x-icon">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" media="screen and (max-width: 1170px)" href="phone.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=Fjalla+One&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Jost:wght@900;ital,200&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&display=swap"
rel="stylesheet">
<!-- new-one-->
<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=Kalam:wght@300;400;700&display=swap" rel="stylesheet">
<!-- new-two-->
<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=Figtree:ital,wght@0,300..900;1,300..900&display=swap"
rel="stylesheet">
<style>
#progress {
position: fixed;
bottom: 20px;
right: 10px;
height: 70px;
width: 70px;
display: none;
place-items: center;
border-radius: 50%;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
cursor: pointer;
}
#progress-value {
display: block;
height: calc(100% - 15px);
width: calc(100% - 15px);
background-color: whitesmoke;
border-radius: 50%;
display: grid;
place-items: center;
font-size: 35px;
color: black;
font-weight: 700;
}
html {
scroll-behavior: smooth;
}
</style>
</head>
<body>
<div id="navbar">
<div id="logo"><a href=""><img src="logo.ico" alt="LuckyLunch Ladybig"></div></a>
<ul>
<li class="items"><a href="#home">Home</a></li>
<li class="items"><a href="#lejao-service-par">Services</a></li>
<li class="items"><a href="#h-primary-center">Sponsors</a></li>
<li class="items"><a href="about_us.html">About Us</a></li>
</ul>
</div>
<!-- cover id 💫 -->
<div id="cover">
<section id="home">
<h1 class="h-primary"><i>Hi Foodie! wanna satisfy your Appetite? </i></h1><br>
<p><i><b>LuckyLunch Ladybug</b>, a delightful haven for food enthusiasts, invites you on a culinary journey
that
combines
luck and flavor in every bite.Dive ladybug's picnic!</i></p><br>
</section>
<button class="btn">Place Order
</button>
<section class="services-container">
<!-- Primary Heading -->
<div id="lejao-service-par">
<h1 class="h-primary-center">Our Services</h1>
<!-- cards heading k badd se 😭 -->
<div id="services">
<div class="box">
<img src="Pizza.png" alt="">
<h2 class="h-secondary-center">Food Catering</h2>
<p class="text-center"><b>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Cumque
exercitationem laudantium placeat
expedita laboriosam inventore minima, veritatis reiciendis alias eius repellendus quas
sunt
dolores
perspiciatis dolorum. Delectus sapiente soluta iure.</b></p>
</div>
<div class="box">
<img src="bar-be-que.png" alt="">
<h2 class="h-secondary-center">Bulk Ordering</h2>
<p class="text-center"><b>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Cumque
exercitationem laudantium placeat
expedita laboriosam inventore minima, veritatis reiciendis alias eius repellendus quas
sunt
dolores
perspiciatis dolorum. Delectus sapiente soluta iure.</b></p>
</div>
<div class="box">
<img src="deliveryboy.png" alt="">
<h2 class="h-secondary-center">Food Ordering</h2>
<p class="text-center"><b>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Cumque
exercitationem laudantium placeat
expedita laboriosam inventore minima, veritatis reiciendis alias eius repellendus quas
sunt
dolores
perspiciatis dolorum. Delectus sapiente soluta iure.</b></p>
</div>
</div>
</div>
</section>
<br><br>
<br>
<h1 id="h-primary-center">Sponsors</h1>
<section id="client">
<div class="client-item"><img src="emclient.png" alt="Elon Musk"></div>
<div class="client-item"><img src="mzclient.png" alt="Mark Zingerburger"></div>
<div class="client-item"><img src="jbclient.png" alt="Jeff Bezoz"></div>
</section>
</div>
<!-- Copyright 💥 -->
<footer>
<div class="center">
Copyright © www.LuckyLunch Ladybug.com. All rights reserved
</div>
</footer>
<p id="cell1">📞Cell: 0300-2131229</p>
<p id="cell2">📧Mail: arhamarhamhussain4@gmail.com</p><br>
<div id="progress">
<span id="progress-value"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" color="#000000" fill="none">
<path d="M18 15C18 15 13.5811 9.00001 12 9C10.4188 8.99999 6 15 6 15" stroke="currentColor" stroke-width="3.5" stroke-linecap="round" stroke-linejoin="round" />
</svg></span>
</div>
<script src="script.js"></script>
</body>
</html>