-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
84 lines (71 loc) · 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Vlad Neculai</title>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.2/css/all.css" integrity="sha384-/rXc/GQVaYpyDdyxK+ecHPVYJSN9bmVFBvjA/9eOB+pb3F2w2N6fc5qB9Ew5yIns" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet">
<link rel="stylesheet" href="style.css">
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
</head>
<body>
<div class="wrapper">
<header>
<nav>
<div class="menu-icon">
<i class="fa fa-bars fa-2x"></i>
</div>
<div class="logo">
<i class="fas fa-code"></i>
</div>
<div class="menu">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="info.html">About</a></li>
<li><a href="projects.html">Projects</a></li>
</ul>
</div>
</nav>
</header>
<div class="jumbotron">
<h1>Vlad Neculai</h1>
<p>Junior Web Developer</p>
<ul>
<li><a href="https://github.com/vladnec" target="_blank"><i class="fab fa-github-square"></i></a></li>
<li><a href="https://www.linkedin.com/in/vladut-neculai//"><i class="fab fa-linkedin"></i></a></li>
<li><a href="https://vladnec.github.io/OC-2ndProject/">Resume</a></li>
</ul>
</div>
</div>
<div class="content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam dictum nibh sit amet molestie tristique. Nam vulputate semper tortor, at gravida diam imperdiet tristique. Aliquam malesuada facilisis elit, vitae consectetur dolor venenatis eget. Aliquam a lectus quam. Etiam vel placerat turpis. Nulla facilisi. Nam diam nisl, feugiat et nisi non, semper auctor libero.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam dictum nibh sit amet molestie tristique. Nam vulputate semper tortor, at gravida diam imperdiet tristique. Aliquam malesuada facilisis elit, vitae consectetur dolor venenatis eget. Aliquam a lectus quam. Etiam vel placerat turpis. Nulla facilisi. Nam diam nisl, feugiat et nisi non, semper auctor libero.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam dictum nibh sit amet molestie tristique. Nam vulputate semper tortor, at gravida diam imperdiet tristique. Aliquam malesuada facilisis elit, vitae consectetur dolor venenatis eget. Aliquam a lectus quam. Etiam vel placerat turpis. Nulla facilisi. Nam diam nisl, feugiat et nisi non, semper auctor libero.
</p>
</div>
</div>
<script type="text/javascript">
//Menu toggle-button
$(document).ready(function(){
$(".menu-icon").on("click", function(){
$("nav ul").toggleClass("showing");
});
});
// Scrolling effect
$(window).on("scroll", function(){
if($(window).scrollTop()) {
$('nav').addClass('black');
} else {
$('nav').removeClass('black');
}
});
</script>
</body>
</html>