-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
307 lines (284 loc) · 12.6 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
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description"
content="Ahmed Allam's portfolio showcasing exceptional projects in web design, development, and innovative solutions.">
<meta name="keywords"
content="Ahmed Allam, Web Developer, Frontend Development, Web Design, JavaScript, HTML, CSS, Portfolio">
<meta name="author" content="Ahmed Allam">
<meta property="og:title" content="Ahmed Allam | Portfolio">
<meta property="og:description"
content="Discover Ahmed Allam's professional portfolio featuring expertise in web development and design.">
<meta property="og:image" content="https://ahmadallam.netlify.app/assets/images/profile/profile.webp">
<meta property="og:url" content="https://ahmadallam.netlify.app/">
<meta property="og:type" content="website">
<meta name="robots" content="index, follow">
<meta name="theme-color" content="#ff9800">
<title>Ahmed Allam | Portfolio</title>
<link rel="icon" href="images/icon.png">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/all.min.css">
<link rel="stylesheet" href="css/styles.css">
<link rel="canonical" href="https://ahmadallam.netlify.app/">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Audiowide&display=swap">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Mali:ital,wght@0,200;1,200&display=swap">
</head>
<body>
<!-- Start Header -->
<header>
<div class="container">
<div class="logo">
<a href="index.html">
<img src="images/icon.png" alt="Ahmed Allam's Logo"> Portfolio.
</a>
</div>
<nav>
<ul class="nav-links">
<li><a href="#home" data-scroll="home" class="active">Home</a></li>
<li><a href="#about" data-scroll="about">About</a></li>
<li><a href="#projects" data-scroll="projects">Projects</a></li>
<li><a href="#contact" data-scroll="contact">Contact</a></li>
</ul>
</nav>
</div>
</header>
<!-- End Header -->
<!-- Start Main Portfolio -->
<main>
<!-- Start Landing Section -->
<section id="home" class="landing block">
<div class="container">
<div class="landing-content">
<div class="me left">
<h1>Hi!<span>👋</span></h1>
<h2>
<b>I'm</b>
<span class="line-effect">
<b>Ahmed Allam</b>
</span>
</h2>
<span class="nr line-effect">─────────────────── </span>
<span class="writer">Full Stack .Net Web Developer</span>
<p id="summary" style="line-height:1.5">
A passionate Full Stack .Net Web Developer and second-year
student in Computer and Control System Engineering. I specialize in creating dynamic,
user-friendly web experiences using Angular, I aim to create impactful digital solutions. As a
detail-oriented problem solver.
</p>
<a href="https://www.linkedin.com/in/1ahmed-allam/" class="btn" target="_blank">Hire Me
<i class="fa-brands fa-telegram" style="font-size: 14px; color:white"></i>
</a>
<a class="border-button" href="#projects">View Projects</a>
</div>
<div class="right">
<img src="images/profile.jpg" alt="Ahmed Allam's Profile Picture" data-tilt>
</div>
</div>
</section>
<!-- End Landing Section -->
<!-- Start About Me Section -->
<section id="about" class="aboutme block">
<div class="container">
<div class="aboutme-content">
<div class="left">
<h2 class="line-effect">About Me</h2>
</div>
<div class="right">
<p>
I focus on blending creativity with functionality, ensuring that every project is both visually compelling
and optimized for performance.
Driven by a love for innovation, I continually refine my skills to stay ahead of industry trends. Whether
it’s
building <span class="line-effect">responsive layouts</span>, improving UI, or exploring new technologies,
I aim to create impactful digital solutions. As a
detail-oriented <span class="line-effect">problem solver</span>, I thrive in both team and <span
class="line-effect">solo projects</span>,
and I’m committed to contributing
to the future
of web development. Let’s <span class="line-effect">connect</span> and bring ideas to life through design
and technology!
</p>
<a href="https://drive.google.com/file/d/1A03GT6UtJXdRTBuESpx0TS8LPF6tOgqm/view?usp=sharing" class="btn"
target="_blank">Download CV
<i class="fa-solid fa-file" style="font-size: 14px; color:white"></i>
</a>
<a class="border-button" href="mailto:ahmallam@std.mans.edu.eg">Email Me</a>
</div>
</div>
</div>
</section>
<!-- End About Me Section -->
</main>
<!-- End Main Portfolio -->
<!-- Start Project Section -->
<section id="projects" class="projects block">
<h2>Selected Projects</h2>
<div class="container">
<div class="projectOne project reverse">
<div class="photo">
<img src="images/landing1.webp" alt="">
</div>
<div class="data">
<h3>Techvio - Your Comprehensive IT Solutions Platform</h3>
<p>
Welcome to Techvio, an innovative multi-page application designed to cater to all your IT needs. With a
sleek and modern
design, Techvio provides users with a seamless experience across multiple themes and functionalities. This
project
showcases a sophisticated understanding of web technologies, combining the power of PugJs, GulpJs, SCSS,
Bootstrap 5,
jQuery, TypeScript, and various essential libraries.
</p>
<a href="https://gzixnine.github.io/Techvio/dist/index.html" target="_blank" class="btn">Demo</a>
<a href="https://github.com/GziXnine/Techvio" target="_blank" class="border-button">Github</a>
</div>
</div>
<div class="dotted">
─
</div>
<div class="projectTwo project">
<div class="photo">
<img src="images/landing2.webp" alt="">
</div>
<div class="data">
<h3>Techvio - Your Comprehensive IT Solutions Platform</h3>
<p>
Welcome to Techvio, an innovative multi-page application designed to cater to all your IT needs. With a
sleek and modern
design, Techvio provides users with a seamless experience across multiple themes and functionalities. This
project
showcases a sophisticated understanding of web technologies, combining the power of PugJs, GulpJs, SCSS,
Bootstrap 5,
jQuery, TypeScript, and various essential libraries.
</p>
<a href="https://gzixnine.github.io/Techvio/dist/landing2.html" target="_blank" class="btn">Demo</a>
<a href="https://github.com/GziXnine/Techvio" target="_blank" class="border-button">Github</a>
</div>
</div>
<div class="dotted">
─
</div>
<div class="projectThree project reverse">
<div class="photo">
<img src="images/landing3.webp" alt="">
</div>
<div class="data">
<h3>Techvio - Your Comprehensive IT Solutions Platform</h3>
<p>
Welcome to Techvio, an innovative multi-page application designed to cater to all your IT needs. With a
sleek and modern
design, Techvio provides users with a seamless experience across multiple themes and functionalities. This
project
showcases a sophisticated understanding of web technologies, combining the power of PugJs, GulpJs, SCSS,
Bootstrap 5,
jQuery, TypeScript, and various essential libraries.
</p>
<a href="https://gzixnine.github.io/Techvio/dist/landing3.html" target="_blank" class="btn">Demo</a>
<a href="https://github.com/GziXnine/Techvio" target="_blank" class="border-button">Github</a>
</div>
</div>
<div class="dotted">
─
</div>
<div class="projectFour project">
<div class="photo">
<img src="images/landing4.webp" alt="">
</div>
<div class="data">
<h3>Techvio - Your Comprehensive IT Solutions Platform</h3>
<p>
Welcome to Techvio, an innovative multi-page application designed to cater to all your IT needs. With a
sleek and modern
design, Techvio provides users with a seamless experience across multiple themes and functionalities. This
project
showcases a sophisticated understanding of web technologies, combining the power of PugJs, GulpJs, SCSS,
Bootstrap 5,
jQuery, TypeScript, and various essential libraries.
</p>
<a href="https://gzixnine.github.io/Techvio/dist/landing4.html" target="_blank" class="btn">Demo</a>
<a href="https://github.com/GziXnine/Techvio" target="_blank" class="border-button">Github</a>
</div>
</div>
<div class="dotted">
─
</div>
<div class="projectFive project reverse">
<div class="photo">
<img src="images/landing5.webp" alt="">
</div>
<div class="data">
<h3>Techvio - Your Comprehensive IT Solutions Platform</h3>
<p>
Welcome to Techvio, an innovative multi-page application designed to cater to all your IT needs. With a
sleek and modern
design, Techvio provides users with a seamless experience across multiple themes and functionalities. This
project
showcases a sophisticated understanding of web technologies, combining the power of PugJs, GulpJs, SCSS,
Bootstrap 5,
jQuery, TypeScript, and various essential libraries.
</p>
<a href="https://gzixnine.github.io/Techvio/dist/landing5.html" target="_blank" class="btn">Demo</a>
<a href="https://github.com/GziXnine/Techvio" target="_blank" class="border-button">Github</a>
</div>
</div>
</div>
</section>
<!-- End Project Section -->
<!-- Start Footer -->
<footer id="contact" class="block">
<h3 class="line-effect">Contact</h3>
<div class="container">
<form action="" class="form" autocomplete="on">
<div class="form-group">
<label for="name" class="form-label">Name</label>
<input type="text" id="name" class="form-input" name="name" autocomplete="name" required
aria-label="Full Name">
</div>
<div class="form-group">
<label for="email" class="form-label">Email</label>
<input type="email" id="email" class="form-input" name="email" autocomplete="email" required
aria-label="Email Address">
</div>
<div class="form-group">
<label for="message" class="form-label">Message</label>
<textarea id="message" class="form-textarea" name="message" rows="4" autocomplete="off" required
aria-label="Your Message"></textarea>
</div>
<button type="submit" class="form-submit">Submit</button>
</form>
<ul class="links">
<li>
<a href="https://www.linkedin.com/in/1ahmed-allam/" target="_blank">
<i class="fa-brands fa-linkedin"></i>
</a>
</li>
<li>
<a href="https://github.com/GziXnine" target="_blank">
<i class="fa-brands fa-github"></i>
</a>
</li>
<li>
<a href="https://wa.me/201200555290?text=Hello%2C%20I%27m%20interested%20in%20your%20services!"
target="_blank">
<i class=" fa-brands fa-whatsapp"></i>
</a>
</li>
<li>
<a href="https://t.me/GziXnine" target="_blank">
<i class="fa-brands fa-telegram"></i>
</a>
</li>
</ul>
</div>
</footer>
<!-- End Footer -->
<script src="js/all.min.js"></script>
<script src="js/vanilla-tilt.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>