diff --git a/html/index.html b/html/index.html index 88406eeea37ebd441000f29247d3699eafcb3ce9..8bb1526d6bd37142609b68e86b5ba2c24ba0ee43 100644 --- a/html/index.html +++ b/html/index.html @@ -3,6 +3,7 @@ <head> <title>SABER 2022</title> <meta charset="utf-8"> + <meta name="viewport" content="width=device-width, initial-scale=1" /> <link href="https://cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.0.2/tailwind.min.css" rel="stylesheet" /> <link rel="stylesheet" href="assets/css/style.css" /> <script src="https://cdn.tailwindcss.com"></script> @@ -116,152 +117,151 @@ </h1> <div class="h-1 w-20 bg-blue-500 rounded"></div> </div> - <div class="flex flex-wrap -m-4"> + <div class="flex flex-wrap -m-4 justify-center"> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative"> <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Palestra</h2> <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> Segurança em Redes de Internet das Coisas </h1> + <div class="flex-1"></div> <p class="leading-relaxed">Carlos Pedroso</p> <p class="leading-relaxed text-sm mb-3">Mestrando do NR2</p> - <img src="assets/img/palestrantes/carlos-pedroso.jpg"></img> + <img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/carlos-pedroso.jpg"></img> </div> </div> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative"> <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Oficina</h2> <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> Introdução à Programação de Embarcados com Arduino </h1> + <div class="flex-1"></div> <p class="leading-relaxed">Eduardo Todt</p> <p class="leading-relaxed text-sm mb-3">Professor do DINF</p> - <img src="assets/img/palestrantes/eduardo-todt.jpg"></img> + <img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/eduardo-todt.jpg"></img> </div> </div> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative"> <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Palestra</h2> <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> Empregando Estruturas de Redes Oportunistas em Ambientes Urbanos Externos para Apoiar Pessoas em Situação Emergencial de Saúde </h1> + <div class="flex-1"></div> <p class="leading-relaxed">Agnaldo de Souza Batista</p> <p class="leading-relaxed text-sm mb-3">Doutorando do NR2</p> - <img src="assets/img/palestrantes/agnaldo-batista.jpg"></img> + <img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/agnaldo-batista.jpg"></img> </div> </div> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative"> <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Oficina</h2> <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> Técnicas de Programação Competitiva </h1> + <div class="flex-1"></div> <p class="leading-relaxed"> Fernando Kiotheka </p> <p class="leading-relaxed text-sm mb-3">Mestrando do LarSiS</p> - <img src="assets/img/palestrantes/fernando-kiotheka.jpg"></img> + <img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/fernando-kiotheka.jpg"></img> </div> </div> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative"> <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Palestra</h2> <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> Meninas++ </h1> - <p class="leading-relaxed"> - Rachel Carlos Duque Reis - </p> + <div class="flex-1"></div> + <p class="leading-relaxed">Rachel Carlos Duque Reis</p> <p class="leading-relaxed text-sm mb-3">Professora do DINF</p> - <img src="assets/img/palestrantes/rachel-reis.jpg"></img> + <img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/rachel-reis.jpg"></img> </div> </div> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative"> <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Palestra</h2> - <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> - Carreiras Além do Desenvolvimento - </h1> - <p class="leading-relaxed"> - Lara Clink - </p> + <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3">Carreiras Além do Desenvolvimento</h1> + <div class="flex-1"></div> + <p class="leading-relaxed">Lara Clink</p> <p class="leading-relaxed text-sm mb-3">DevOps da Voxy, Graduada</p> - <img src="assets/img/palestrantes/lara-clink.jpg"></img> + <img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/lara-clink.jpg"></img> </div> </div> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative"> <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Oficina</h2> <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> Paralelização usando OpenMP e OpenACC em CPU e GPU </h1> - <p class="leading-relaxed"> - Odair Mario Dutkin Jr - </p> + <div class="flex-1"></div> + <p class="leading-relaxed">Odair Mario Dutkin Jr</p> <p class="leading-relaxed text-sm mb-3">Mestrando do LarSiS</p> - <img src="assets/img/palestrantes/odair-dutkin.jpg"></img> + <img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/odair-dutkin.jpg"></img> </div> </div> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative"> <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Oficina</h2> <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> Introdução à Vue.js </h1> - <p class="leading-relaxed"> - Bryan Fellipe Santos da Costa - </p> + <div class="flex-1"></div> + <p class="leading-relaxed">Bryan Fellipe Santos da Costa</p> <p class="leading-relaxed text-sm mb-3">Graduando</p> + <div class="h-104 object-cover aspect-square object-center"></div> </div> </div> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative"> <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Oficina</h2> <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> Oficina de Pixel Art </h1> - <p class="leading-relaxed"> - Victor "Crowno" Moura - </p> + <div class="flex-1"></div> + <p class="leading-relaxed">Victor "Crowno" Moura</p> <p class="leading-relaxed text-sm mb-3">Diretor de Arte do Terraria/Re-Logic</p> - <img src="assets/img/palestrantes/victor-moura.jpg"></img> + <img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/victor-moura.jpg"></img> </div> </div> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> - <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Oficina</h2> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative"> + <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Palestra</h2> <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> - Oficina de Pixel Art + Carreiras na Computação </h1> - <p class="leading-relaxed"> - Mario Souto <br>"Dev Soutinho" - </p> + <div class="flex-1"></div> + <p class="leading-relaxed">Mario Souto <br>"Dev Soutinho"</p> <p class="leading-relaxed text-sm mb-3">YouTuber</p> - <img src="assets/img/palestrantes/mario-souto.jpg"></img> + <img class="h-104 object-cover aspect-square object-center" src="assets/img/palestrantes/mario-souto.jpg"></img> </div> </div> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col overflow-hidden text-center relative"> <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Roda de Conversa</h2> <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> Conversa sobre a Batalha do Politécnico </h1> + <div class="flex-1"></div> <p class="leading-relaxed text-sm mb-3"> No dia 12 de maio de 1968, o Centro Politécnico foi palco de uma combativa manifestação estudantil contra o fim da gratuidade do Ensino Superior público que almejou ser implantado pelo Ministro da Educação do Golpe Militar de 1964 e então reitor da UFPR, Flávio Suplicy de Lacerda. </p> - <img src="assets/img/batalha-politecnico.jpg"></img> + <img class="h-104 object-cover aspect-square object-center" src="assets/img/batalha-politecnico.jpg"></img> </div> </div> <div class="p-4 lg:w-1/3"> - <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-24 rounded-lg overflow-hidden text-center relative"> + <div class="h-full bg-gray-100 bg-opacity-75 px-8 pt-16 pb-8 rounded-lg flex flex-col coverflow-hidden text-center relative"> <h2 class="tracking-widest text-xs uppercase title-font font-medium text-gray-400 mb-1">Roda de Conversa</h2> <h1 class="title-font sm:text-2xl text-xl font-medium text-gray-900 mb-3"> Cine Debate: O Menino da Internet </h1> + <div class="flex-1"></div> <p class="leading-relaxed text-sm mb-3"> A história do ativista de internet e pioneiro de programação Aaron Swartz a partir de sua adolescencia, seu envolvimento com o RSS, a fundação do Reddit, e seu crescente interesse na defesa polÃtica relacionada a Cultura Livre. O filme ainda explora sua prisão, as táticas da acusação a fundamentar seus supostos crimes. </p> - <img src="assets/img/internet-own-boy.jpg"></img> + <img class="h-104 w-104 object-fill" src="assets/img/internet-own-boy.jpg"></img> </div> </div> </div> @@ -310,7 +310,7 @@ </div> <div class="py-5"> <h3 class="text-xl">Quarta-feira (30/11)</h3> - <div class="flex p-2"> + <div class="flex p-2 flex-wrap"> <div class="flex items-center"> <div class="m-1 bg-green-200 w-5 h-5"></div> <span class="p-1">Palestra</span> @@ -338,9 +338,9 @@ </div> <div class="grade w-full grid gap-0.5 bg-gray-400 border border-gray-500 border-2"> <div class="bg-white text-center font-bold">Horário</div> - <div class="bg-white text-center font-bold">Hall do DINF</div> + <div class="bg-white text-center font-bold">Hall DINF</div> <div class="bg-white text-center font-bold">Auditório DINF</div> - <div class="bg-white text-center font-bold">Laboratório 1-2</div> + <div class="bg-white text-center font-bold">Lab 1-2</div> <div class="bg-white text-center font-bold">CAAD</div> <div class="bg-white text-center col-start-1">09h30~10h00</div> @@ -387,7 +387,7 @@ </div> <div class="py-5"> <h3 class="text-xl">Quinta-feira (01/12)</h3> - <div class="flex p-2"> + <div class="flex p-2 flex-wrap"> <div class="flex items-center"> <div class="m-1 bg-green-200 w-5 h-5"></div> <span class="p-1">Palestra</span> @@ -415,9 +415,9 @@ </div> <div class="grade w-full grid gap-0.5 bg-gray-400 border border-gray-500 border-2"> <div class="bg-white text-center font-bold">Horário</div> - <div class="bg-white text-center font-bold">Hall do DINF</div> + <div class="bg-white text-center font-bold">Hall DINF</div> <div class="bg-white text-center font-bold">Auditório DINF</div> - <div class="bg-white text-center font-bold">Laboratório 1-2</div> + <div class="bg-white text-center font-bold">Lab 1-2</div> <div class="bg-white text-center font-bold">CAAD</div> <div class="bg-white text-center col-start-1">09h30~10h00</div> @@ -453,7 +453,7 @@ <div class="bg-white text-center col-start-1">17h00~17h30</div> <div class="bg-white text-center col-start-1">17h30~18h00</div> <div class="col-start-3 flex justify-center items-center text-center bg-green-200 row-span-3"> - Carreiras Além do Desenvolvimento + Carreiras Além do Desenvolvimento com Lara Clink </div> <div class="bg-white text-center col-start-1">18h00~18h30</div> <div class="bg-white text-center col-start-1">18h30~19h00</div> @@ -461,7 +461,7 @@ </div> <div class="py-5"> <h3 class="text-xl">Sexta-feira (02/12)</h3> - <div class="flex p-2"> + <div class="flex p-2 flex-wrap"> <div class="flex items-center"> <div class="m-1 bg-green-200 w-5 h-5"></div> <span class="p-1">Palestra</span> @@ -489,9 +489,9 @@ </div> <div class="grade w-full grid gap-0.5 bg-gray-400 border border-gray-500 border-2"> <div class="bg-white text-center font-bold">Horário</div> - <div class="bg-white text-center font-bold">Hall do DINF</div> + <div class="bg-white text-center font-bold">Hall DINF</div> <div class="bg-white text-center font-bold">Auditório DINF</div> - <div class="bg-white text-center font-bold">Laboratório 1-2</div> + <div class="bg-white text-center font-bold">Lab 1-2</div> <div class="bg-white text-center font-bold">CAAD</div> <div class="bg-white text-center col-start-1">09h30~10h00</div> @@ -532,7 +532,7 @@ </div> <div class="py-5"> <h3 class="text-xl">Sábado (03/12)</h3> - <div class="flex p-2"> + <div class="flex p-2 flex-wrap"> <div class="flex items-center"> <div class="m-1 bg-green-200 w-5 h-5"></div> <span class="p-1">Palestra</span> @@ -594,7 +594,7 @@ </div> <div class="py-5"> <h3 class="text-xl">Domingo (04/12)</h3> - <div class="flex p-2"> + <div class="flex p-2 flex-wrap"> <div class="flex items-center"> <div class="m-1 bg-green-200 w-5 h-5"></div> <span class="p-1">Palestra</span>