-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
125 lines (122 loc) · 7.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="description" content="Full Stack Developer">
<meta name="author" content="Yonatan Snir">
<title>Yonatan Snir</title>
<!-- <link rel="apple-touch-icon" sizes="180x180" href="assets/apple-touch-icon.png"> -->
<!-- <link rel="icon" type="image/png" sizes="32x32" href="assets/favicon-32x32.png"> -->
<!-- <link rel="icon" type="image/png" sizes="16x16" href="assets/favicon-16x16.png"> -->
<link rel="icon" type="image/png" sizes="48x48" href="YS LOGO.png" />
<link rel="manifest" href="assets/site.webmanifest">
<link href="https://fonts.googleapis.com/css?family=Lato|Roboto+Slab&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/07bb6216fc.js"></script>
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header>
<svg id="logo" viewBox="0 0 341 343" xmlns="http://www.w3.org/2000/svg">
<rect width="341" height="342.1" fill="none"/>
<rect x="15" y="13" width="310" height="311" rx="36" />
<path d="M123.367 289V241.904L83.376 156.644H115.45L127.224 187.094C129.119 192.101 130.946 196.973 132.705 201.71C134.464 206.311 136.224 211.183 137.983 216.326H138.795C140.69 211.183 142.517 206.311 144.276 201.71C146.171 196.973 148.065 192.101 149.96 187.094L161.937 156.644H193.199L153.208 241.904V289H123.367Z" fill="white"/>
<path d="M243.916 291.436C235.254 291.436 226.593 289.812 217.932 286.564C209.27 283.316 201.624 278.579 194.993 272.354L212.045 251.851C216.781 255.911 222.059 259.227 227.879 261.798C233.698 264.369 239.314 265.655 244.728 265.655C257.043 265.655 263.201 261.392 263.201 252.866C263.201 248.671 261.441 245.626 257.923 243.731C254.539 241.701 249.938 239.468 244.119 237.032L226.864 229.724C220.097 227.017 213.939 222.754 208.391 216.935C202.977 210.98 200.271 203.199 200.271 193.59C200.271 182.628 204.669 173.358 213.466 165.779C222.262 158.065 233.563 154.208 247.367 154.208C254.945 154.208 262.524 155.697 270.103 158.674C277.681 161.651 284.313 165.982 289.997 171.666L274.772 190.545C270.441 187.162 266.11 184.59 261.78 182.831C257.449 180.936 252.645 179.989 247.367 179.989C242.224 179.989 238.096 181.072 234.984 183.237C232.006 185.267 230.518 188.177 230.518 191.966C230.518 196.026 232.412 199.071 236.202 201.101C240.126 203.131 244.931 205.296 250.615 207.597L267.667 214.499C275.651 217.747 282.012 222.213 286.749 227.897C291.485 233.581 293.854 241.092 293.854 250.43C293.854 261.392 289.455 271.001 280.659 279.256C271.997 287.376 259.75 291.436 243.916 291.436Z" fill="white"/>
</svg>
<h3><a id="about-text" href="#contact">Get in touch</a></h3>
</header>
<section>
<div class="bg-box box1"></div>
<div class="bg-box box2"></div>
<div class="bg-box box3"></div>
<div class="bg-box box4"></div>
<div class="content-left">
<div class="hide firstshow">
<h2>Hello, <strong>I'm Yonatan.</strong></h2>
</div>
<div class="hide secoundshow">
<h2>a <span>Full-stack</span> developer.</h2>
</div>
<p>I design and build beautiful websites and app for businesses around the globe. If you need a modern and powerful app, talk to me. If we are a good fit, I will give you a time and cost estimate.</p>
<div class="quote">
<a href="http://blog.yonisnir.com/">
<button id="project-btn">GO TO MY BLOG</button>
</a>
</div>
</div>
<div class="content-right">
<div class="mypic">
</div>
</div>
<div class="keep-scrolling"><span>Keep Scrolling</span><span>🡫</span></div>
</section>
<hr>
<section style="min-height: initial;">
<img class="background-tr" src="assets/bg-tr1.svg" />
<div class="content-left">
<h4>Latest work</h4>
<h2>Club Log</h2>
<h3>Mobile PWA</h3>
<h3>UX/UI</h3>
<p>
Design and development of the Club-Log application for residential complexes. The app helps residents and building managers to handle queues to the gym and the pool.
The building manager can control the number of people at a certain hour, which helps to keep the places clean and safe during the Corona-virus.
The residents can see all their future queues 30-days forward, and get SMS one day before a certain queue.
</p>
</div>
<div class="content-right">
<div class="project-img mockup"></div>
</div>
</section>
<div class="dots">
<span></span>
<span></span>
<span></span>
</div>
<section style="min-height: initial;">
<img class="background-tr1" src="assets/bg-tr1.svg" />
<div class="content-left">
<h4>Latest work</h4>
<h2>DAS Saftey Solutions</h2>
<h3>CRM</h3>
<h3>UX/UI</h3>
<h3>Concept</h3>
<p>Safety Management Software with a multi-featured web based application. With user-friendly interface that has been designed and developed to manage all your requirements. Its different modules provide benefits to any organization as it can manage real-time records and compliances on fingertips.</p>
</div>
<div class="content-right">
<div class="project-img mockup2">
</div>
</div>
</section>
<div class="dots">
<span></span>
<span></span>
<span></span>
</div>
<section class="contact" id="contact">
<div class="content-left">
<h2>Want to Work with me?</h2>
</div>
<div class="content-right">
One of the most important things to me is the user experience, so I will work hard to makes you happy 😉. As a developer who is also a designer, I design and develop beautiful and useful websites and applications from scratch. Let's work together 👇
<footer>
<a href="https://www.facebook.com/yonatan941" target="_blank"><i class="fab fa-facebook-square"></i></a>
<a href="https://www.instagram.com/yonatan_snir/" target="_blank"><i class="fab fa-instagram"></i></a>
<a href="https://github.com/yonatansnir" target="_blank"><i class="fab fa-github-square"></i></a>
<a href="https://wa.me/972545357249" target="_blank"><i class="fab fa-whatsapp-square"></i></a>
<a href="https://www.linkedin.com/in/yonatan-snir-bb6405191/" target="_blank"><i class="fab fa-linkedin"></i></a>
<!-- <a href="https://codepen.io/yonatan-snir" target="_blank"><i class="fab fa-codepen"></i></a> -->
<!-- <a href="https://codesandbox.io/u/yonatansnir" target="_blank">
<svg fill="rgb(87, 87, 87)" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M2 6l10.455-6L22.91 6 23 17.95 12.455 24 2 18V6zm2.088 2.481v4.757l3.345 1.86v3.516l3.972 2.296v-8.272L4.088 8.481zm16.739 0l-7.317 4.157v8.272l3.972-2.296V15.1l3.345-1.861V8.48zM5.134 6.601l7.303 4.144 7.32-4.18-3.871-2.197-3.41 1.945-3.43-1.968L5.133 6.6z"/>
</svg>
</a> -->
</footer>
</div>
</section>
<script lang="javascript" src="js/animation.js"></script>
<script lang="javascript" src="js/main.js"></script>
</body>
</html>