-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
165 lines (147 loc) · 9.34 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 lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="shortcut icon" href="img/icobordon.ico" type="image/x-icon">
<title>Mariano Bordon/Portfolio</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<link rel="stylesheet" href="styles.css">
</head>
<body id="home" data-spy="scroll" data-target=".navbar" data-offset="100" class="bg-light">
<h1>Under Construction //June19</h1>
<!--
<!-- intro -->
<nav class="navbar navbar-expand-lg navbar-dark bg-info fixed-top topborder">
<div class="container">
<h1 class="text-hide logobrand">Logo</h1>
<a class="navbar-brand" href="#">Mariano_Bordon</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#about">About Me</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#learning">Path & Goals</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#work">Work</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact Me</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="jumbotron jumbotron-fluid bg-light mt-5 text-white">
<div class="container">
<h1 class="display-4">Check me out! I'm available if you need someone for your company.</h1>
<p class="lead">Hi! My name is Mariano Bordon and live in Uruguay. I'm starting my career in Front-End Web Development and my goal it's to get my first job and gain experience. This is my Website and you can see more about me scrolling the site.</p>
</div>
</div>
<!-- /intro -->
<div class="container-fluid">
<!-- about -->
<div class="container" id="about">
<h2 class="text-center my-5 bg-light">About me</h2>
<div class="row">
<div class="col">
<h3>Who I am?</h3>
<p>I remember bright clear, it was Febraury at the beginning of this century, my first computer with 433 Mhz. With that computer I started to surf the Internet, at some point I started to experiment with HTML on the Notepad. Today I keep experimenting and working with Web Development, but this time to bring solutions to other people and business. I'm also a father of two and husband of one! Willing to work.</p>
</div>
<div class="col-lg-2"></div>
<div class="col">
<h3>Where I been</h3>
<p>I started Programing back in 2004 at ORT University for a year. After that I spent some years in Airport Industries. In 2018 I started to learn Front-End Web Development and focusing on learning HTML, CSS and JavaScript. I'm currently taking courses at Treehouse (Front-End Web Development & JavaScript) and planning other related courses in the near future. I'm currently working on some projects (personal and business) that will become part of my Portfolio.</p>
</div>
</div>
</div>
<hr class="my-4 mx-5">
<div class="container" id="learning">
<h2 class="text-center my-5">Paths & Goals</h2>
<div class="row">
<div class="col">
<h3>My Learning Path to Front-End</h3>
<p>I started Web Programing early this year (2018). I started with basic HTML and CSS markup language to refresh and later moved on to JavaScript. Currently I'm enrolled on Treehouse, a well-known and powerful platform to learn and develop new skills especially in Web Development. I'm currently on Front-End Development Track (HTML, CSS & JavaScript) and specially improving my skills in JavaScript with jQuery and React.</p>
</div>
<div class="col-lg-2"></div>
<div class="col">
<h3>My Aptitudes & Knowledges</h3>
<p><span class="badge badge-pill badge-primary">HTML</span>
<span class="badge badge-pill badge-secondary">CSS</span>
<span class="badge badge-pill badge-success">JavaScript</span>
<span class="badge badge-pill badge-danger">Bootstrap</span>
<span class="badge badge-pill badge-warning">Wordpress</span>
<span class="badge badge-pill badge-info">jQuery</span>
<span class="badge badge-pill badge-light">React</span>
<span class="badge badge-pill badge-dark">AJAX</span></p>
<p>You could see my <a href="https://teamtreehouse.com/marianobordon" target="_blank">Treehouse Profile</a>. Where I'am learning at this moment.</p>
</div>
</div>
</div>
<!-- /about -->
<hr class="my-4 mx-5">
<!-- work -->
<div class="container" id="work">
<div class="row justify-content-center">
<div class="col-sm-10 col-lg-6">
<h2 class="text-center my-5">Work</h2>
<p>A list of things I have developed to test my knowledge, some of them under work...[UNDER WORK SINCE I CHANGED MY HOSTED WEBSITE TO GITHUB PAGES ON SEPTEMBER 24, 2018.]</p>
<ul>
<li>HTML & CSS: Responsive Layout</li>
<ul>
<li><a href="http://bordon.uy/pinus" target="_blank">Pinus Pinaster</a> using only <span class="badge badge-pill badge-primary">HTML</span> <span class="badge badge-pill badge-secondary">CSS</span> (mobile first/flexbox).</li>
<li><a href="http://bordon.uy/punta" target="_blank">Punta during winter!</a> Parallax Effect <span class="badge badge-pill badge-primary">HTML</span> <span class="badge badge-pill badge-secondary">CSS</span>.</li>
</ul>
<li>JavaScript</li>
<ul>
<li><a href="http://bordon.uy/login" target="_blank">Login Form</a> using <span class="badge badge-pill badge-danger">Bootstrap</span> and <span class="badge badge-pill badge-success">JavaScript</span>.</li>
</ul>
</ul>
</div>
</div>
</div>
<!-- /work -->
<hr class="my-4 mx-5">
</div>
<!-- contact-footer -->
<footer id="contact">
<h2 class="text-center my-5">Contact Me</h2>
<div class="container-fluid mail-border bg-info">
<div class="container">
<a href="mailto:mariano@bordon.uy?subject=I%20Want%20You!">
<div class="mail-end">
<p>mariano@bordon.uy</p>
</div>
</a>
</div>
</div>
<div class="container-fluid justify-content-center wider-social bg-light">
<nav class="nav">
<a class="nav-link" href="https://www.linkedin.com/in/mariano-bordon-93734334/" target="_blank"><ion-icon name="logo-linkedin">LinkedIn</ion-icon></a>
<a class="nav-link" href="https://teamtreehouse.com/marianobordon" target="_blank"><ion-icon name="code-working">Treehouse</ion-icon></a>
<a class="nav-link" href="https://twitter.com/mbuy_ok" target="_blank"><ion-icon name="logo-twitter">Twitter</ion-icon></a>
<a class="nav-link" href="mailto:mariano@bordon.uy?subject=I%20Want%20You!"><ion-icon name="mail">Mail</ion-icon></a>
</nav>
</div>
<div class="container-fluid justify-content-center bottomborder wider-footer bg-info">
<nav class="text-center">
<p>This site was created with Bootstrap, some custom CSS style and API from external sites like Google Developer Tools.</p>
<p>Check back soon, maybe I'll add something new.</p>
<p>Designed by Mariano Bordon - 2018 ©</p>
</nav>
</div>
</footer>
<!-- /contact-footer -->
-->
<script src="https://unpkg.com/ionicons@4.3.0/dist/ionicons.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</body>
</html>