-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
161 lines (142 loc) · 5 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
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>@jailandrade</title>
<link href="https://fonts.googleapis.com/css?family=Muli" rel="stylesheet">
<script defer src="https://use.fontawesome.com/releases/v5.8.1/js/all.js" integrity="sha384-g5uSoOSBd7KkhAMlnQILrecXvzst9TdC09/VM+pjDTCM+1il8RHz5fKANTFFb+gQ" crossorigin="anonymous"></script>
<style>
*,
*:before,
*:after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html {
box-sizing: inherit;
}
body {
background-color: #21abcd;
font-size: 20px;
line-height: 1.95;
font-family: 'Muli', sans-serif;
}
.page {
background-color: #fff;
margin: 2rem;
padding: 2rem;
display: grid;
grid-template-columns: 1fr 4fr;
grid-column-gap: 2rem;
border-radius: 1rem;
box-shadow: 2px 4px 8px #ddd;
}
.sidebar {
padding: 0 1.25rem;
border-right: 2px solid #666;
display: block;
}
.thumbnail img {
width: 150px;
margin: 0 auto;
}
.skills {
padding: 2rem 0;
}
.skills .skills-title {
border-bottom: 2px solid #999;
color: #444;
line-height: 2;
margin: 0;
}
.skills-list li {
list-style: none;
margin: 0.25rem;
}
.content-header {
padding: 1rem 0;
}
.content .content-header h1 {
color: #333;
margin: 0.25rem 0;
}
.content .content-header p {
margin: 0.25rem 0;
font-size: 1.25rem;
color: #666;
}
.content .content-header .content-title {
color: #cd21ab;
font-weight: bold;
}
.content-summary {
padding: 2rem 0;
border-top: 2px solid #888;
}
.content-summary dt {
font-weight: bold;
font-size: 1.25rem;
}
.content-summary dd {
margin-left: 2rem;
margin-bottom: 1rem;
}
</style>
</head>
<body>
<div class="page">
<aside class="sidebar">
<div class="thumbnail">
<img src="https://avatars2.githubusercontent.com/u/512046?s=460&v=4" alt="jailandrade logo designed by giselaleyva">
</div>
<div class="skills">
<h2 class="skills-title">Skills</h2>
<ul class="skills-list">
<li>Web content-driven design </li>
<li>Mobile app development</li>
<li>Web product design & development</li>
<li>API design & development</li>
</ul>
</div>
<div class="skills">
<h2 class="skills-title">Stack</h2>
<ul class="skills-list">
<li><strong>Languages:</strong> HTML, CSS, JavaScript, TypeScript, Python, PHP</li>
<li><strong>Frameworks:</strong> jQuery, Angular, Vue, React/React Native, Django, Express, Laravel, Next.js</li>
<li><strong>Cloud:</strong> AWS, Azure, Digital Ocean</li>
</ul>
</div>
</aside>
<main class="content">
<header class="content-header">
<h1>Mikhail Cruz Andrade</h1>
<p>
<span class="content-title">Software developer</span>
<span><i class="fas fa-map-marker-alt"></i> México & Remote</span>
</p>
</header>
<section class="content-summary">
<dl>
<dt>Indie developer (2021 - present)</dt>
<dd>I am building my web products using all the technologies, methodologies, and ideas I've learned in the past decade. I want to create things I need and use.</dd>
<dt>Front-end Lead at LemonScale (2020 - present)</dt>
<dd>I am the front-end lead in an agency that creates digital products using the React.js ecosystem.</dd>
<dt>Backend developer at Hostapet (2018-2019)</dt>
<dd>I worked as the lead backend developer maintaining the architect of the system.</dd>
<dt>Frontend developer at Nubo (2018)</dt>
<dd>I worked as an Angular engineer designing several web applications for a few months.</dd>
<dt>Frontend developer at Koneksys (2016-2017)</dt>
<dd>I worked building web applications for linked data using Angular and React.</dd>
<dt>Fullstack Web Developer at Agile Kitchen (2015-2016)</dt>
<dd>I worked building and maintaining websites and web applications for international and national startups. Here I learned to think of the project as a product.</dd>
<dt>Freelance (2009-2015)</dt>
<dd>I worked creating small websites for small businesses using WordPress and HTML, CSS, JS, and jQuery to show their products and services and provide an easy way for their users to contact them. I focused on making their websites responsive and SEO-driven.</dd>
</dl>
</section>
<section class="content-information">
</section>
</main>
</div>
</body>
</html>