rubyperu.github.com/index.html at master · rubyperu/rubyperu.github.com · 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
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
---
layout: base
---
<sectionclass="text-stone-800 py-36 md:py-56 px-5">
<divclass="max-w-5xl mx-auto md:grid md:grid-cols-2 gap-20 items-center justify-between">
<divclass="gap-2">
<pclass="font-medium text-4xl">Bienvenidos a <bclass="sr-only">Ruby Perú</b></p>
<imgsrc="{{ '/img/rubyperu_logo_color.svg' | relative_url }}" alt="Ruby Peru logo" />
<pclass="uppercase font-medium tracking-widest">Comunidad de entusiastas de Ruby en Perú</p>
<ulclass="flex gap-4 mt-4">
<li><ahref="https://www.facebook.com/rubypegroup" target="_blank">
<svgclass="fill-rose-500 h-10 hover:fill-rose-700" fill="currentColor" height="229.9" preserveAspectRatio="xMidYMid meet"
version="1" viewBox="0.0 0.0 230.9 229.9" zoomAndPan="magnify" role="img">
<title>Facebook Logo</title>
<g>
<path
d="M115.5,0C51.7,0,0,51.7,0,115.5c0,57.3,41.8,104.9,96.5,113.9v-78.3H67.1v-34.3h29.4V91.9c0-27,21.9-45.3,48.9-45.3 c12,0,19.5,1.8,19.5,1.8v28.8h-19.5c-8.1,0-14.7,6.6-14.7,14.7v24.9h31.5l-4.4,34.3h-27.1v78.8c56.5-7.5,100.1-55.9,100.1-114.4 C230.9,51.7,179.2,0,115.5,0z" />
</g>
</svg>
<spanclass="sr-only">Facebook Account</span>
</a></li>
<li><ahref="https://twitter.com/rubyperu" target="_blank">
<svgclass="fill-rose-500 h-10 hover:fill-rose-700" fill="currentColor" preserveAspectRatio="xMidYMid meet" version="1"
viewBox="0.0 0.0 231.0 231.0" zoomAndPan="magnify" role="img">
<title>Twitter Logo</title>
<g>
<path
d="M115.5,0C51.7,0,0,51.7,0,115.5c0,63.8,51.7,115.5,115.5,115.5c63.8,0,115.5-51.7,115.5-115.5C230.9,51.7,179.2,0,115.5,0z M182.9,89.5c0,0,2,44.2-31.6,71.6C101,202,46.7,168.8,46.7,168.8s13.2,0.2,24.9-2.9c11.6-3.1,20-10.7,20-10.7s-12.7-2.6-19.3-7.4 c-6.6-4.8-9.2-14-9.2-14s4.4,0.4,7.1,0.3c2.8-0.1,6.1-1.4,6.1-1.4s-9.1-1.1-17.6-10.6c-6.7-7.5-6.2-20-6.2-20s4,2.4,6.1,2.9 c2.1,0.6,6.2,0.6,6.2,0.6s-8-4.7-11.5-17c-3.5-12.2,3.2-24.6,3.2-24.6S68.4,78.4,86,87.6c17.6,9.2,34.2,8.9,34.2,8.9 s-2.4-7.3,1.8-18.1c4.2-10.8,13.7-18.6,28.2-19.7c14.5-1.2,23.8,9.8,23.8,9.8s4.5-0.8,9.6-2.7c5.1-1.8,10.2-4.2,10.2-4.2 s-1.8,5.5-5.3,9.8c-3.5,4.3-7.4,6.9-7.4,6.9s4.6-0.3,9.2-1.6c4.6-1.3,7.1-2.6,7.1-2.6C192.1,82.9,182.9,89.5,182.9,89.5z" />
</g>
</svg>
<spanclass="sr-only">Twitter Account</span>
</a></li>
</ul>
</div>
<imgsrc="{{ '/img/meetup_1.png' | relative_url }}" class="hidden md:block aspect-video rounded-3xl object-cover" alt="Ruby Peru meetup photo" />
</div>
</section>

<sectionclass="bg-rose-700 py-20 px-5 text-red-50">
<divclass="max-w-xl mx-auto flex items-center gap-6">
<imgsrc="{{ '/img/icon_goal.svg' | relative_url }}" class="h-32" alt="" />
<pclass="text-center uppercase text-lg font-medium tracking-widest">Nuestro principal objetivo es que ruby llegue a más personas</p>
</div>
</section>

