-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
154 lines (145 loc) · 6.22 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
<!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>Portfolio Page</title>
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/css/styles.css">
<link rel="stylesheet" href="https://cdn.rawgit.com/konpa/devicon/df6431e323547add1b4cf45992913f15286456d3/devicon.min.css">
</head>
<body>
<!-- Header and navbar section-->
<div class="Navbar">
<div class="Navbar__Link Navbar__Link-brand">
<a href="#1">Home</a>
</div>
<div class="Navbar__Link Navbar__Link-toggle">
<i class="fas fa-bars"></i>
</div>
<nav class="Navbar__Items Navbar__Items--right">
<div class="Navbar__Link">
<a href="#2">Information</a>
</div>
<div class="Navbar__Link">
<a href="#3">Projects</a>
</div>
<div class="Navbar__Link">
<a href="#4">Skills</a>
</div>
<div class="Navbar__Link">
<a href="#5">Contact</a>
</div>
</nav>
</div>
<!-- First div Home section -->
<section class="home" id="1">
<div class="background-image" style="background-image: url(assets/img/header.jpg);"></div>
<div class="home-content-area">
<h1>Luka Kidrič web development</h1>
<h3>Developing modern and responsive looking websites</h3>
<a href="#5" class="btn">How to get in contact</a>
</div>
</section>
<!-- About me section-->
<section class="about" id="2">
<h3 class="title">About me</h3>
<div>
<div class="imgR">
<img src="assets/img/me.jpg" alt="">
</div>
<div class="textR">
<p>
I am currently a student of the faculty of information studys where I'm enrolled in a
web development program. I try to learn as much new technologies as I can in my free time
as to stay relevant in the field. I aspire to write fast and responsive web apps that
can be enjoyed on any device. On this page are some of the projects I did, so if you like
what you see don't hesitate to contact me.
</div>
</div>
</section>
<!-- Project section-->
<section class="projects" id="3">
<h3 class="title">My Projects</h3>
<p>Here are samples of projects I did professionally or for fun</p>
<hr>
<ul class="grid">
<a class="small box" target="blank" href="https://luks24.github.io/gradientCreator/">
<div class="divname">gradientCreator project</div>
<div class="divdescribe">This is a web app I build with plain javascript to generate gradient background for front-end developers.</div>
</a>
<a class="small box" target="blank" href="https://github.com/Luks24/YoutubeReactApp">
<div class="divname">Youtube API react clone</div>
<div class="divdescribe">A react clone of youtube that allowes searching for youtube videos and displayes the frist five.</div>
</a>
<a class="small box" target="blank" href="https://mighty-temple-66250.herokuapp.com/">
<div class="divname">Blog app</div>
<div class="divdescribe">A blog website I made with users and comments.</div>
</a>
</ul>
</section>
<!--My skill set section-->
<section class="skills" id="4">
<h3 class="title">My skills</h3>
<p>This are the technologies that I worked with or have experience in.</p>
<hr>
<ul class="grid">
<li class="icons">
<i class="devicon-html5-plain-wordmark"></i>
</li>
<li class="icons">
<i class="devicon-css3-plain-wordmark"></i>
</li>
<li class="icons">
<i class="devicon-javascript-plain"></i>
</li>
<li class="icons">
<i class="devicon-express-original-wordmark"></i>
</li>
<li class="icons">
<i class="devicon-babel-plain"></i>
</li>
<li class="icons">
<i class="devicon-bootstrap-plain-wordmark"></i>
</li>
<li class="icons">
<i class="devicon-git-plain-wordmark"></i>
</li>
<li class="icons">
<i class="devicon-heroku-line-wordmark"></i>
</li>
<li class="icons">
<i class="devicon-mongodb-plain-wordmark"></i>
</li>
<li class="icons">
<i class="devicon-mysql-plain-wordmark"></i>
</li>
<li class="icons">
<i class="devicon-nodejs-plain-wordmark"></i>
</li>
<li class="icons">
<i class="devicon-react-original-wordmark"></i>
</li>
</ul>
</section>
<section class="contact" id="5">
<h3 class="title">Contact me</h3>
<p>If you want to get in touch with me, you can do so trough social media or simply write me an email.</p>
<hr>
<ul class="grid">
<a class="small" target="blank" href="https://www.linkedin.com/in/luka-kidri%C4%8D-b986b1139/"><i class="fab fa-linkedin"></i></a>
<a class="small" target="blank" href="https://github.com/Luks24"><i class="fab fa-github"></i></a>
<a href="mailto:[email protected]?Subject=Hello%20I%20saw%20your%20portfolio" target="_top"><i class="far fa-envelope-open"></i></a>
</ul>
</section>
<footer>
<p>by Luka Kidrič</p>
</footer>
<script src="https://unpkg.com/scrollreveal/dist/scrollreveal.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>