Merge pull request #128 from Lemoncode/feature/#119-add-credits-info

Feature/#119 add credits info

Author: brauliodiez

front/static/assets/alberto-caparros.jpg

@@ -101,65 +101,152 @@ <h2 class="heading">Video tutorial</h2>
           <h2 class="heading">Credits</h2>
           <div class="container">
             <div class="card">
-              <div class="card__img"></div>
+              <div class="card__img">
+                <img
+                  class="avatar"
+                  src="./assets/miguel-angel-vazquez.jpg"
+                  alt="Miguel Ángel Vazquez"
+                />
+              </div>
+              <div class="card__text">
+                <h3>Miguel Ángel Vázquez</h3>
+                <p>
+                  With an extensive career in artistic production and academic
+                  research, in 2019 he decided to retrain as a web developer.
+                  After finishing the Front-end master from Lemoncode, he
+                  participated in some open source projects. Currently, he is
+                  working as a front-end developer.
+                </p>
+              </div>
+            </div>
+            <hr class="divider" />
+            <div class="card">
+              <div class="card__img">
+                <img
+                  class="avatar"
+                  src="./assets/miguel-angel-romero.jpg"
+                  alt="Miguel Ángel Romero"
+                />
+              </div>
+              <div class="card__text">
+                <h3>Miguel Ángel Romero</h3>
+                <p>
+                  After a professional evolution from Java developer in banking
+                  environments to management tasks, a few years ago I decided to
+                  continue my professional life doing what I like the most,
+                  programming. After a recycling through a Master in Frontend, I
+                  am currently passionate about React and Javascript world,
+                  especially the pure "backend" code aspects.
+                </p>
+              </div>
+            </div>
+            <hr class="divider" />
+            <div class="card">
+              <div class="card__img">
+                <img
+                  class="avatar"
+                  src="./assets/alberto-caparros.jpg"
+                  alt="Alberto Caparrós Trigo"
+                />
+              </div>
+              <div class="card__text">
+                <h3>Alberto Caparrós Trigo</h3>
+                <p>
+                  Software developer - Frontend, Backend and Mobile Apps from
+                  Almería, Spain. I love to live different experiences all
+                  around the world and learn all I can about coding.
+                </p>
+              </div>
+            </div>
+            <hr class="divider" />
+            <div class="card">
+              <div class="card__img">
+                <img
+                  class="avatar"
+                  src="./assets/sergio-conde-ortega.png"
+                  alt="Sergio Conde Ortega"
+                />
+              </div>
+              <div class="card__text">
+                <h3>Sergio Conde Ortega</h3>
+                <p>
+                  Software Engineer with more than 18 years of experience having
+                  worked for the public administration and international
+                  companies, now focused on .NET and Javascript based projects.
+                </p>
+              </div>
+            </div>
+            <hr class="divider" />
+            <div class="card">
+              <div class="card__img">
+                <img
+                  class="avatar"
+                  src="./assets/alicia-ga.png"
+                  alt="Alicia Guardeño Albertos"
+                />
+              </div>
               <div class="card__text">
-                <h3>John Doe</h3>
+                <h3>Alicia Guardeño Albertos</h3>
                 <p>
-                  Lorem ipsum dolor sit amet consectetur adipisicing elit.
-                  Rerum, amet. Quisquam numquam laudantium, unde optio libero
-                  eaque perspiciatis minus doloribus asperiores et consectetur
-                  inventore quos cumque, reiciendis officia esse .Quisquam
-                  numquam laudantium, unde optio libero eaque perspiciatis minus
-                  doloribus asperiores et consectetur inventore quos cumque,
-                  reiciendis officia esse.
+                  Disabled software engineer 👩‍🦼 living in south Spain. ☀️ Now
+                  Frontend React developer looking for work in a 100% remote
+                  friendly company that supports open source sustainability. 🙌
+                  Previously worked on game development as a 2D generic/pixel
+                  artist, 🖌️ and mostly C# & unity programmer in indie games. 🎮
+                  I'm a huge nerd/geek, Pokemon TCG player, and D&D5 DM. 🤓
                 </p>
               </div>
             </div>
             <hr class="divider" />
             <div class="card">
