-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
61 lines (59 loc) · 5.52 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
<!DOCTYPE html>
<html lang="es">
<head>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-Z8H3KR47GM');
</script>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>odraciRdev 🧑🏻💻 | Frontend Developer</title>
<meta name="description" content="Frontend Developer: HTML5, CSS3, JavaScript Vanilla y más...">
<meta property="og:title" content="odracir 🧑🏻💻">
<meta property="og:image" content="./assets/social-odracir.webp">
<meta property="og:description" content="Frontend Developer: HTML5, CSS3, JavaScript Vanilla y más...">
<meta property="og:url" content="https://odracirdev.github.io/">
<meta property="twitter:url" content="https://odracirdev.github.io/">
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:creator" content="@RicardCuauro">
<meta property="twitter:title" content="odraciRdev - Frontend Developer">
<meta property="twitter:description" content="Frontend Developer: HTML5, CSS3, JavaScript Vanilla y más...">
<meta property="twitter:image:src" content="./assets/social.webp">
<link rel="icon" href="./assets/icons/favicon.webp" />
<link rel="stylesheet" href="style.css">
</head>
<body>
<main>
<header>
<h1>ODRACIRDEV</h1>
<h2>COMUNIDAD DE AUTODIDACTAS</h2>
<p class="desc">El canal de Twitch odraciRdev nació con la finalidad de hacer una ruta de estudios para aprender lo necesario y convertirnos en desarrolladores frontend con recursos gratuitos y accesibles para todos.</p>
<ul class="rrss">
<li class="rrss__list"><a href="https://www.twitch.tv/odracirdev" target="_blank"><svg width="20" height="20" viewBox="0 0 24 24"><path fill="currentColor" d="M11.64 5.93h1.43v4.28h-1.43m3.93-4.28H17v4.28h-1.43M7 2L3.43 5.57v12.86h4.28V22l3.58-3.57h2.85L20.57 12V2m-1.43 9.29l-2.85 2.85h-2.86l-2.5 2.5v-2.5H7.71V3.43h11.43Z"/></svg>Twitch</a></li>
<li class="rrss__list"><a href="https://www.youtube.com/@ricardcuauro?sub_confirmation=1" target="_blank"><svg width="20" height="20" viewBox="0 0 24 24"><path fill="currentColor" d="m10 15l5.19-3L10 9zm11.56-7.83c.13.47.22 1.1.28 1.9c.07.8.1 1.49.1 2.09L22 12c0 2.19-.16 3.8-.44 4.83c-.25.9-.83 1.48-1.73 1.73c-.47.13-1.33.22-2.65.28c-1.3.07-2.49.1-3.59.1L12 19c-4.19 0-6.8-.16-7.83-.44c-.9-.25-1.48-.83-1.73-1.73c-.13-.47-.22-1.1-.28-1.9c-.07-.8-.1-1.49-.1-2.09L2 12c0-2.19.16-3.8.44-4.83c.25-.9.83-1.48 1.73-1.73c.47-.13 1.33-.22 2.65-.28c1.3-.07 2.49-.1 3.59-.1L12 5c4.19 0 6.8.16 7.83.44c.9.25 1.48.83 1.73 1.73"/></svg>YouTube</a></li>
<li class="rrss__list"><a href="https://discord.gg/r6tFDfvYW6" target="_blank"><svg width="20" height="20" viewBox="0 0 24 24"><path fill="currentColor" d="m22 24l-5.25-5l.63 2H4.5A2.5 2.5 0 0 1 2 18.5v-15A2.5 2.5 0 0 1 4.5 1h15A2.5 2.5 0 0 1 22 3.5V24M12 6.8c-2.68 0-4.56 1.15-4.56 1.15c1.03-.92 2.83-1.45 2.83-1.45l-.17-.17c-1.69.03-3.22 1.2-3.22 1.2c-1.72 3.59-1.61 6.69-1.61 6.69c1.4 1.81 3.48 1.68 3.48 1.68l.71-.9c-1.25-.27-2.04-1.38-2.04-1.38S9.3 14.9 12 14.9s4.58-1.28 4.58-1.28s-.79 1.11-2.04 1.38l.71.9s2.08.13 3.48-1.68c0 0 .11-3.1-1.61-6.69c0 0-1.53-1.17-3.22-1.2l-.17.17s1.8.53 2.83 1.45c0 0-1.88-1.15-4.56-1.15m-2.07 3.79c.65 0 1.18.57 1.17 1.27c0 .69-.52 1.27-1.17 1.27c-.64 0-1.16-.58-1.16-1.27c0-.7.51-1.27 1.16-1.27m4.17 0c.65 0 1.17.57 1.17 1.27c0 .69-.52 1.27-1.17 1.27c-.64 0-1.16-.58-1.16-1.27c0-.7.51-1.27 1.16-1.27Z"/></svg>Discord</a></li>
<li class="rrss__list"><a href="https://github.com/odracirdev" target="_blank"><svg width="20" height="20" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2A10 10 0 0 0 2 12c0 4.42 2.87 8.17 6.84 9.5c.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34c-.46-1.16-1.11-1.47-1.11-1.47c-.91-.62.07-.6.07-.6c1 .07 1.53 1.03 1.53 1.03c.87 1.52 2.34 1.07 2.91.83c.09-.65.35-1.09.63-1.34c-2.22-.25-4.55-1.11-4.55-4.92c0-1.11.38-2 1.03-2.71c-.1-.25-.45-1.29.1-2.64c0 0 .84-.27 2.75 1.02c.79-.22 1.65-.33 2.5-.33s1.71.11 2.5.33c1.91-1.29 2.75-1.02 2.75-1.02c.55 1.35.2 2.39.1 2.64c.65.71 1.03 1.6 1.03 2.71c0 3.82-2.34 4.66-4.57 4.91c.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2"/></svg> Github</a></li>
<li class="rrss__list"><a href="https://www.linkedin.com/in/ricardocuauro/" target="_blank"><svg width="20" height="20" viewBox="0 0 24 24"><path fill="currentColor" d="M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2zm-.5 15.5v-5.3a3.26 3.26 0 0 0-3.26-3.26c-.85 0-1.84.52-2.32 1.3v-1.11h-2.79v8.37h2.79v-4.93c0-.77.62-1.4 1.39-1.4a1.4 1.4 0 0 1 1.4 1.4v4.93zM6.88 8.56a1.68 1.68 0 0 0 1.68-1.68c0-.93-.75-1.69-1.68-1.69a1.69 1.69 0 0 0-1.69 1.69c0 .93.76 1.68 1.69 1.68m1.39 9.94v-8.37H5.5v8.37z"/></svg>LinkedIn</a></li>
</ul>
</header>
<section>
<h3>PROYECTOS</h3>
<article class="cards__container">
<div class="card__project">
<img src="https://placehold.co/340x200.png" alt="">
<h4><span class="rotatingHeader"></span></h4>
<p><span class="rotatingDesc"></span></p>
</div>
<div class="card__project">
<img src="https://placehold.co/340x200.png" alt="">
<h4><span class="rotatingHeader"></span></h4>
<p><span class="rotatingDesc"></span></p>
</div>
</article>
</section>
</main>
<script src="/shuffle_text.js"></script>
</body>
</html>