added responsive assignment

maa17019 · Feb 17, 2020 · 69894ee · 69894ee
1 parent 83ed118
commit 69894ee
Show file tree

Hide file tree

Showing 21 changed files with 665 additions and 18 deletions.
diff --git a/.DS_Store b/.DS_Store
diff --git a/Flexbox Micro-layouts 2/Flexbox Micro-layouts and Patterns.pdf b/Flexbox Micro-layouts 2/Flexbox Micro-layouts and Patterns.pdf
diff --git a/Flexbox Micro-layouts 2/inbox-solid.svg b/Flexbox Micro-layouts 2/inbox-solid.svg
diff --git a/Flexbox Micro-layouts 2/smile-regular.svg b/Flexbox Micro-layouts 2/smile-regular.svg
diff --git a/Screen Shot 2020-02-10 at 5.14.03 PM.png b/Screen Shot 2020-02-10 at 5.14.03 PM.png
diff --git a/css/basic-site.css b/css/basic-site.css
@@ -9,28 +9,59 @@ html, body {
 
   @media (min-width: 320px){
      div .text{
-         top: 70px;
+         top: 50px;
          font-size: 50px;
      }
+     .me img{
+         width: 300px;
+     }
+    p{
+        width: 400px;
+    }
 }
 
 @media (min-width: 480px){
     div .text{
-        top: 60px;
+        top: 50px;
         font-size: 70px;
     }
+    .me img{
+        width: 350px;
+    }
 }
 @media (min-width: 620px){
     div .text{
         top: 50px;
         font-size: 80px;
     }
+    .me img{
+        width: 360px;
+    }
+
 }
 @media (min-width: 768px){
     div .text{
         top: 50px;
         font-size: 95px;
     }
+    .me img{
+        width: 370px;
+
+    }
+    p{
+        width: 500px;
+    }
+}
+@media (min-width: 890px){
+    .me img{
+        width: 380px;
+
+    }
+}
+@media (min-width: 900px){
+
+
+
 }
     img{
     display: block;
@@ -66,24 +97,27 @@ h2{
 
 }
 .me img{
-    width: 300px;
+    min-width: 300px;
+    max-width: 400px;
     height: auto;
     border-radius: 50%;
-    margin-top: 15px;
+    margin-top: 0;
-    padding: 5px;
+    padding: 25px 20px;
     display: block;
     margin-left: auto;
     margin-right: auto;
+
 
 }
 
 p{
+    margin-top: 0;
     font-family: 'Open Sans', sans-serif;
     font-weight: bold;
     max-width: 500px;
-    min-width: 350px;
+    min-width: 300px;
-    width: 50%;
     text-indent: 5%;
+    line-height: normal;
 }
 .one{
     display: flex;
@@ -103,21 +137,19 @@ h3{
     justify-content: center;
 
 }
-
+.three{
+    display: flex;
+    justify-content: center;
+}
 ul li{
     font-family: 'Open Sans', sans-serif;
     font-weight: bold;
     font-size: 19px;
-    width: 50%;
+
 
 }
 hr{
-    width: 50%;
+    width: 90%;
-}
-.three{
-    display: flex;
-    justify-content: center;
-
 }
 a:visited{
     color: black;
@@ -133,7 +165,6 @@ a{
     text-decoration: none;
 }
 a:before{
-    content: "";
   position: absolute;
   width: 100%;
   height: 2px;