2-DR1-TP3.07

mattolivr · mattolivr · commit fba5c78f2a2a · 2025-12-07T18:51:26.000-03:00
diff --git a/2-desenvolvimento-front-end/DR1-mobile-first-ui/DR1-TP3.05~3.07/src/components/Footer/Footer.css b/2-desenvolvimento-front-end/DR1-mobile-first-ui/DR1-TP3.05~3.07/src/components/Footer/Footer.css
@@ -16,9 +16,19 @@ footer {
   }
 }
 
-@media screen and (min-width: 577px) {
+@media screen and (min-width: 768px) {
   footer {
-    padding: 32px 24px;
+    padding: 32px 32px;
+
+    p {
+      font-size: 0.95rem;
+    }
+  }
+}
+
+@media screen and (min-width: 1200px) {
+  footer {
+    padding: 32px 40px;
 
     p {
       font-size: 0.95rem;
diff --git a/2-desenvolvimento-front-end/DR1-mobile-first-ui/DR1-TP3.05~3.07/src/components/Header/Header.css b/2-desenvolvimento-front-end/DR1-mobile-first-ui/DR1-TP3.05~3.07/src/components/Header/Header.css
@@ -15,9 +15,23 @@ header {
   }
 }
 
-@media screen and (min-width: 577px) {
+@media screen and (min-width: 768px) {
   header {
-    padding: 24px 32px;
+    padding: 28px 32px;
+
+    h1 {
+      font-size: 2.2rem;
+    }
+
+    p {
+      font-size: 1.05rem;
+    }
+  }
+}
+
+@media screen and (min-width: 1200px) {
+  header {
+    padding: 28px 40px;
 
     h1 {
       font-size: 2rem;
diff --git a/2-desenvolvimento-front-end/DR1-mobile-first-ui/DR1-TP3.05~3.07/src/components/Header/index.jsx b/2-desenvolvimento-front-end/DR1-mobile-first-ui/DR1-TP3.05~3.07/src/components/Header/index.jsx
@@ -3,7 +3,7 @@ import './Header.css';
 export default function Header() {
   return (
     <header>
-      <h1>Mobile First App</h1>
+      <h1>DR1 - TPs 3.05 a 3.07</h1>
     </header>
   );
 }
diff --git a/2-desenvolvimento-front-end/DR1-mobile-first-ui/DR1-TP3.05~3.07/src/components/Main/Main.css b/2-desenvolvimento-front-end/DR1-mobile-first-ui/DR1-TP3.05~3.07/src/components/Main/Main.css
@@ -61,47 +61,57 @@ main {
   }
 }
 
-@media screen and (min-width: 577px) {
+@media screen and (min-width: 768px) {
   main {
-    padding: 32px 24px;
+    padding: 40px 32px;
     max-width: 1200px;
     margin: 0 auto;
 
     section {
-      padding: 28px;
+      padding: 32px;
 
       h1 {
-        font-size: 2rem;
+        font-size: 2.2rem;
       }
 
       h2 {
-        font-size: 1.6rem;
+        font-size: 1.7rem;
       }
 
       p {
         font-size: 1.1rem;
       }
 
       ul li {
-        font-size: 1rem;
+        font-size: 1.05rem;
       }
     }
   }
 }
 
-@media screen and (min-width: 768px) {
+@media screen and (min-width: 1200px) {
   main {
-    padding: 40px 32px;
+    padding: 40px;
+    max-width: 1200px;
 
     section {
       padding: 32px;
 
       h1 {
-        font-size: 2.3rem;
+        font-size: 2rem;
       }
 
       h2 {
-        font-size: 1.8rem;
+        font-size: 1.6rem;
+      }
+
+      p {
+        font-size: 1.05rem;
+        line-height: 1.7;
+      }
+
+      ul li {
+        font-size: 1rem;
       }
     }
   }

Original file line number	Diff line number	Diff line change
`@@ -3,7 +3,7 @@ import './Header.css';`
`3`	`3`	`export default function Header() {`
`4`	`4`	`return (`
`5`	`5`	`<header>`
`6`		`- <h1>Mobile First App</h1>`
	`6`	`+ <h1>DR1 - TPs 3.05 a 3.07</h1>`
`7`	`7`	`</header>`
`8`	`8`	`);`
`9`	`9`	`}`
Original file line number	Diff line number	Diff line change
`@@ -61,47 +61,57 @@ main {`
`61`	`61`	`}`
`62`	`62`	`}`
`63`	`63`
`64`		`-@media screen and (min-width: 577px) {`
	`64`	`+@media screen and (min-width: 768px) {`
`65`	`65`	`main {`
`66`		`- padding: 32px 24px;`
	`66`	`+ padding: 40px 32px;`
`67`	`67`	`max-width: 1200px;`
`68`	`68`	`margin: 0 auto;`
`69`	`69`
`70`	`70`	`section {`
`71`		`- padding: 28px;`
	`71`	`+ padding: 32px;`
`72`	`72`
`73`	`73`	`h1 {`
`74`		`- font-size: 2rem;`
	`74`	`+ font-size: 2.2rem;`
`75`	`75`	`}`
`76`	`76`
`77`	`77`	`h2 {`
`78`		`- font-size: 1.6rem;`
	`78`	`+ font-size: 1.7rem;`
`79`	`79`	`}`
`80`	`80`
`81`	`81`	`p {`
`82`	`82`	`font-size: 1.1rem;`
`83`	`83`	`}`
`84`	`84`
`85`	`85`	`ul li {`
`86`		`- font-size: 1rem;`
	`86`	`+ font-size: 1.05rem;`
`87`	`87`	`}`
`88`	`88`	`}`
`89`	`89`	`}`
`90`	`90`	`}`
`91`	`91`
`92`		`-@media screen and (min-width: 768px) {`
	`92`	`+@media screen and (min-width: 1200px) {`
`93`	`93`	`main {`
`94`		`- padding: 40px 32px;`
	`94`	`+ padding: 40px;`
	`95`	`+ max-width: 1200px;`
`95`	`96`
`96`	`97`	`section {`
`97`	`98`	`padding: 32px;`
`98`	`99`
`99`	`100`	`h1 {`
`100`		`- font-size: 2.3rem;`
	`101`	`+ font-size: 2rem;`
`101`	`102`	`}`
`102`	`103`
`103`	`104`	`h2 {`
`104`		`- font-size: 1.8rem;`
	`105`	`+ font-size: 1.6rem;`
	`106`	`+ }`
	`107`	`+`
	`108`	`+ p {`
	`109`	`+ font-size: 1.05rem;`
	`110`	`+ line-height: 1.7;`
	`111`	`+ }`
	`112`	`+`
	`113`	`+ ul li {`
	`114`	`+ font-size: 1rem;`
`105`	`115`	`}`
`106`	`116`	`}`
`107`	`117`	`}`