<sectionclass="text-stone-800 py-32 px-5 font-light">
<divclass="max-w-5xl mx-auto flex flex-col gap-24">
<h3class="text-center uppercase font-medium text-rose-500 text-5xl tracking-wider">Iniciativas</h3>
<ulclass="flex flex-col gap-20">
<liclass="grid sm:grid-cols-2 gap-6 md:gap-24 items-center">
<divclass="flex flex-col gap-4">
<h4class="text-rose-600 uppercase font-semibold text-xl tracking-widest">Meetups Mensuales</h4>
<p>Cada 2do jueves del mes tenemos una reunión virtual para reencontrarnos, aprender algo juntos o solo ponernos al día!</p>
</div>
<imgsrc="{{ '/img/meetup_2.png' | relative_url }}" class="object-cover" alt="" />
</li>
<liclass="grid sm:grid-cols-2 gap-6 sm:gap-24 items-center">
<divclass="flex flex-col gap-4 sm:order-last">
<h4class="text-rose-600 uppercase font-semibold text-xl tracking-widest">Club de Lectura</h4>
<p>Cada 2 semanas nos reunimos para discutir un nuevo capítulo del libro actual que estemos leyendo.</p>
</div>
<divclass="bg-rose-100 flex gap-4 lg:gap-8 px-4 lg:px-12 items-center">
<imgsrc="{{ '/img/book_refactoring.jpeg' | relative_url }}" class="object-cover h-40 md:h-56" alt="" />
<pclass="md:text-lg">
<spanclass="font-bold text-sm uppercase tracking-widest">Libro actual:</span><br/>
 Refactoring - Ruby Edition
</p>
</div>
</li>
<liclass="grid sm:grid-cols-2 gap-6 sm:gap-24 items-center">
<divclass="flex flex-col gap-4">
<divclass="flex items-center justify-between">
<h4class="text-rose-600 uppercase font-semibold text-xl tracking-widest">Live Code Streaming</h4>
<spanclass="uppercase tracking-wide text-xs bg-stone-300 text-stone-950 font-medium px-4 py-2 rounded-full">Inactivo</span>
</div>
<p>Cada 2 semanas, algunos organizadores hacemos un streaming en Twitch programando un proyecto en Ruby.</p>
</div>
<imgsrc="{{ '/img/project_1.png' | relative_url }}" class="object-cover" alt="" />
</li>
</ul>
</div>
</section>

<sectionclass="bg-rose-700 py-20 px-5 text-red-50">
<divclass="max-w-lg mx-auto flex flex-col gap-8 items-center text-center">
<pclass="uppercase text-lg font-medium tracking-widest">Todas nuestras actividades son gratuitas y esto es gracias al apoyo de la comunidad</p>
<ahref="https://github.com/sponsors/rubyperu" class="bg-red-50 text-rose-700 w-72 py-2 border border-red-50 rounded-full uppercase font-semibold flex-shrink-0 hover:bg-red-700 hover:text-red-50 focus-visible:outline-2 focus-visible:outline-red-700 focus-visible:outline-offset-2">Apóyanos en GitHub</a>
</div>
</section>

