CodelyTV · ismanapa · Sep 15, 2021 · Aug 25, 2021 · Aug 25, 2021 · Aug 26, 2021
diff --git a/43-responsive-layout/.gitignore b/43-responsive-layout/.gitignore
@@ -0,0 +1,3 @@
+node_modules
+css
+dist
diff --git a/43-responsive-layout/.stylelintrc.json b/43-responsive-layout/.stylelintrc.json
@@ -0,0 +1,9 @@
+
+{
+  "plugins": ["stylelint-scss"],
+  "extends": ["stylelint-config-standard"],
+  "rules": {
+    "at-rule-no-unknown": null,
+    "scss/at-rule-no-unknown": true
+  }
+}
diff --git a/43-responsive-layout/index.html b/43-responsive-layout/index.html
@@ -0,0 +1,100 @@
+<!DOCTYPE html>
+<html lang="es">
+
+<head>
+  <meta charset="utf-8" />
+  <meta name="referrer" content="no-referrer-when-downgrade" />
+  <title>Café con Codely News</title>
+  <meta name="description" content="Café con Codely news" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <link href="css/index.css" rel="stylesheet" type="text/css" media="all" />
+</head>
+
+<body>
+  <header>
+    <h1>☕ Café con Codely News</h1>
+  </header>
+  <main class="container">
+    <section class="menu">
+      <ul>
+        <li>
+          <a target="_blank" href="https://codely.tv/">Codely TV</a>
+        </li>
+        <li>
+          <a target="_blank" href="https://twitter.com/codelytv">Twitter</a>
+        </li>
+        <li>
+          <a target="_blank" href="https://www.youtube.com/channel/UC9IKtxn9AIGelnYmwYr0Lxw">Youtube</a>
+        </li>
+        <li>
+          <a target="_blank" href="https://www.twitch.tv/codelytv">Twitch</a>
+        </li>
+      </ul>
+    </section>
+    <div class="gallery">
+      <article class="card">
+        <div class="card__img">
+          <img alt="Captura del programa GameMaker" src="https://i.blogs.es/a52d06/gamemaker/1366_2000.jpg" />
+        </div>
+
+        <h4 class="card__title">
+          <a href="https://www.genbeta.com/desarrollo/motor-creacion-videojuegos-gamemaker-ofrece-version-gratuita-limite-tiempo-anuncia-su-llegada-a-linux?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+genbeta+%28Genbeta%29"
+            target="_blank">
+            Actualización en GameMaker
+          </a>
+        </h4>
+        <p>
+          El motor de creación de videojuegos GameMaker ofrece una versión gratuita sin límite de tiempo y anuncia su
+          llegada a Linux
+        </p>
+      </article>
+      <article class="card">
+        <div class="card__img">
+          <img alt="Captura de un tema de VSCode con colores ocuros" src="https://i.redd.it/unyodjbxmqs21.png" />
+        </div>
+
+        <h4 class="card__title">
+          <a href="https://www.reddit.com/r/vscode/comments/be2qr3/for_those_of_you_who_didnt_like_my_light_theme/"
+            target="_blank">
+            Nuevo tema oscuro de VS Code
+          </a>
+        </h4>
+        <p>El nuevo tema que le gusta mucho a Rafa.</p>
+      </article>
+      <article class="card">
+        <div class="card__img">
+          <img alt="Captura de la home page de Babel"
+            src="https://pbs.twimg.com/profile_banners/2958823554/1491134069/1500x500" />
+        </div>
+
+        <h4 class="card__title">
+          <a href="https://babeljs.io/blog/2021/07/26/7.15.0" target="_blank">
+            Nueva versión de Babel: 7.15.0
+          </a>
+        </h4>
+        <p>
+          La nueva versión incluye cosas molonas como "top level await", "TypeScript const enums supports" y "Hash-style
+          pipeline operator".
+        </p>
+      </article>
+      <article class="card">
+        <div class="card__img">
+          <img alt="Imagen del nuevo DNI 4.0" src="https://i.blogs.es/5d012b/dni-4.0/1366_2000.jpg" />
+        </div>
+
+        <h4 class="card__title">
+          <a href="https://www.xataka.com/empresas-y-economia/dni-4-0-entra-hoy-vigor-esta-aqui-nuevo-formato-europeo-que-se-integrara-movil"
+            target="_blank">
+            Llega el DNI 4.0
+          </a>
+        </h4>
+        <p>
+
+          El DNI 4.0 entra hoy en vigor: ya está aquí el nuevo formato europeo que se integrará en el móvil
+        </p>
+      </article>
+    </div>
+  </main>
+</body>
+
+</html>