-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
165 lines (154 loc) · 8.41 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
<!DOCTYPE html>
<html>
<head>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Optional theme -->
<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> -->
<!-- Font-awesome -->
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/>
<!-- Animate.css -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.7.0/animate.min.css">
<!-- My CSS -->
<link rel="stylesheet" href="main.css">
<!-- Page title -->
<title>Carges Portfolio</title>
</head>
<body>
<header>
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"><em>Carges</em></a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active"><a href="#about-anchor">About<span class="sr-only">(current)</span></a></li>
<li><a href="#portfolio-anchor">Portfolio</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#contact-anchor">Contact</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
</header>
<a href="" id="contact-anchor"></a>
<div class="row center-block mydiv-title">
<div class="container">
<div class="btn-group" role="group" aria-label="...">
<a href="https://www.freecodecamp.com/carges" target="_blank"><button type="button" class="btn btn-lg btn-warning btn-contacts"><i class="fa fa-free-code-camp"></i> Freecodecamp</button></a>
<a href="https://github.com/carges" target="_blank"><button type="button" class="btn btn-lg btn-warning btn-contacts"><i class="fa fa-github"></i> Github</button></a>
<!-- <a href="#" target="_blank"><button type="button" class="btn btn-lg btn-warning btn-contacts"><i class="fa fa-linkedin"></i> Linkedin</button></a> -->
</div>
<div class="row mydiv-about">
<a href="" id="about-anchor"></a>
<div class="container" id="about"><p class="p-about">I studied Astronomy in Italy, and then moved to Northern-Norway where I enrolled in a 2-year master in Space Physics.<br>After completing my studies, I worked 3 years at the Arctic University of Norway as a researcher, where I developed a software to forecast geomagnetic activity. <br>I love working as a front-end developer with focus on responsive design and a mobile-first approach.</p></div>
</div>
</div>
</div>
<div class="container" id="portfolio-anchor">
<h2 class="text-center h2-portfolio">Recent work</h2>
<div class="row">
<div class="col-lg-6 col-md-6 col-xs-12">
<div class="thumbnail mywork">
<p>Look at the current weather at your locality.</p>
<a href="https://carges.github.io/local-weather-app/" target="_blank">
<img src="local-weather.png" alt="">
</a>
<div class="caption text-center">
<h4 class="h4-caption">Local Weather App <a href="https://github.com/carges/local-weather-app" target="_blank">(code <i class="fa fa-github-square" aria-hidden="true"></i>)</a></h4>
</div>
</div>
</div>
<div class="col-lg-6 col-md-6 col-xs-12">
<div class="thumbnail mywork">
<p>A simple electronic calculator.</p>
<a href="https://carges.github.io/calculator/" target="_blank">
<img src="calculator.png" alt="">
</a>
<div class="caption text-center">
<h4 class="h4-caption">Calculator <a href="https://github.com/carges/calculator" target="_blank">(code <i class="fa fa-github-square" aria-hidden="true"></i>)</a></h4>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-6 col-md-6 col-xs-12">
<div class="thumbnail mywork">
<p>Set both the session and the break intervals to properly manage your work.</p>
<a href="https://carges.github.io/pomodoro-clock/" target="_blank">
<img src="pomodoro.png" alt="">
</a>
<div class="caption text-center">
<h4 class="h4-caption">Pomodoro Clock <a href="https://github.com/carges/pomodoro-clock" target="_blank">(code <i class="fa fa-github-square" aria-hidden="true"></i>)</a></h4>
</div>
</div>
</div>
<div class="col-lg-6 col-md-6 col-xs-12">
<div class="thumbnail mywork">
<p>Play at tic tac toe! Against either the computer or another player.</p>
<a href="https://carges.github.io/tic-tac-toe/" target="_blank">
<img src="tic-tac-toe.png" alt="">
</a>
<div class="caption text-center">
<h4 class="h4-caption">Tic Tac Toe Game <a href="https://github.com/carges/tic-tac-toe" target="_blank">(code <i class="fa fa-github-square" aria-hidden="true"></i>)</a></h4>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-6 col-md-6 col-xs-12">
<div class="thumbnail mywork">
<p>Play at Simon game!</p>
<a href="https://carges.github.io/simon-game/" target="_blank">
<img src="simon.png" alt="">
</a>
<div class="caption text-center">
<h4 class="h4-caption">Simon Game <a href="https://github.com/carges/simon-game" target="_blank">(code <i class="fa fa-github-square" aria-hidden="true"></i>)</a></h4>
</div>
</div>
</div>
<div class="col-lg-6 col-md-6 col-xs-12">
<div class="thumbnail mywork">
<p>Generate a random quote and tweet it!</p>
<a href="https://carges.github.io/random-quote/" target="_blank">
<img src="random-quote.png" alt="">
</a>
<div class="caption text-center">
<h4 class="h4-caption">Random Quote Generator <a href="https://github.com/carges/random-quote" target="_blank">(code <i class="fa fa-github-square" aria-hidden="true"></i>)</a></h4>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-6 col-md-6 col-xs-12">
<div class="thumbnail mywork">
<p>Have a look at the current twitch streamers.</p>
<a href="https://carges.github.io/twitch-tv/" target="_blank">
<img src="twitch.png" alt="">
</a>
<div class="caption text-center">
<h4 class="h4-caption">Twitch Tv <a href="https://github.com/carges/twitch-tv" target="_blank">(code <i class="fa fa-github-square" aria-hidden="true"></i>)</a></h4>
</div>
</div>
</div>
</div>
</div>
<footer class="text-center myfooter">
© Copyright 2016
</footer>
</body>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</html>