Revert "optimise footer space and layout"

This reverts commit 562659c20e4459db17a7eb9403915d636a3f3425.

diff --git a/config.yml b/config.yml
index 8080600db715268a2009a2dd4c5f4b60d817aa8a..773c82edefdb80859429a3f7add4de2da89cb7f2 100644 (file)
--- a/config.yml
+++ b/config.yml
@@ -5,7 +5,7 @@ DESCRIPTION: "freenode.net - Supporting Free and Open Source Software Communitie
 GITHUB_URL: "https://github.com/freenode/web-7.0"
 SOCIAL:
   - name: Google+
-    icon: google-plus-official
+    icon: google-plus
     link: 'https://google.com/+freenode'
   - name: Twitter
     icon: twitter

diff --git a/static/css/style.css b/static/css/style.css
index e9fcb4e2f8a1dfe67a96f7d3ff48728d407b80e4..576f786aa252385dcc3bc68ad5c6f00ab1aa898c 100644 (file)
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -590,7 +590,7 @@ blockquote {
 .footerchild {
     margin: 0 2em;
     margin-top: .5em;
-    flex-grow: 0;
+    flex-grow: 1;
     flex-shrink: 0;
 }
 
@@ -681,20 +681,21 @@ footer a:hover {
 footer.copyright {
     display: flex;
     flex-wrap: wrap;
-    justify-content: center;
+    justify-content: space-between;
     background: var(--copyright-bg);
     min-height: 1.5rem;
     color: var(--copyright-text-color);
-    padding: .1em;
+    padding-left: .5em;
+    padding-right: .5em;
     overflow: hidden;
 }
 
 footer.copyright div {
+    display: flex;
     align-items: center;
     height: 1.6rem;
     line-height: 1.6rem;
     vertical-align: top;
-    margin-right: 6px;
 }
 
 .copyright * {

diff --git a/templates/footer.html b/templates/footer.html
index d9905b1e5beaae021ecb576943b7e56b3c6e4d8c..3de6f1401907bae507d6833add7dd822fa0cd4da 100644 (file)
--- a/templates/footer.html
+++ b/templates/footer.html
@@ -24,17 +24,37 @@
         </ul>
     </div>
     {% endfor %}
+    <div></div>
+    <div class="footerchild">
+        <div class="footer-push">
+        <h2>Social Media</h2>
+        <ul>
+            {%- for link in config.SOCIAL %}
+            <li>
+                <a href="{{ link.link }}" target="_blank">
+                    <i class="fa fa-{{ link.icon }} fa-fw"></i> <span class="hdn">{{ link.name }}</span></a>
+            </li>
+            {%- endfor %}
+            <li>
+                <a href="https://www.privateinternetaccess.com/pages/buy-vpn/freend/" target="_blank">
+                    <img alt="PIA" class="fa-fw" src="{{ url_for("static/img/logos/pia-robot-original.svg") }}">
+                <span class="hdn">Private Internet Access</span></a>
+            </li>
+        </ul>
+        </div>
+    </div>
     </div>
 </footer>
 <footer class="copyright">
-    <div>{{ config.COPYRIGHT|safe }}</div>
     <div>
-        {%- if config.GITHUB_URL is defined %}
-        <a href="{{ config.GITHUB_URL }}" target="_blank" alt="Github"><i class="fa fa-github"></i></a>
-        {% endif -%}
-        <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/" target="_blank" alt="Creative Commons"><i class="fa fa-creative-commons"></i></a>
-        {%- for link in config.SOCIAL %}
-        <a href="{{ link.link }}" target="_blank" alt="{{ link.name }}"><i class="fa fa-{{ link.icon }}"></i></a>
-        {% endfor %}
+    {%- if config.GITHUB_URL is defined %}
+    <a href="{{ config.GITHUB_URL }}"><i class="fa fa-github fa-lg"></i></a>&nbsp;
+    {% endif -%}
+    <a class="copyright" href="https://creativecommons.org/licenses/by-nc-sa/4.0/" target= "_blank">
+        <img alt="CC by-nc-sa" src="{{ url_for("static/img/by-nc-sa.svg") }}">
+    </a>
+    </div>
+    <div>
+        {{ config.COPYRIGHT|safe }}
     </div>
 </footer>