Merge branch 'develop' of github.com:code4romania/votong into develop

code4romania · Nov 10, 2021 · ca3918c · ca3918c
2 parents ab7d24f + c53a4fb
commit ca3918c
Show file tree

Hide file tree

Showing 5 changed files with 73 additions and 61 deletions.
diff --git a/civil_society_vote/hub/templates/base.html b/civil_society_vote/hub/templates/base.html
@@ -19,7 +19,7 @@
     {% block meta_tags %}{% with title="VotONG" %}{% meta_tags %}{% endwith %}{% endblock %}
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Titillium+Web:400,600,700&subset=latin-ext">
     <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600,300" rel="stylesheet" type="text/css">
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.8.0/css/bulma.min.css">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.0/css/bulma.min.css">
     <link rel="stylesheet" href="{% static "css/bulma-collapsible.min.css" %}">
     <link rel="stylesheet" href="{% static "css/colors.css" %}">
     <link rel="stylesheet" href="{% static "css/sizing.css" %}">

diff --git a/civil_society_vote/hub/templates/footer.html b/civil_society_vote/hub/templates/footer.html
@@ -3,49 +3,51 @@
 
 <footer>
     <div class="container">
-        <div class="branding">
-            <span>Soluție proiectată, dezvoltată și administrată pro-bono de:</span>
-            <a href="https://code4.ro/ro/" target="_blank" rel="noopener noreferrer">
-                <img class="code4Ro-logo" src="{% static "images/code4romania-gray.svg" %}" alt="Code for Romania" />
-            </a>
-        </div>
+        <div class="columns mr-0">
+            <div class="column is-auto">
+                <div class="branding">
+                    <div class="mb-3">
+                        O soluție 
+                    </div>
+
+                    <a href="https://code4.ro/ro/" target="_blank" rel="noopener noreferrer" class="mb-3">
+                        <img class="code4Ro-logo" src="{% static "images/code4romania-black.svg" %}" alt="Code for Romania" />
+                    </a>
 
-        <ul id="footer-links">
-            <li><a href="{% url 'about' %}">{% trans "About VotONG" %}</a>
-            <li><a href="{% url 'platform_rules' %}">{% trans "Platform rules" %}</a>
-            <li><a href="{% url 'cookies'%}">{% trans "Privacy Policy" %}</a>
-            <li><a href="{% url 'terms'%}">{% trans "Terms and conditions" %}</a>
-            <li>
-                <a href="#" class="button is-primary">{% trans "Get Involved" %}</a>
-            </li>
-        </ul>
+                    <div class="mb-5 has-text-left">
+                        Organizație independentă, non-partizană, apolitică, neguvernamentală.
+                    </div>
 
-        <p>
-            Daca vrei să iei legătura cu noi o poți face pe e-mail la adresa:  <a href="mailto:[email protected]">[email protected]</a>
-        </p>
+                    <div>
+                        &copy; 2021 Code for Romania.
+                    </div>
+                </div>
+            </div>
 
