fix footer

Author: lucassabreu

CHANGELOG.md

@@ -6,6 +6,9 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 
+### Fixed
+- Fixed Footer brocking when in lower widths
+
 ## [0.1.0] - 2018-02-25
 
 ### Added

src/App.css

@@ -4,6 +4,12 @@
     padding-bottom: 12rem;
 }
 
+@media (max-width: 576px) {
+    .CWSPApp {
+        padding-bottom: 16.5rem;
+    }
+}
+
 .CWSPApp header {
     font-family: Oswald, Roboto, sans-serif;
     font-size: 120%;

src/Footer.css

@@ -8,13 +8,32 @@
     left: 0;
 }
 
+#footer a {
+    color: white;
+    border: 0;
+}
+
 #footer .text {
     float: right;
-    margin: 9px 32px 0 0;
+    margin: 0 2rem 0 0;
     text-align: right;
 }
 
 #footer .white-logo {
-    width: 28px;
-    margin-top: 5px;
+    float: right;
+    height: 4.5rem;
+}
+
+@media (max-width: 576px) {
+    #footer {
+        text-align: center;
+    }
+    #footer .white-logo {
+        float: none;
+        text-align: center;
+    }
+    #footer .text {
+        text-align: center;
+        margin: 0;
+    }
 }

src/Footer.js

@@ -7,11 +7,11 @@ const Footer = () => (
     <div className="container">
       <div className="row">
         <div className="col-md-12">
-          <CoderockrWhite alt="Coderockr Logo" title="You Rock!" className="white-logo pull-right" />
+          <CoderockrWhite alt="Coderockr Logo" title="You Rock!" className="white-logo" />
           <div className="text">
             <p>
-              +55 47 3227-6359 &nbsp;&nbsp;&nbsp;
-              contato@coderockr.com
+              <a href="phone:+55 47 3227-6359">+55 47 3227-6359</a> &nbsp;&nbsp;&nbsp;
+              <a href="mail:contato@coderockr.com">contato@coderockr.com</a>
             </p>
             <p className="copyright">© 2018 Coderockr. Todos os direitos reservados. &nbsp; Joinville - SC</p>
           </div>