From 74a1f3e04edd85850b570ef84c46eb8211a1eedc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ma=C3=ABl=20Odina=20Eug=C3=A8ne?= <maodinae@gmail.com>
Date: Tue, 22 Jul 2025 17:28:21 +0200
Subject: [PATCH 1/5] news-ironhack

---
 styles/style.css | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/styles/style.css b/styles/style.css
index 9571ab1..441411d 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -175,5 +175,18 @@ header {
 .btn-blue {
   background-color: #007bff;
 }
+
+
   
 /* Write your CSS below */
+
+
+@media ( width < 760px ) {
+  
+  header nav .navbar { 
+    flex-direction: column;
+    align-items: center;
+    border: 0 0 0 0;
+  } 
+
+}
\ No newline at end of file

From c6831bc52391676dbf8ba1606ce2b89a88ec85be Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ma=C3=ABl=20Odina=20Eug=C3=A8ne?= <maodinae@gmail.com>
Date: Tue, 22 Jul 2025 18:21:49 +0200
Subject: [PATCH 2/5] Solved lab

---
 styles/style.css | 44 ++++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 42 insertions(+), 2 deletions(-)

diff --git a/styles/style.css b/styles/style.css
index 441411d..0c585bc 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -186,7 +186,47 @@ header {
   header nav .navbar { 
     flex-direction: column;
     align-items: center;
-    border: 0 0 0 0;
+
+    li {
+      width: 100%;
+      border-bottom:#ffffff solid 1px;
+    }
+
   } 
 
-}
\ No newline at end of file
+  .articles-container {
+    flex-direction: column;
+    gap: 40px;
+
+
+    .article {
+      width: 100%;
+    }
+  }
+
+  .main-article {
+    flex-direction: column;
+    align-items: center;
+    
+    .content {
+      width: 100%;
+    }
+    .image {
+      width: 100%;
+    }
+  }
+}
+  
+
+@media (width < 1024px) and ( width > 760px) {
+    
+  .navbar { 
+    justify-content: space-evenly;
+    justify-items:center;
+
+    li {
+      width: 100%;  
+    }
+  }
+}
+

From 6a2535c4b7950c6247a5bab75270cdcabeb2249d Mon Sep 17 00:00:00 2001
From: Carlos Canet <carlos@carlosca.net>
Date: Tue, 22 Jul 2025 19:20:35 +0200
Subject: [PATCH 3/5] Better selectors and prettier format

---
 styles/style.css | 67 ++++++++++++++++++++++++------------------------
 1 file changed, 34 insertions(+), 33 deletions(-)

diff --git a/styles/style.css b/styles/style.css
index 0c585bc..0796f36 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -15,7 +15,6 @@ body, h1, h2, h3, h4, h5, h6, p, ol, ul {
   font-weight: lighter;
 }
 
-
 /*  DO NOT REMOVE - Styling for the label showing the viewport width */
 .viewport-dimensions {
   position: fixed;
@@ -175,58 +174,60 @@ header {
 .btn-blue {
   background-color: #007bff;
 }
-
-
   
 /* Write your CSS below */
-
-
-@media ( width < 760px ) {
-  
-  header nav .navbar { 
+@media (width < 760px) {
+  header nav .navbar {
     flex-direction: column;
     align-items: center;
 
     li {
       width: 100%;
-      border-bottom:#ffffff solid 1px;
+      border-bottom: #ffffff solid 1px;
     }
+  }
 
-  } 
+  main {
+    .articles-container {
+      flex-direction: column;
+      gap: 40px;
 
-  .articles-container {
-    flex-direction: column;
-    gap: 40px;
+      .article {
+        width: 100%;
+      }
+    }
 
+    .main-article {
+      flex-direction: column;
+      align-items: center;
 
-    .article {
-      width: 100%;
+      .content {
+        width: 100%;
+      }
+      .image {
+        width: 100%;
+      }
     }
   }
+}
 
-  .main-article {
-    flex-direction: column;
-    align-items: center;
-    
-    .content {
-      width: 100%;
-    }
-    .image {
+@media (width < 1024px) and (width > 760px) {
+  header nav .navbar {
+    justify-content: space-evenly;
+    justify-items: center;
+
+    li {
       width: 100%;
     }
   }
-}
-  
 
-@media (width < 1024px) and ( width > 760px) {
-    
-  .navbar { 
-    justify-content: space-evenly;
-    justify-items:center;
+  main .articles-container {
+    flex-direction: row;
+    flex-wrap: wrap;
+    justify-content: space-between;
 
-    li {
-      width: 100%;  
+    .article {
+      width: 45%;
     }
   }
 }
-

From d051708709d326cf175cac063d8f487786b6ebb7 Mon Sep 17 00:00:00 2001
From: Carlos Canet <carlos@carlosca.net>
Date: Tue, 22 Jul 2025 19:23:34 +0200
Subject: [PATCH 4/5] Iteration 2: completed

---
 styles/style.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/styles/style.css b/styles/style.css
index 0796f36..a0c9aea 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -225,6 +225,7 @@ header {
     flex-direction: row;
     flex-wrap: wrap;
     justify-content: space-between;
+    gap: 40px;
 
     .article {
       width: 45%;

From 7735c8d9ce9e4e2f22523e9000aa1c8b52294a3a Mon Sep 17 00:00:00 2001
From: Carlos Canet <carlos@carlosca.net>
Date: Tue, 22 Jul 2025 19:29:46 +0200
Subject: [PATCH 5/5] Bonus: Iteration 3: done!

---
 index.html       |  3 +++
 styles/style.css | 17 +++++++++++++++++
 2 files changed, 20 insertions(+)

diff --git a/index.html b/index.html
index 1b8846b..0cda3a0 100644
--- a/index.html
+++ b/index.html
@@ -16,6 +16,9 @@ <h1 class="newspaper-name">Ironhack News</h1>
           <li><a href="#">Tech</a></li>
           <li><a href="#">Sports</a></li>
         </ul>
+        <div class="hamburguer-menu">
+          <img src="./images/menu-icon.png" alt="Hamburguer menu icon" />
+        </div>
       </nav>
     </header>
 
diff --git a/styles/style.css b/styles/style.css
index a0c9aea..25b025a 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -232,3 +232,20 @@ header {
     }
   }
 }
+
+@media (width < 480px){
+  header nav {
+    .navbar{
+      display: none
+    }
+
+    .hamburguer-menu {
+      display: block;
+    }    
+  } 
+}
+
+.hamburguer-menu {
+  display: none;
+  padding: 5px
+}
\ No newline at end of file