-        <ul id="footer-social">
-            <li>
-                <a href="https://www.facebook.com/code4romania/">
-                    <img src="{% static "images/social/facebook.svg" %}" alt="Facebook" />
-                </a>
-            </li>
-            <li>
-                <a href="https://twitter.com/Code4Romania">
-                    <img src="{% static "images/social/twitter.svg" %}" alt="Twitter" />
-                </a>
-            </li>
-            <li>
-                <a href="https://github.com/code4romania/votong/">
-                    <img src="{% static "images/social/github.svg" %}" alt="GitHub repo" />
-                </a>
-            </li>
-            <li>
-                <a href="https://www.linkedin.com/company/code4romania/">
-                    <img src="{% static "images/social/linkedin.svg" %}" alt="LinkedIn" />
-                </a>
-            </li>
-        </ul>
+            <div class="column is-3 mobile-spacing">
+                <h4 class="pb-3">
+                    <strong>LINKURI UTILE</strong>
+                </h4>
+                <ul id="footer-links">
+                    <li><a href="{% url 'about' %}">{% trans "About VotONG" %}</a>
+                    <li><a href="{% url 'platform_rules' %}">{% trans "Platform rules" %}</a>
+                    <li><a href="{% url 'cookies'%}">{% trans "Privacy Policy" %}</a>
+                    <li><a href="{% url 'terms'%}">{% trans "Terms and conditions" %}</a>
+                </ul>
+            </div>
+
+            <div class="column is-3 mobile-spacing">
+                <h4 class="pb-3">
+                    <strong>CONTACTEAZĂ-NE</strong>
+                </h4>
+                <ul id="footer-links">
+                    <li><a href="https://www.facebook.com/code4romania/">Facebook</a>
+                    <li><a href="https://twitter.com/Code4Romania">Twitter</a>
+                    <li><a href="https://github.com/code4romania/votong/">GitHub</a>
+                    <li><a href="https://www.linkedin.com/company/code4romania/">LinkedIn</a>
+                </ul>
+            </div>
+        </div>
     </div>
 </footer>
 

diff --git a/civil_society_vote/hub/templates/header.html b/civil_society_vote/hub/templates/header.html
@@ -3,6 +3,15 @@
 {% load hub_tags %}
 
 <div class="navbar-container">
+    <div class="h-padded-wrapper columns has-background-grey-lighter pt-3 mr-0">
+        <div class="column is-12 px-6 is-flex is-align-content-center">
+            <img src="{% static "images/code4romania-black.svg" %}" alt="code-4-ro" width="80"/>
+            <strong class="px-5">
+                O soluție Code for Romania.
+                <a href="https://code4.ro/ro/putem">Află mai multe</a>
+            </strong>
+        </div>
+    </div>
     <div class="h-padded-wrapper">
         <div class="container border-b">
             <nav class="navbar" role="navigation" aria-label="main navigation">

diff --git a/civil_society_vote/static/css/footer.css b/civil_society_vote/static/css/footer.css
@@ -1,35 +1,37 @@
 footer {
-    background-color: var(--black);
+    background-color: var(--lightest-gray);
     padding-top: 40px;
     padding-bottom: 60px;
-    color: #fff;
+    color: black;
     text-align: center;
 }
 
 footer a {
-    color: #fff;
+    color: black;
 }
 
 footer a:not(.button):hover {
-    color: #fff;
+    color: black;
     text-decoration: underline;
 }
 
 footer .branding {
     display: flex;
     justify-content: center;
-    align-items: center;
+    align-items: flex-start;
+    flex-direction: column;
+    max-width: 280px;
+    margin-left: auto;
+    margin-right: auto;
 }
 
-footer .branding > span {
-    display: inline-block;
-    font-size: 10px;
-    width: 200px;
-    text-align: right;
+@media screen and (max-width: 768px){
+    footer .mobile-spacing {
+        margin-top: 32px;
+    }
 }
 
 footer .branding a {
-    margin-left: 15px;
     display: inline-block;
     margin-top: 5px;
 }
@@ -40,19 +42,19 @@ footer .branding .code4Ro-logo {
 
 #footer-links {
   display: flex;
-  flex-direction: row;
-  padding: 32px 0;
-  border-bottom: 1px solid #fff;
-  margin: 35px 0;
-  justify-content: space-evenly;
-  align-items: center;
+  flex-direction: column;
 }
 
 #footer-links li a:not(.button) {
-    color: #fff;
+    color: black;
     text-decoration: underline;
 }
 
+#footer-links li {
+    padding-top: 5px;
+    padding-bottom: 5px;
+}
+
 @media (max-width: 768px){
   #footer-links {
     flex-direction: column;
@@ -61,8 +63,6 @@ footer .branding .code4Ro-logo {
   #footer-links li {
     padding: 10px;
   }
-
-
 }
 
 

diff --git a/civil_society_vote/static/images/code4romania-black.svg b/civil_society_vote/static/images/code4romania-black.svg