Merge pull request #31 from MabelM1/feature/update-hello-there-sizes

mm1123452 · Jul 1, 2020 · a84cb4d · a84cb4d
2 parents 2c855fa + f6de8e9
commit a84cb4d
Show file tree

Hide file tree

Showing 3 changed files with 25 additions and 11 deletions.
diff --git a/blocks/hello-there/__img/hello-there__img.css b/blocks/hello-there/__img/hello-there__img.css
@@ -1,6 +1,13 @@
 .hello-there__img {
-  width: 188px;
-  margin-top: 18px;
+  width: 100%;
+  margin-top: 8px;
+}
+
+@media (min-width: 768px) {
+  .hello-there__img {
+    width: 188px;
+    margin-top: 18px;
+  }
 }
 
 @media (min-width: 1024px) {

diff --git a/blocks/hello-there/hello-there.css b/blocks/hello-there/hello-there.css
@@ -4,17 +4,22 @@
 @import url(./__links/hello-there__links.css);
 
 .hello-there {
-  padding-top: 68px;
-  margin: 0 40px;
-  display: grid;
-  grid-template-columns: auto auto;
-  grid-template-rows: auto 235px auto;
-  column-gap: 30px;
+  padding: 50px 16px 0;
   border-top: 1.7px solid #223d46;
 }
 
-.hello-there .content-title {
-  grid-column: span 2;
+@media (min-width: 768px) {
+  .hello-there {
+    grid-template-columns: auto auto;
+    grid-template-rows: auto 235px auto;
+    column-gap: 30px;
+    display: grid;
+    padding: 68px 40px 0;
+  }
+
+  .hello-there .content-title {
+    grid-column: span 2;
+  }
 }
 
 @media (min-width: 1024px) {

diff --git a/index.html b/index.html
@@ -223,7 +223,9 @@ <h2 class="content-title">hello there</h2>
         <p class="hello-there__links">
           <a href="mailto:[email protected]" class="link"
             >Email</a
-          >/<a
+          >
+          /
+          <a
             href="https://www.instagram.com/outofboundssupport/"
             target="_blank"
             class="link"