-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
148 lines (136 loc) · 6.88 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" href="img/favicon.webp">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
<link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet'>
<link rel="stylesheet" href="css/mobile.css">
<link rel="stylesheet" href="css/tablet.css">
<link rel="stylesheet" href="css/desktop.css">
<link rel="stylesheet" href="css/components/index.css">
<link rel="stylesheet" href="css/gallery.css">
<link rel="stylesheet" href="css/components/footer.css">
<meta name="description"
content="Programador. Una gran afición por nunca parar de aprender y nutrirme de conocimiento.">
<meta name="keywords"
content="patricio, tubio, patricio tubio desarrollo web, programación, portfolio, aprendizaje, Argentina, front-end, HTML, CSS, JavaScript, soypato, pato tb, soypatotb, editor, video, marketing, criptomonedas, redes, youtube, twitch">
<title>Patricio Tubio (soypato) | Programador, creador de contenido</title>
</head>
<body>
<header>
<nav class="navbar navbar-expand-lg static-top">
<div class="container">
<a class="navbar-brand" href="/">
<img loading="lazy" src="/img/logo-soypato-max.webp" title="Logo de soypato" alt="Logo de soypato">
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link active" aria-current="page" title="Página de inicio"
href="index.html">Inicio</a>
</li>
<li class="nav-item">
<a class="nav-link active" aria-current="page" title="Enlace a Redes"
href="#proyectos">Proyectos</a>
</li>
<li class="nav-item">
<a class="nav-link active" title="CV de LinkedIn"
href="https://www.linkedin.com/in/soypato/">LinkedIn</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<section id="welcome-section" class="">
<div id="basic-info">
<img loading="lazy" id="profile" src="https://avatars.githubusercontent.com/u/77248407?"
title="Foto de perfil de soypato" alt="patricio tubio">
<h1>Patricio<br>Tubio</h1>
<p id="basic-info-description-1">programador</p>
<p id="basic-info-description-2"> <span id="domYear"></span> años • argentina</p>
</div>
</section>
<div class="main-grid-articles borderArticle" id="proyectos">
<article>
<h2>Proyectos</h2>
<p class="description-p">🚀Aplicaciones y proyectos destacados.</p>
<div class="gridGallery" id="gridGalleryProjects">
<!-- Proyectos generados por el componente en JS -->
</div>
<a class="fullWidthButton" title="Repositorios de SoyPato"
href="https://github.com/soypato?tab=repositories"><span>Más proyectos</span></a>
</article>
</div>
<!-- Nota: #my-info-grid contiene todo el soporte para el grid responsive de artículos, sería el padre -->
<div id="my-info-grid" class="borderArticle">
<article id="hola-soy-pato">
<h2>Hola, soy Pato</h2>
<p>💻 Estudiante/ayudante de cátedra en programación. Actualmente, en UTN Mar del Plata aprendiendo prog. web con JS y Angular.</p>
<p>🎨 Soy creativo y resolutivo, siempre en busca de nuevas formas de abordar desafíos. Normalmente
<b>esquematizo</b> todo antes de comenzar a programar. Me especializo en <b>Programación Orientada a Objetos</b>.
</p>
<p>👇 Toda la experiencia y datos laborales, los encontrás en mi <b>LinkedIn</b>, tocando abajo.</p>
<a class="fullWidthButton" href="https://linkedin.com/in/soypato"><span>💻 Ir a CV/Experiencia</span></a>
</article>
</div>
<div class="main-grid-articles borderArticle" id="tecnologias">
<article>
<h2>Tecnologías</h2>
<p class="description-p">Estas son las tecnologías que considero tener un manejo avanzado.</p>
<div class="gridGallery" id="gridGalleryTech">
</article>
</div>
<div class="main-grid-articles borderArticle" id="conf">
<article>
<h2>Presentaciones</h2>
<p class="description-p">📹 Divulgar conocimiento con el fin de que mi comunidad pueda aprender es uno de mis
hobbies.</p>
<div class="gridGallery" id="gridGalleryConferences">
<!-- Proyectos generados por el componente en JS -->
</div>
</article>
</div>
<div class="main-grid-articles footer-description borderArticle" id="contacto">
<article>
<h2>Contacto</h2>
<p class="description-p">📰 A través de las siguientes vía de comunicación podemos enlazarnos. ¡No dudes en
escribirme ante cualquier necesidad de diálogo!</p>
</p>
<div class="gridGallery">
<div class="middleGrid">
<a href="mailto:[email protected]" title="Correo electrónico" target="_blank">
<h3>Correo electrónico</h3>
</a>
<p>Contacto directo.</p>
</div>
<div class="middleGrid">
<a title="Enlace a LinkedIn" href="https://www.linkedin.com/in/soypato/" target="_blank">
<h3>LinkedIn</h3>
</a>
<p>Experiencia profesional y networking.</p>
</div>
</div>
<a class="fullWidthButton" title="Enlace a redes" href="https://soypato.github.io/redes"><span>Ir a
/redes</span></a>
</article>
</div>
<footer>
<p><span id="currentYear"></span> • Estás en soypato </p>
</footer>
<script src="./js/gallery.js"></script>
<script src="./js/index.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3"
crossorigin="anonymous"></script>
</body>
</html>