-              <div class="card__img"></div>
+              <div class="card__img">
+                <img
+                  class="avatar"
+                  src="./assets/juan-pablo.jpg"
+                  alt="Juan Pablo Martínez"
+                />
+              </div>
               <div class="card__text">
-                <h3>Jane Smith</h3>
+                <h3>Juan Pablo Martínez</h3>
                 <p>
-                  Lorem ipsum dolor sit amet consectetur adipisicing elit.
-                  Rerum, amet. Quisquam numquam laudantium, unde optio libero
-                  eaque perspiciatis minus doloribus asperiores et consectetur
-                  inventore quos cumque, reiciendis officia esse .Quisquam
-                  numquam laudantium, unde optio libero eaque perspiciatis minus
-                  doloribus asperiores et consectetur inventore quos cumque,
-                  reiciendis officia esse.
+                  Front-End developer, ui/ux designer and Lemoncoder. Guitarist
+                  and heavy metal singer in my free time &#x1f918;
                 </p>
               </div>
             </div>
             <hr class="divider" />
             <div class="card">
-              <div class="card__img"></div>
+              <div class="card__img">
+                <img
+                  class="avatar"
+                  src="./assets/braulio-diez.png"
+                  alt="Braulio Díez"
+                />
+              </div>
               <div class="card__text">
-                <h3>Paul William</h3>
+                <h3>Braulio Díez</h3>
                 <p>
-                  Lorem ipsum dolor sit amet consectetur adipisicing elit.
-                  Rerum, amet. Quisquam numquam laudantium, unde optio libero
-                  eaque perspiciatis minus doloribus asperiores et consectetur
-                  inventore quos cumque, reiciendis officia esse .Quisquam
-                  numquam laudantium, unde optio libero eaque perspiciatis minus
-                  doloribus asperiores et consectetur inventore quos cumque,
-                  reiciendis officia esse.
+                  JavaScript / Typescript developer (old hand coming from .net
+                  background), trainer, writter and speaker. More than 20 years
+                  involved on international projects.
                 </p>
               </div>
             </div>
             <hr class="divider" />
             <div class="card">
-              <div class="card__img"></div>
+              <div class="card__img">
+                <img
+                  class="avatar"
+                  src="./assets/daniel-sanchez.png"
+                  alt="Daniel Sánchez"
+                />
+              </div>
               <div class="card__text">
-                <h3>Alice Hook</h3>
+                <h3>Daniel Sánchez</h3>
                 <p>
-                  Lorem ipsum dolor sit amet consectetur adipisicing elit.
-                  Rerum, amet. Quisquam numquam laudantium, unde optio libero
-                  eaque perspiciatis minus doloribus asperiores et consectetur
-                  inventore quos cumque, reiciendis officia esse .Quisquam
-                  numquam laudantium, unde optio libero eaque perspiciatis minus
-                  doloribus asperiores et consectetur inventore quos cumque,
-                  reiciendis officia esse.
+                  Technical Telecommunications Engineer, Master's Degree in Web
+                  Engineering (RIAtec) at the University of Málaga, Front-End
+                  (React) senior developer.
                 </p>
               </div>
             </div>

front/static/assets/alicia-ga.png

@@ -345,6 +345,7 @@ ul {
   justify-content: space-between;
   width: 70%;
   margin: 0 auto;
+  padding: 2% 0;
 }
 
 .instructions {
@@ -466,8 +467,16 @@ ul {
 .card__img {
   width: 10rem;
   height: 10rem;
-  background-color: var(--color-dark);
+  overflow: hidden;
+  display: flex;
+  justify-content: center;
+  align-content: center;
+}
+.avatar {
   border-radius: 50%;
+  border: 2px solid var(--color-dark);
+  max-width: 100%;
+  max-height: 100%;
 }
 
 .card__text {