<sectionclass="text-stone-800 py-32 px-5 font-light text-lg">
<divclass="max-w-5xl mx-auto flex flex-col gap-20">
<divclass="flex flex-col gap-12">
<h3class="text-center uppercase font-medium text-rose-500 text-3xl md:text-5xl tracking-wider">Colaboradores</h3>
<ulclass="grid grid-cols-2 md:grid-cols-4 gap-10 justify-evenly text-center">
<liclass="group hover:bg-rose-200 p-2 rounded-lg">
<ahref="https://twitter.com/KattyaCuevas" target="_blank">
<imgsrc="https://pbs.twimg.com/profile_images/1405618697209880586/Q_kpcv5V_400x400.jpg" alt=@KattyaCuevas" class="object-cover h-32 w-32 sm:h-40 sm:w-40 md:h-32 md:w-32 lg:h-40 lg:w-40 mx-auto rounded-full border-2 border-rose-500">
<spanclass="underline group-hover:bg-red-50 px-2 py-1 rounded">@KattyaCuevas</span>
</a>
</li>
<liclass="group hover:bg-rose-200 p-2 rounded-lg">
<ahref="https://twitter.com/mayralunavarro" target="_blank">
<imgsrc="https://pbs.twimg.com/profile_images/630831639749378049/H_GhywsG_400x400.jpg" alt="@mayralunavarro" class="object-cover h-32 w-32 sm:h-40 sm:w-40 md:h-32 md:w-32 lg:h-40 lg:w-40 mx-auto rounded-full border-2 border-rose-500">
<spanclass="underline group-hover:bg-red-50 px-2 py-1 rounded">@mayralunavarro</span>
</a>
</li>
<liclass="group hover:bg-rose-200 p-2 rounded-lg">
<ahref="https://twitter.com/DiegoGCuevas" target="_blank">
<imgsrc="https://pbs.twimg.com/profile_images/1189206551405436931/y5kukAC2_400x400.jpg" alt="@DiegoGCuevas" class="object-cover h-32 w-32 sm:h-40 sm:w-40 md:h-32 md:w-32 lg:h-40 lg:w-40 mx-auto rounded-full border-2 border-rose-500">
<spanclass="underline group-hover:bg-red-50 px-2 py-1 rounded">@DiegoGCuevas</span>
</a>
</li>
<liclass="group hover:bg-rose-200 p-2 rounded-lg">
<ahref="https://twitter.com/marieth_pe" target="_blank">
<imgsrc="https://pbs.twimg.com/profile_images/1274536169494188034/emxsagxy_400x400.jpg" alt="@marieth_pe" class="object-cover h-32 w-32 sm:h-40 sm:w-40 md:h-32 md:w-32 lg:h-40 lg:w-40 mx-auto rounded-full border-2 border-rose-500">
<spanclass="underline group-hover:bg-red-50 px-2 py-1 rounded">@marieth_pe</span>
</a>
</li>
</ul>
</div>
<divclass="grid md:grid-cols-2 gap-28">
<div>
<h4class="text-center uppercase text-rose-600 font-semibold text-3xl tracking-wider">¿Qué es lo que hacemos?</h4>
<ulclass="mt-8 flex flex-col gap-6 px-8 max-w-sm mx-auto">
<liclass="flex gap-4 items-center">
<imgsrc="{{ '/img/icon_gem.svg' | relative_url }}" class="h-8 md:h-12" alt="" />
 Organizar diferentes iniciativas
</li>
<liclass="flex gap-4 items-center">
<imgsrc="{{ '/img/icon_gem.svg' | relative_url }}" class="h-8 md:h-12" alt="" />
 Gestión de redes sociales
</li>
<liclass="flex gap-4 items-center">
<imgsrc="{{ '/img/icon_gem.svg' | relative_url }}" class="h-8 md:h-12" alt="" />
 Mantenimiento de proyectos
</li>
<liclass="flex gap-4 items-center">
<imgsrc="{{ '/img/icon_gem.svg' | relative_url }}" class="h-8 md:h-12" alt="" />
 Otras actividades… (?!)
</li>
</ul>
</div>
<div>
<h4class="text-center uppercase text-rose-600 font-semibold text-3xl tracking-wider">¿Cómo sumarte?</h4>
<ulclass="mt-8 flex flex-col gap-6 px-8 max-w-sm mx-auto">
<liclass="flex gap-4 items-center">
<imgsrc="{{ '/img/icon_gem.svg' | relative_url }}" class="h-8 md:h-12" alt="" />
<span>
 Unirte a nuestro <ahref="https://ruby.pe/slack" target="_blank" class="underline hover:bg-red-50 px-2 py-1 rounded">Slack</a>
</span>
</li>
<liclass="flex gap-4 items-center">
<imgsrc="{{ '/img/icon_gem.svg' | relative_url }}" class="h-8 md:h-12" alt="" />
 Unirte al canal #coordinación ó
</li>
<liclass="flex gap-4 items-center">
<imgsrc="{{ '/img/icon_gem.svg' | relative_url }}" class="h-8 md:h-12" alt="" />
 Hablarle a uno de los organizadores
</li>
</ul>
</div>
</div>
</div>
</section>