PersonalWEB/about.html at master · bigbae18/PersonalWEB · GitHub

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
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="title" content="Mi página web personal">
    <meta name="description"
        content="Aquí explico sobre mi, mis hobbies, experiencias tanto personales como profesionales e incluso un apartado para que puedan contactarme">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
    <link href="https://fonts.googleapis.com/css?family=B612+Mono|Permanent+Marker|Major+Mono+Display&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="./css/pages/exp-prof.css">
    <title>¡El Payo Bestia!</title>
</head>

<body>
    <main id="fondo" class="grid wrapper">
        <div id="clickUp" class="button-up">
            <i class="fas fa-chevron-up arrow-up">
            </i>
        </div>
        <header class="flex cabecera">
            <nav class="grid navegacion">
                <a href="index.html" class="enlaces B612">
                    Home
                </a>
                <a href="hobbies.html" class="enlaces B612">
                    ¿Quién es Adrián Pelayo?
                </a>
                <a href="about.html" class="this B612">
                    ¿Quién es el Payo Bestia?
                </a>
                <a href="contact.html" class="enlaces B612">
                    Contáctame
                </a>
            </nav>
            <div class="grid cambiar-tema">
                <p class="B612">Selecciona tu tema.</p>
                <div class="flex theme-emoji">
                    <div class="grid local-theme">
                        <button id="btn-dark">🌑</button>
                        <button id="btn-light">☀️</button>
                    </div>
                    <div class="grid session-theme">
                        <button id="btn-red">❤️️</button>
                        <button id="btn-blue">💙</button>
                        <button id="btn-purple">💜</button>
                        <button id="btn-green">💚</button>
                    </div>
                </div>
        </header>
        <div class="flex contenedor-principal">
            <div class="grid portada">
                <h2 class="B612">
                    'A ver, cuéntanos qué es
                </h2>
                <h1 class="Major">
                    el pAyo bestiA'
                </h1>
                <p class="B612">
                    Desarrollo FrontEnd & BackEnd<span class="barraDeEscribir">|</span>
                </p>
            </div>
        </div>
        <div class="flex contenedor-about">
            <div class="grid contenedor-txt">
                <h3 class="permanentMarker">
                    Estudios de la Bestia
                </h3>
                <div class="flex contenedor-wrapper">
                    <div class="grid info-about">
                        <i class="fas fa-user-graduate"></i>
                        <h4 class="permanentMarker">Educación Secundaria Obligatoria</h4>
                        <p class="B612">INS Pablo Ruíz Picasso</p>
                    </div>
                    <div class="grid info-about">
                        <i class="fas fa-terminal"></i>
                        <h4 class="permanentMarker">FullStack Developer Bootcamp</h4>
                        <p class="B612">GeeksHubs Academy</p>
                    </div>
                </div>
                <p class="B612">
                    Actualmente tengo conocimientos acerca de las bases de HTML5, CSS3, ES6.
                </p>
            </div>
        </div>
        <div class="flex contenedor-about wrapper-bg-prof">
            <div class="grid contenedor-txt">
                <h3 class="permanentMarker">
                    Experiencia Profesional de la Bestia
                </h3>
                <div class="flex contenedor-wrapper">
                    <div class="grid info-about">
                            <i class="fas fa-cash-register"></i>
                        <h4 class="permanentMarker">Caja / Reposición</h4>
                        <p class="B612">Supercor - Passeig Maragall</p>
                    </div>
                    <div class="grid info-about">
                            <i class="fas fa-project-diagram"></i>
                        <h4 class="permanentMarker">Proyectos Bootcamp</h4>
                        <p class="B612">Puedes consultar mi repositorio.</p>
                        <p id="parent" class="B612">(Click al botón de GitHub abajo)</p>
                    </div>
                </div>
            </div>
        </div>
        <div class="flex contenedor-bajo">
            <div class="grid caja-texto">
                <h3 class="permanentMarker">¡Hey! ¿Crees que has terminado?</h3>
                <p class="B612">No te olvides darme feedback por redes sociales... O directamente enviarme un mensaje
                    para preguntarme sobre lo que sea.</p>
                <p class="B612">¡estaré encantado de escucharos!</p>
                <p class="Major parentesis">(también me puedes contactar rellenando el formulario de este botón)</p>
                <span><a href="./contact.html" class="permanentMarker boton-contacto">Contact me!</a></span>
            </div>
        </div>
        <footer class="flex footer">
            <div class="grid contenedor-footer">
                <h4 class="B612">
                    ¡Si quieres seguirme a mi, o los proyectos que hago, usa estos enlaces!
                </h4>
                <div class="flex contenedor-rrss">
                    <a target="_blank" href="https://www.linkedin.com/in/el-payo-bestia/">
                        <i class="fab fa-linkedin-in rrss color-lin">
                        </i>
                    </a>
                    <a target="_blank" href="https://www.github.com/bigbae18">
                        <i class="rrss color-git fab fa-github">
                        </i>
                    </a>
                    <a target="_blank" href="https://www.instagram.com/el.payobestia18">
                        <i class="rrss color-ig fab fa-instagram">
                        </i>
                    </a>
                </div>
            </div>
        </footer>
    </main>
    <script src="js/main.js"></script>
</body>

</html>