made changes to CCS rules; header nav ul li a, hero, hero-cta, and se…

…ction-title to add media queries
mmorua · Nov 10, 2021 · 56fade8 · 56fade8
1 parent ea9d6a5
commit 56fade8
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 4 deletions.
diff --git a/assets/css/style.css b/assets/css/style.css
@@ -44,7 +44,7 @@ header nav ul {
 }
 
 header nav ul li a {
-  margin: 0 30px;
+  padding: 10px 15px;
   font-weight: lighter;
   font-size: 1.55vw;
 }
@@ -85,6 +85,7 @@ section {
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
+  align-items: flex-start;
 }
 
 .hero-cta {
@@ -93,7 +94,7 @@ section {
   margin: 3.5%;
   color: #fff;
   font-size: 18px;
-  line-height: 1.3;
+  line-height: 1.2;
 }
 
 .hero-cta h2 {
@@ -206,7 +207,7 @@ section {
 }
 
 .section-title {
-  font-size: 55px;
+  font-size: 48px;
   color: #024e76;
   border-bottom: 3px solid;
   padding-bottom: 20px;
@@ -342,4 +343,19 @@ section {
 /* flex row class */
 .flex-row {
   display: flex;
-}
+}
+/* flex row class end */
+
+/* media query start */
+@media screen and (max-width: 768px) {
+  header h1 {
+    font-size: 80px;
+  }
+}
+
+@media screen and (max-width: 575px) {
+  header h1 {
+    font-size: 100px;
+  }
+}
+/* media query end */
diff --git a/index.html b/index.html
@@ -3,6 +3,7 @@
 
 <head>
   <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, intial-scale=1.0">
   <title>Run Buddy</title>
   <link rel="stylesheet" href="./assets/css/style.css" />
 </head>

diff --git a/privacy-policy.html b/privacy-policy.html
@@ -2,6 +2,7 @@
 <html lang="en">
     <head>
         <meta charset= "UTF-8" />
+        <meta name="viewport" width="device-width, initial-scale=1.0">
         <title>Privacy Policy - Run Buddy</title>
         <link rel="stylesheet" href="./assets/css/style.css" />
         <link rel="stylesheet" href="./assets/css/secondary-styles.css" />