feat: responding to small laptops

zangeronimo · zangeronimo · commit ae0ad075901d · 2022-12-04T06:54:30.000-03:00
diff --git a/starter/07-Omnifood-Desktop/css/queries.css b/starter/07-Omnifood-Desktop/css/queries.css
@@ -0,0 +1,20 @@
+/* rem and em do NOT depend on html font-size in media queries!
+Instead, 1rem = 1em = 16px */
+
+/*************************************/
+/* BELOW 1344px (Smaller desktop) */
+/*************************************/
+
+@media (max-width: 84em) {
+  .hero {
+    max-width: 120rem;
+  }
+
+  .heading-primary {
+    font-size: 4.4rem;
+  }
+
+  .gallery {
+    grid-template-columns: repeat(2, 1fr);
+  }
+}
diff --git a/starter/07-Omnifood-Desktop/index.html b/starter/07-Omnifood-Desktop/index.html
@@ -15,6 +15,7 @@
 
     <link rel="stylesheet" href="css/general.css" />
     <link rel="stylesheet" href="css/style.css" />
+    <link rel="stylesheet" href="css/queries.css" />
   </head>
   <body>
     <header class="header">
