├── fotos ├── 01.jpg ├── 02.jpg ├── 03.jpg ├── 04.jpg ├── 05.jpg ├── 06.jpg ├── 07.jpg ├── 08.jpg ├── 09.jpg ├── 10.jpg ├── 11.jpg └── 12.jpg └── README.md /fotos/01.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/01.jpg -------------------------------------------------------------------------------- /fotos/02.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/02.jpg -------------------------------------------------------------------------------- /fotos/03.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/03.jpg -------------------------------------------------------------------------------- /fotos/04.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/04.jpg -------------------------------------------------------------------------------- /fotos/05.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/05.jpg -------------------------------------------------------------------------------- /fotos/06.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/06.jpg -------------------------------------------------------------------------------- /fotos/07.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/07.jpg -------------------------------------------------------------------------------- /fotos/08.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/08.jpg -------------------------------------------------------------------------------- /fotos/09.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/09.jpg -------------------------------------------------------------------------------- /fotos/10.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/10.jpg -------------------------------------------------------------------------------- /fotos/11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/11.jpg -------------------------------------------------------------------------------- /fotos/12.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/devoffarg/DevOff-Desafio-1/HEAD/fotos/12.jpg -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![](https://static-cdn.jtvnw.net/jtv_user_pictures/fb425ddf-5e67-4c84-9210-8065809675f7-profile_banner-480.png) 2 | 3 | # Desafío 1 - 26/07/2020 4 | 5 | Deberás implementar una galería de fotos, utilizando **solamente** HTML y CSS. 6 | 7 | ## Condiciones del desafío 8 | 9 | ⛔ No se puede utilizar JavaScript. 10 | 11 | ⛔ No se puede utilizar ningún framework de CSS. 12 | 13 | ✅ Debe soportar fotos horizontales y verticales. 14 | 15 | ✅ Debe poder ampliar una foto a su tamaño original o a un máximo determinado al hacerle un click. 16 | 17 | ✨ Serás libre de implementar la estética y funcionalidad que quieras, siempre y cuando se cumplan las condiciones esenciales del desafío. 18 | 19 | ## 📚 Herramientas de consulta 20 | 21 | Podrás utilizar cualquier herramienta de búsqueda que necesites (amamos buscar en Google y leer Stack Overflow <3). 22 | 23 | ## ⏳ Tiempo 24 | 25 | Tendrás **1 hora** para resolver el desafío. 26 | 27 | ## 🌈 Algunos ejemplos para que explores 28 | 29 | - https://codepen.io/MalaikaIshtiaq/pen/MNbXyx 30 | - https://codepen.io/thebabydino/pen/oWqpzw 31 | - https://codepen.io/bbx/pen/Jxoqdg 32 | - https://codepen.io/alchatti/pen/NOdzLO 33 | 34 | ## 📸 ¿De dónde saco fotos? 35 | 36 | ¡Este repositorio incluye algunas fotos de ejemplo! Están en la carpeta [`fotos`](./fotos): 37 | 38 | 39 | 40 | De todos modos, si tenés fotos que te gusten y quieras usarlas a mano, podés utilizar esas mismas. 41 | 42 | ## 🤔 ¿Cómo presento mi código? 43 | 44 | ### Si tenés una cuenta en GitHub 45 | 46 | Hacé un fork de este repo: 47 | 48 | ![Presionar el botón Fork, situado al comienzo de la página](https://docs.github.com/assets/images/help/repository/fork_button.jpg) 49 | 50 | Cloná tu fork, reemplazando `[TU_ALIAS]` con el nombre de tu cuenta de GitHub. Podés clonarlo utilizando la consola: 51 | 52 | ``` 53 | git clone https://github.com/[TU_ALIAS]/DevOff-Desafio-1 54 | ``` 55 | 56 | También podés utilizar GitHub Desktop, tu IDE favorito, lo que gustes. 57 | 58 | Cuando finalices la resolución del desafío, no olvides subir todos tus cambios usando `git push` o el equivalente que ofrezca tu cliente de Git. Envianos por el chat de la transmisión o por DM a la cuenta de Twitter de DevOff Argentina el link a tu repositorio. 59 | 60 | ### Si no tenés una cuenta en GitHub 61 | 62 | [Podés hacer clic aquí y mágicamente se descargará un archivo comprimido con todo lo que contiene este repositorio](https://github.com/devoffarg/DevOff-Desafio-1/archive/master.zip). 63 | 64 | Cuando finalices la resolución del desafío, envianos un archivo ZIP con todo tu trabajo a través de [WeTransfer](https://wetransfer.com/). 65 | 66 | ## 💜 Agradecimientos 67 | 68 | ### Jurados 69 | 70 | - ¡Gracias a [Gonzalo Pozzo](https://twitter.com/goncy) y [Magalí Domínguez](https://twitter.com/printmaga) por ser nuestros jurados! 71 | - ¡Un agradecimiento especial a [Damián Catanzaro](https://twitter.com/damiancatanzaro), el jurado invitado de esta edición! 72 | 73 | ### Organizaciones aliadas 74 | 75 | ¡Gracias a [Migue Moyano](https://twitter.com/elmiguedev), [Joel A. Villarreal Bertoldi](https://twitter.com/joelalejandro) y [Agustín Carrasco](https://twitter.com/asermax) del equipo de [CoDeAr](https://twitter.com/somoscodear) por dar una mano para que este proyecto sea posible! 76 | 77 | ### Créditos 78 | 79 | DevOff Argentina es un proyecto ideado por [Aldana Denise](https://twitter.com/gizmowis), con el apoyo de [CoDeAr](https://twitter.com/somoscodear). 80 | 81 | Este desafío incluye fotos cortesía de las siguientes fuentes: 82 | 83 | - [Close up photography of sleeping tabby cat](./fotos/01.jpg), de [Ihsan Adity](https://twitter.com/IhsanAdity) 84 | - [Baking cheese cooking crust](./fotos/02.jpg), de [Pixabay](https://www.pexels.com/@pixabay) 85 | - [Woman holding cup of latte](./fotos/03.jpg), de [The Lazy Artist](https://twitter.com/antassingh) 86 | - [Photography of tree](./fotos/04.jpg), de [Yugal Srivastava](https://twitter.com/yugalsrivastava) 87 | - [White clouds and blue sky](./fotos/05.jpg), de [Ithalu Dominguez](https://twitter.com/ithasud) 88 | - [Brown and white short coated puppy](./fotos/06.jpg), de [Valeria Boltneva](https://instagram.com/tsapolka) 89 | - [Food plate chocolate dessert](./fotos/07.jpg), de [Alexander Dummer](https://www.pexels.com/@alexander-dummer-37646) 90 | - [Person holding multi-colored heart-shaped ornament](./fotos/08.jpg), de [Sharon McCutcheon](https://instagram.com/mccutcheonphoto) 91 | - [Brown hummingbird selective focus photography](./fotos/09.jpg), de [Philippe Donn](https://twitter.com/philippedonnphotography) 92 | - [Wall-e toy on beige pad](./fotos/10.jpg), de [Lenin Estrada](https://www.pexels.com/@lenin-estrada-117221) 93 | - [Sliced fruits on tray](./fotos/11.jpg), de [Trang Doan](https://instagram.com/iamtrangdoan) 94 | - [Person hand and crescent moon](./fotos/12.jpg), de [Kaique Rocha](https://instagram.com/hikaique) 95 | 96 | ## 🚀 Soluciones 97 | 98 | ¡A continuación, listamos todas las soluciones que se fueron presentando para este desafío! 99 | 100 | 🌟 Participantes EN VIVO: 101 | 102 | - https://github.com/LucianABC/DevOff-Desafio-1, por Lucian 🏆 103 | - https://github.com/paz873107/DevOff-Desafio-1, por Paz Casaux 104 | - https://github.com/MatiSera/DevOff-Desafio-1, por Mati Sera 105 | - https://github.com/Irnias/DevOff-Desafio-1, por Irnias 106 | 107 | 💜 Participantes de la comunidad: 108 | 109 | - https://codepen.io/joaqo89/pen/oNbRJyR, por [Joaco](https://twitter.com/deseodeseodeseo/status/1288287428973924354) 110 | - https://codepen.io/paula-abramovich/pen/bGEyOdV. por [Paula Abramovich](https://twitter.com/PaulaAbramovich/status/1288271691479683074) 111 | - https://codepen.io/saulmoniq/pen/RwrmExb, por [Saul Monique](https://twitter.com/Saulmonique_/status/1288282576508129285) 112 | - https://devoff-desafio1.vercel.app, por [Oscar Moreira](https://twitter.com/OscarMoreira1/status/1288169118051586049) 113 | - https://twitter.com/i/status/1288130251109826560, por @SailorCris 114 | - https://codepen.io/julieta-mullen/pen/BajeQdY, por [Julieta Mullen](https://twitter.com/julietamullen/status/1288042816552280066) 115 | - https://codepen.io/edukj/pen/ZEQNOap, por [Kuki](https://twitter.com/edukj_/status/1287952612181127169) 116 | - https://github.com/csmamani/DevOff-Desafio-1, por [Carolin](https://twitter.com/mcarolinx/status/1287948646210822145) 117 | - https://codepen.io/gabrield22/pen/NWxVraK, por [Gabriel Domínguez](https://twitter.com/Gabeed22/status/1287932534156910593) 118 | - https://codepen.io/erosilk/pen/WNrBwMa, por [Micael Robles](https://twitter.com/_mikirobles/status/1287912851135397896) 119 | - https://codepen.io/dcatanzaro/pen/VweOaZe, por [Damián Catanzaro](https://twitter.com/DamianCatanzaro/status/1287904364322004995) 120 | - https://codepen.io/adrian-benavente/pen/VweOwNq, por [Adrián Benavente](https://twitter.com/fenavente/status/1287812603205562369?) 121 | - https://twitter.com/Jess_vel92/status/1287855604590092291, por @Jess_vel92 122 | - https://codepen.io/fefitin/pen/RwrmrKb, por [Federico García](https://twitter.com/fefitin_/status/1287882645439799296) 123 | - https://codepen.io/goncy/pen/rNxbExM, por [Goncy](https://twitter.com/goncy/status/1287755085137707010) 124 | - https://ivanfranco502.github.io/DevOff-Desafio-1/, por [Iván Franco](https://twitter.com/ivanfranco502/status/1287744145306550273) 125 | - https://twitter.com/GabiAleMoya/status/1287611234595082241, por @GabiAleMoya 126 | - https://github.com/Enkdress/DevOff-Desafio-1, por [Sergio Correa](https://twitter.com/xEnkdress/status/1287608557773434881) 127 | - https://github.com/emicarito/DevOff-Desafio-1, por [Emi Carito](https://twitter.com/emicarito92/status/1287578784275795968) 128 | - https://codesandbox.io/s/purple-lake-s3r2f, por [Milonesse](https://twitter.com/milonesssa/status/1288511490207690754) 129 | - https://github.com/mmoyano16/DevOff-Desafio-1, por [Migue Moyano](https://twitter.com/elmiguedev/status/1288543185086697474) 130 | - https://repl.it/@joelalejandro/DevOff-Desafio-1#index.html, por [Joey](https://twitter.com/JoelAlejandro/status/1288576981265797121) 131 | - https://twitter.com/AyalaLean4339/status/1288927021071040516, por @AyalaLean4339 132 | - https://github.com/Emilia-Guadalupe/GaleriaDeFotos, por [Emilia Guadalupe](https://twitter.com/Emi_guadalupe/status/1288885279789547522) 133 | - https://codepen.io/Aman-sgz/pen/GRobNYv, por [Aman](https://twitter.com/webdevelopera/status/1288623894413312001) 134 | - https://github.com/marcosdellavecchia/DevOff-Desafio-1, por [Marcos Della Vecchia](https://twitter.com/marcosdv/status/1288664276526407681) 135 | - https://gueretamartin.github.io/DevOff-Desafio-1/, por [Martín Guereta](https://twitter.com/MartinGuereta/status/1288669240636186625) 136 | - https://twitter.com/Franqsanz/status/1288937196439953409, por @Franqsanz 137 | 138 | # ¡Muchos éxitos y a codear! 139 | --------------------------------------------------------------------------------