-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
234 lines (181 loc) · 10.3 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
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Emmanuella lubinda personal portifolio</title>
<!-- box icons -->
<link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'>
<!-- custom css -->
<link rel="stylesheet" href="style.css">
</head>
<body>
<!--header design-->
<header class="header">
<a href="a" class="logo">EMMANUELLA.</a>
<i class='bx bx-menu' id="menu-icon"></i>
<nav class="navbar">
<a href="#home" class="active">Home</a>
<a href="#about">About</a>
<a href="#services">Services</a>
<a href="#portfolio">portifolio</a>
<a href="#contact">Contact</a>
</nav>
</header>
<!--home section design-->>
<section class="home" id="home">
<div class="home-content">
<h3>Hello, It's Me</h3>
<h1>Emmanuella Lubinda</h1>
<h3>And I'm a <span class="multiple-text"></span></h3>
<p>I'm a tech enthusiast with a strong foundation in front-end development, dedicated to crafting immersive and intuitive digital experiences. With 2 years of experience in the field, I thrive on transforming ideas into responsive, user-centric websites.</p>
<div class="social-media">
<a href="#"><i class='bx bxl-telegram'></i></a>
<a href="https://github.com/Emmanuella2305" target="_blank">
<i class='bx bxl-github'></i>
</a>
<a href="https://www.instagram.com/emmanuella_2305/" target="_blank">
<i class='bx bxl-instagram'></i>
</a>
<a href="https://www.linkedin.com/in/emmanuella-lubinda-321582242/" target="_blank">
<i class='bx bxl-linkedin-square'></i>
</a>
</div>
<a href="#" class="btn">Dawnload cv</a>
</div>
<div class="home-img">
<img src="images/eight.jpg" alt="">
</div>
</section>
<!-- about section design-->
<section class="about" id="about">
<div class="about-img">
<img src="images/seven.jpg" alt="">
</div>
<div class="about-content">
<h2 class="heading">About <span>Me</span></h2>
<h3>Frontend Developer!</h3>
<p>My name is Emmanuella Lubinda, as a girl in tech whose working on improving her skills.I am a highly focused, committed and enthusiastic Person and I am social in nature which helps me to work with others.i have a strong passion for helping others, making a positive impact in the lives of those around me .I am a Passionate web developer with expertise in front-end and also interested in data science . I love creating responsive and user-friendly websites</p>
<a href="#" class="btn">Read More</a>
</div>
</section>
<!-- services section design -->
<section class="services" id="services">
<h2 class="heading">Our <span>Services</span></h2>
<div class="services-container">
<div class="services-box">
<i class='bx bx-code-alt'></i>
<h3>Web Developer</h3>
<p>As a Web developer we are specialized in front-end and back-end development, and may offer full-stack development services covering both aspects. The specific services provided can also depend on the evolving technologies and trends in the web development industry.</p>
<a href="#" class="btn">Read More</a>
</div>
<div class="services-box">
<i class='bx bxs-paint'></i>
<h3>Graphic Designer</h3>
<p>Our graphic design services cover a wide range of products brochures, business cards, publications, mailers, posters and billboards, we’ve pretty much designed it all.</p>
<a href="#" class="btn">Read More</a>
</div>
<div class="services-box">
<i class='bx bx-bar-chart-alt'></i>
<h3>Digital Marketing</h3>
<p>We provide broad range of strategies and activities that leverage digital channels, platforms, and technologies to promote products, services, or brands.</p>
<a href="#" class="btn">Read More</a>
</div>
</div>
</section>
<!-- portfolio section design -->
<section class="portfolio" id="portfolio">
<a class="heading">Latest <span>Project</span></a>
<div class="portfolio-container">
<div class="portfolio-box">
<img src="images/portfolio1.jpg" alt="">
<div class="portfolio-layer">
<h4>medical-diagnosis App</h4>
<p>
The Medical Diagnosis Web App is an innovative and user-friendly platform designed to revolutionize the way individuals access and interpret their health information. This project aims to provide a seamless and efficient means for users to obtain preliminary medical assessments based on their reported symptoms and health history.</p>
<a href="https://github.com/Emmanuella2305/medical-diagnosis" target="_blank" rel="noopener noreferrer">
<i class='bx bx-link-external'></i>
</a>
</div>
</div>
<div class="portfolio-box">
<img src="images/portfolio2.jpg" alt="">
<div class="portfolio-layer">
<h4>Web Design</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa, debitis temporibus modi exercitationem dolorum possimus atque doloremque excepturi similique consectetur accusantium pariatur aliquid corrupti, sed labore totam libero eos! Tempore!</p>
<a href="#"><i class='bx bx-link-external'></i></a>
</div>
</div>
<div class="portfolio-box">
<img src="images/portfolio3.jpg" alt="">
<div class="portfolio-layer">
<h4>Profile Card</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa, debitis temporibus modi exercitationem dolorum possimus atque doloremque excepturi similique consectetur accusantium pariatur aliquid corrupti, sed labore totam libero eos! Tempore!</p>
<a href="#"><i class='bx bx-link-external'></i></a>
</div>
</div>
<div class="portfolio-box">
<img src="images/portfolio4.jpg" alt="">
<div class="portfolio-layer">
<h4>Medical Diagnosis App</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa, debitis temporibus modi exercitationem dolorum possimus atque doloremque excepturi similique consectetur accusantium pariatur aliquid corrupti, sed labore totam libero eos! Tempore!</p>
<a href="#"><i class='bx bx-link-external'></i></a>
</div>
</div>
<div class="portfolio-box">
<img src="images/portfolio5.jpg" alt="">
<div class="portfolio-layer">
<h4>Web Design</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa, debitis temporibus modi exercitationem dolorum possimus atque doloremque excepturi similique consectetur accusantium pariatur aliquid corrupti, sed labore totam libero eos! Tempore!</p>
<a href="https://github.com/Emmanuella2305/medical-diagnosis" target="_blank" rel="noopener noreferrer">
<i class='bx bx-link-external'></i>
</a>
</div>
</div>
<div class="portfolio-box">
<img src="images/portfolio6.jpg" alt="">
<div class="portfolio-layer">
<h4>Weather app</h4>
<p>The Console Weather App is a command-line interface (CLI) project designed to bring accurate and real-time weather information directly to your terminal. This minimalist yet powerful application allows users to quickly check the current weather conditions and forecasts for their desired locations, all without leaving the comfort of their command line.</p>
<a href="https://github.com/Emmanuella2305/Weather-Console-App" target="_blank"><i class='bx bx-link-external'></i></a>
</div>
</div>
</div>
</section>
<!-- contact section design -->
<section class="contact" id="contact">
<h1 class="heading">Contact <span>Details!</span></h1>
<p><strong>Email:</strong> [email protected]</p>
<p><strong>Phone:</strong> +260974751148/+260964686481</p>
<p><strong>Address:</strong> 9miles Great north road, Lusaka, Zambia</p>
<h2 class="heading">Contact <span>Me!</span></h2>
<form action="#">
<div class="input-box">
<input type="text" placeholder="Full Name">
<input type="email" placeholder="Email Address">
</div>
<div class="input-box">
<input type="number" placeholder="Mobile Number">
<input type="text" placeholder="Email Subject">
</div>
<textarea name="" id="" cols="30" rows="10" placeholder="Your Message"></textarea>
<input type="submit" value="Send Message" class="btn">
</form>
</section>
<!-- footer design-->
<footer class="footer">
<div class="footer-text">
<p>Copyright © 2024 by Emmanuella | All Rights Reserved.</p>
</div>
<div class="footer-iconTop">
<a href="#home"><i class='bx bx-up-arrow-alt'></i></a>
</div>
</footer>
<!-- scroll reveal --->
<script src="https://unpkg.com/scrollreveal"></script>
<!-- typed js -->
<script src="https://unpkg.com/[email protected]/dist/typed.umd.js"></script>
<!-- custom js-->
<script src="script.js"></script>
</body>
</html>