-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
193 lines (168 loc) · 8.26 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
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous">
<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1">
<title>Idan.H Portfolio</title>
<link rel="stylesheet" href="css/styles.css">
<link rel="icon" href="favicon.ico">
<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=Merriweather+Sans:wght@300&family=Montserrat:wght@100&family=Sacramento&display=swap" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js" integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s" crossorigin="anonymous"></script>
</head>
<body>
<div class="top-container">
<img class="top-cloud" src="images/cloud.png" alt="cloud-img">
<h1>I'm Idan.</h1>
<h2 class="title">a programmer.</h2>
<img class="bottom-cloud" src="images/cloud.png" alt="cloud-img">
</div>
<div class ="middle-container">
<div class="profile">
<div class="menu-options">
</div>
<img class="profile-pic" src="images/idan.png" alt="">
<h2>Hello!</h2>
<p class="intro">I'm an python and web developer, I'v done some realy nice projects. I realy like ☕ and 🍔</p>
</div>
<hr>
<div class="skills">
<h2>My Skills</h2>
<div class="skill-row">
<img class="left-oriented-logo" src="images/python.png" alt="">
<h3>Python</h3>
<p>I gained my Python proficiency through Dr. Angela Yu's Udemy course,
motivated by a desire to actualize my creative concepts. Over time,
I've amassed valuable experience crafting intricate functions and
applying smart object-oriented programming principles in the
development of both mobile and web applications.</p>
<div class="sub-skill-container">
<div class="sub-skill rounded-3">
<p class="sub-skill-text">OOP</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">API</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">RESTful</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">GIT</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">SQLite</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">GUI</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">Pandas</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">CSV</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">Matplotlib</p>
</div>
</div>
</div>
<div class="skill-row">
<img class="left-oriented-logo" class="skill-image" src="images/html.png" alt="">
<h3>Web Development</h3>
<p class="html-p">
Versatile web developer with a knack for crafting visually appealing and
responsive websites. Familiar with backend frameworks, automation tools, and
web application development, seamlessly blending design and functionality
for user-friendly web experiences.</p>
<div class="sub-skill-container">
<div class="sub-skill rounded-3">
<p class="sub-skill-text">Flask</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">Selenium</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">Django</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">HTML</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">CSS</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">Bootstrap</p>
</div>
<div class="sub-skill rounded-3">
<p class="sub-skill-text">Web application</p>
</div>
</div>
</div>
</div>
<div class ="projects-container">
<hr>
<h2>My Projects</h2>
<div class="project-row">
<img class="left-oriented-logo" src="images/stocks-logo.png" alt="">
<a href="https://github.com/idan6767/AutoStocks" target="_blank"><h3>Auto-Stocks</h3></a>
<p>Elevate your stock market insights with Auto-Stocks, apersonalized
tracking website. Stay updated on dynamic market changes, access
comprehensive information and news updates, and identify trends for
a deeper understanding of each stock's journey. Explore a seamless,
efficient, and user-friendly financial experience that allows you
to stay focused on what matters to you in.</p>
<img class="screen-shot" src="images/auto-stocks-screen-shot.png" alt="auto-stocks-website">
<p class="hash-tags">#Python #Django #CSS #HTML #Pandas #Flask #Bootstrap #Matplotlib</p>
</div>
<div class="project-row">
<img class="left-oriented-logo" src="images/imagemakr-logo.png" alt="">
<a href="https://github.com/idan6767/Image-WaterMarker" target="_blank"><h3>Image-WaterMarker</h3></a>
<p>Effortlessly add personalized watermarks to your digital creations and
images with an intuitive and simple program, ensuring their protection
with just a few clicks.</p>
<img class="small-screen-shot" src="images/image-watermarker.png" alt="Image-WaterMarker-website">
<p class="hash-tags">#Python #GUI #Tkinter #Pillow</p>
</div>
</div>
<section id="testimonials">
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img class="certificate" src="images/mimo-certificate.png" alt="mimo">
</div>
<div class="carousel-item">
<img class="certificate" src="images/udemy-certificate.png" alt="First slide">
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</section>
<div class="contact-me">
<h2 class="contact-text">Get In Touch</h2>
<h3 class="contact-text">Feel free to say hi!</h3>
<p class="contact-message">like 🍔 like me? Lets talk about that and code while you still hungry!!</p>
<br>
<a class="btn" href="mailto:idan6767@gmail.com">CONTACT ME</a>
</div>
<div class="bottom-container">
<a class="footer-link" href="https://www.linkedin.com/in/idan-hadida-1a8086193/" target="_blank">LinkedIn</a>     
<a class="footer-link" href="https://github.com/idan6767" target="_blank">github</a>     
<a class="footer-link" href="https://idan6767.github.io/cv/" target="_blank">Website</a>     
<p class="rights">© 2022 Idan Hadida</p>
</div>
</body>
</html>