From 084675b8406ae38c7c2234d84b910c03fa106ad9 Mon Sep 17 00:00:00 2001
From: Alisha Mohanty <alishamohanty1416@gmail.com>
Date: Mar 01 2019 07:54:55 +0000
Subject: Improving the design of Footer


---

diff --git a/assets/css/custom.css b/assets/css/custom.css
index 43cb09a..c09c162 100644
--- a/assets/css/custom.css
+++ b/assets/css/custom.css
@@ -40,12 +40,11 @@ aside .sidebar .logo {
     margin: 30px 0;
 }
 
-main {
-    margin-bottom: 30px;
-}
-
 footer {
-    text-align: right;
+    text-align: center;
+    padding:0 7vw;
+    box-shadow: 0px -4px 5px 0px rgba(60, 110, 180, 0.27);
+    background-color: #3c6eb421;
 }
 
 fieldset {
@@ -101,10 +100,6 @@ blockquote {
     display: none;
 }
 
-.text-center.col-md-10{
-    padding: 0;
-}
-
 #div_id_hp {
     display: none;
 }
@@ -224,4 +219,31 @@ blockquote {
     aside .sidebar .logo {
         width: 100%;
     }
-}
\ No newline at end of file
+}
+.wearefedora {
+    color: #3c6eb4;
+    font-weight: 600;
+    font-size:2.3rem;
+}
+.footer-msg {
+    padding-top: 0.5rem;
+}
+.footer-msg p {
+  font-size: 2rem;
+}
+.footer-msg a {
+    font-weight: 600;
+}
+.row p {
+    font-size: 2rem;
+}
+.footer-share p{
+    font-size: 2rem;
+}
+.socio-buttons {
+    padding: 1rem;
+    font-size: 2rem;
+}
+.socio-buttons a {
+    padding: 0.9rem;
+}
diff --git a/templates/base.html b/templates/base.html
index deab924..df27945 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -69,26 +69,28 @@
                     {% block content %}{% endblock %}
                 </div>
             </div>
-            <footer class="text-center col-md-10"><small>
-                <hr>
-                {% block footer %}
-                {% include "follow.html" %}
-                <br>
-                {% endblock %}
-                Fedora Happiness Packets is a fork of <a href="https://github.com/mxsasha/happinesspackets/">Happiness Packets</a> and part of GSoC 2018.
-                <br>
-                Need help? <a href="mailto:fedora.happinesspackets@gmail.com">fedora.happinesspackets@gmail.com</a>
-                <img class="emoji" src="{% static 'images/emoji/loveletter.png' %}" alt="💌" title="Love letter" aria-label="Emoji: Love letter" style="vertical-align: text-bottom">
-                <br>
-                Got feedback? File an issue <a href="https://pagure.io/fedora-commops/fedora-happiness-packets/new_issue">here</a>
-                <br>
-                <a href="https://www.facebook.com/TheFedoraProject"><i class="fab fa-facebook-f fa-lg"></i></a>
-                &nbsp;
-                <a href="https://twitter.com/fedora"><i class="fab fa-twitter fa-lg"></i></a>
-                &nbsp;
-                <a href="https://plus.google.com/112917221531140868607"><i class="fab fa-google-plus-g fa-lg"></i></a>
-            </small></footer>
         </div>
-    </main>
-</body>
+            <footer class="footer">
+              <small>
+                  <hr>
+                  {% block footer %}
+                  {% include "follow.html" %}
+                  <div class="footer-msg">
+                    {% endblock %}
+                    Fedora Happiness Packets is a fork of <a href="https://github.com/mxsasha/happinesspackets/">Happiness Packets</a> and part of GSoC 2018.
+                    <br>
+                    Need help? <a href="mailto:fedora.happinesspackets@gmail.com">fedora.happinesspackets@gmail.com</a>
+                    <img class="emoji" src="{% static 'images/emoji/loveletter.png' %}" alt="💌" title="Love letter" aria-label="Emoji: Love letter" style="vertical-align: text-bottom">
+                    <br>
+                    Got feedback? File an issue <a href="https://pagure.io/fedora-commops/fedora-happiness-packets/new_issue">here</a>
+                  </div>
+                  <div class="socio-buttons">
+                  <a href="https://www.facebook.com/TheFedoraProject"><i class="fab fa-facebook-f fa-lg"></i></a>
+                  <a href="https://twitter.com/fedora"><i class="fab fa-twitter fa-lg"></i></a>
+                  <a href="https://plus.google.com/112917221531140868607"><i class="fab fa-google-plus-g fa-lg"></i></a>
+                </div>
+              </small>
+            </footer>
+        </main>
+    </body>
 </html>
diff --git a/templates/follow.html b/templates/follow.html
index 4e05fd9..87ed4e6 100644
--- a/templates/follow.html
+++ b/templates/follow.html
@@ -1,8 +1,11 @@
+<div class="footer-msg">
+	<p>Share <span class="wearefedora">#WeAreFedora </span> </p>
+</div>
 <div class="row">
-	<a class="g-interactivepost sharebutton google" data-contenturl="https://happinesspackets.fedorainfracloud.org/" data-clientid="427442962349-biuc5ks65luss5h3v5oqtj15jigaqoib.apps.googleusercontent.com" data-cookiepolicy="single_host_origin" data-prefilltext="#WeAreFedora" data-calltoactionurl="http://plus.google.com/pages/create"><i class="fab fa-google-plus-g fa-lg"></i> Share #WeAreFedora</a>
+	<a class="g-interactivepost sharebutton google" data-contenturl="https://happinesspackets.fedorainfracloud.org/" data-clientid="427442962349-biuc5ks65luss5h3v5oqtj15jigaqoib.apps.googleusercontent.com" data-cookiepolicy="single_host_origin" data-prefilltext="#WeAreFedora" data-calltoactionurl="http://plus.google.com/pages/create"><i class="fab fa-google-plus-g fa-lg"></i> Share </a>
 	<script type="text/javascript">(function() {var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/client:plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);})();</script>
-	<a id="fb" class="sharebutton"><i class="fab fa-facebook fa-lg"></i> Share #WeAreFedora</a>
+	<a id="fb" class="sharebutton"><i class="fab fa-facebook fa-lg"></i> Share </a>
 	<script>document.getElementById('fb').onclick = function() {FB.ui({method: 'share', mobile_iframe: true, hashtag: '#WeAreFedora', href: 'https://happinesspackets.fedorainfracloud.org/',}, function(response){});}</script>
-	<a href="https://twitter.com/intent/tweet?button_hashtag=WeAreFedora" class="sharebutton twitter" data-size="large" data-dnt="true"><i class="fab fa-twitter fa-lg"></i>Tweet #WeAreFedora</a>
+	<a href="https://twitter.com/intent/tweet?button_hashtag=WeAreFedora" class="sharebutton twitter" data-size="large" data-dnt="true"><i class="fab fa-twitter fa-lg"></i> Tweet </a>
 	<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
 </div>