-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
211 lines (200 loc) · 8.47 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
<!DOCTYPE html>
<html lang="en">
<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">
<!-- import font awoseme -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- import custom style -->
<link rel="stylesheet" href="./assets/css/style.css">
<link rel="icon" type="image/x-icon" href="./assets/img/mylogoo.png">
<!-- import media -->
<link rel="stylesheet" href="./assets/css/media.css">
<title>Portfolio</title>
</head>
<body>
<!--start navbar-->
<div class="navbar">
<div class="container">
<div class="navbar-left">
<img src="assets/img/mylogoo.png" width="120px" height="60px" alt="wafa logo">
</div>
<div class="navbar-right">
<ul class="list">
<li class="item active ">
<a href="#" class="link">Home</a>
</li>
<li class="item">
<a href="#About" class="link">About</a>
</li>
<li class="item">
<a href="#Project" class="link">Projects</a>
</li>
<li class="item">
<a href="#Contact" class="link">Contact Details</a>
</li>
<li class="item">
<a href="./Wafaas-Resume.pdf" id="Resume" class="link">Resume</a>
</li>
</ul>
<div class="menu">
<i class="fa fa-reorder"></i>
</div>
</div>
</div>
</div>
<!-- end navbar -->
<!-- start header -->
<div class="header">
<div class="overlay"></div>
<div class="header-content">
<h1 class="animation">WAFA AL OMOUR </h1>
<p>Fresh Front-End Devloper</p>
<div class="header-btn">
<a href="#About" class="learn-btn">About</a>
<a href="#Contact" class="contact-btn">Contact</a>
</div>
</div>
</div>
<!-- end header -->
<!-- start about -->
<div class="about" id="About">
<div class="container">
<div class="about-img">
<img src="assets/img/about.png" width="350px" height="670px" alt="wafa img" >
</div>
<div class="about-content">
<h2><b>Who Am I?</b></h2>
<p>
hi I'm Wafa fresh front-end developer having experience in building web applications
with HTML,CSS, javascript,react.js and some other incredible libraries and frameworks.
working on make things simple, but significant,and I believe that Design is not just what
it looks like and feels like, Design is how it works.
My responsibilities:
</p>
<ul class="list">
<li class="item"><span><i class="fa fa-magic"></i></span>Developing and maintaining interfaces.</li>
<li class="item"><span><i class="fa fa-mobile-phone"></i></span> Implementing design on mobile.</li>
<li class="item"><span><i class="fa fa-rocket"></i></span> Creating tools that improve interaction.</li>
<li class="item"><span><i class="fa fa-wrench"></i></i></span>Managing software workflow.</li>
</ul>
<button class="hi-btn">Click on me to say hi</button>
</div>
</div>
</div>
<!-- end about -->
<!-- start projects -->
<div class="project" id="Project">
<h2>Projects</h2>
<div class="container">
<div class="project-item">
<img src="./assets/img/datadopet.PNG" width="350px" height="350px">
<h3>FACEBOOK SCRAPER</h3>
<p>an algorithm that will scrape large amounts of data from Facebook
and parse it using various web-scraping techniques.
The majority of this data is unstructured data in a markup
language (HTML, XML), which is subsequently translated into
structured data and stored in a database for usage in various applications
</p>
</div>
<div class="project-item">
<img src="./assets/img/booki.PNG" width="350px" height="350px">
<h3>BOOKIE</h3>
<p>online bookstore that allow users to search for and buy books,
as well as display upcoming bookstore event's.. It is a combination of both e-commerce and book
sales industry put together in a single software. Using the online bookstore system has a lot many
benefits
</p>
</div>
<div class="project-item">
<img src="./assets/img/connect4.PNG" width="350px" height="350px">
<h3>Connect Four – AI Game</h3>
<p>The connect 4 playing program uses a minmax algorithm. Every time the computer decides what move to
make next, it considers all of its possible moves: The computer then pretends that each of the moves
it has considered has actually taken place.</p>
</div>
</div>
</div>
<!--end projects-->
<!-- start feeling -->
<div class="feeling">
<div class="container">
<h2>Feeling convinced?</h2>
<p>Let us make an appointment now!</p>
<a href="#Contact" class="btn">contact</a>
</div>
</div>
<!-- end feeling -->
<!-- start contact -->
<div class="contact" id="Contact">
<h2>Contact Details</h2>
<div class="contact-img">
<img src="./assets/img/contact.jpg" width="380px" height="410px" alt="wafa img">
</div>
<div class="contact-details-item">
<div class="start">
<i class="fa fa-map-marker"></i>
<span>Palestine,Jenin</span>
</div>
</div>
<hr>
<div class="contact-details-item">
<div class="start">
<i class="fa fa-phone"></i>
<span><a href="tel:+46 123 456 789">0592884376</a></span>
</div>
</div>
<hr>
<div class="contact-details-item">
<div class="start">
<i class="fa fa-envelope"></i>
<span><a href="mailto:http://[email protected]"
class="accent-hover">[email protected]</a></span>
</div>
</div>
<hr>
<div class="contact-details-item">
<div class="start">
<i class="fa fa-globe"></i>
<span><a href="https://github.com/wafa200099"
class="accent-hover">https://github.com/wafa200099</a></span>
</div>
</div>
<hr>
<div class="contact-details-item">
<div class="start">
<i class="fa fa-globe"></i>
<span><a href="https://www.linkedin.com/in/wafaa-alomour-24847a222/"
class="accent-hover">https://www.linkedin.com/in/wafaa-alomour-24847a222/</a></span>
</div>
</div>
</div>
<!--end contact-->
<!--start footer-->
<div class="footer">
<div class="footer-bottom">
<div class="container">
<p>
Copyright 2022. All rights reserved.
</p>
<ul class="list">
<li class="item first-item">
<a href="#" class="link"><i class="fa fa-facebook icon-primary"></i></a>
</li>
<li class="item second-item">
<a href="#" class="link"><i class="fa fa-linkedin icon-primary"></i></a>
</li>
<li class="item third-item">
<a href="#" class="link"><i class="fa fa-twitter icon-primary"></i></a>
</li>
<li class="item last-item">
<a href="#" class="link"><i class="fa fa-google icon-primary"></i></a>
</li>
</ul>
</div>
</div>
</div>
<!--end footer-->
</body>
</html>