Merge pull request #6980 from drummer83/clean-footer

Cleaner and consistent design of front-end footer

app/assets/stylesheets/darkswarm/footer.scss

@@ -4,8 +4,8 @@
 
 footer {
   .row {
-    p a {
-      font-size: 0.875rem;
+    p {
+      font-size: 1rem;
     }
 
     a, a * {
@@ -107,9 +107,14 @@ footer {
         color: rgba($disabled-med, 0.35);
       }
 
+      p.text-big {
+        font-size: 1.5rem;
+        font-weight: 300;
+      }
+
       .social-icons {
-        margin-bottom: 0.25rem;
-        margin-top: 0.75rem;
+        margin-bottom: 0.9rem;
+        padding-top: 0.1rem;
 
         a {
           i {
@@ -128,5 +133,9 @@ footer {
         }
       }
     }
+
+    .legal p {
+      font-size: 0.875rem;
+    }
   }
 }

app/helpers/footer_links_helper.rb

@@ -15,4 +15,10 @@ module FooterLinksHelper
              target: '_blank',
              rel: 'noopener' )
   end
+
+  def show_social_icons?
+    ContentConfig.footer_facebook_url.present? || ContentConfig.footer_twitter_url.present? ||
+      ContentConfig.footer_instagram_url.present? || ContentConfig.footer_linkedin_url.present? ||
+      ContentConfig.footer_googleplus_url.present? || ContentConfig.footer_pinterest_url.present?
+  end
 end

app/views/shared/_footer.html.haml

@@ -31,25 +31,26 @@
         // This is the instance-managed set of links:
         %h4
           = t '.footer_contact_headline'
-        %p.social-icons
-          - if ContentConfig.footer_facebook_url.present?
-            %a{href: ContentConfig.footer_facebook_url}
-              %i.ofn-i_044-facebook
-          - if ContentConfig.footer_twitter_url.present?
-            %a{href: ContentConfig.footer_twitter_url}
-              %i.ofn-i_041-twitter
-          - if ContentConfig.footer_instagram_url.present?
-            %a{href: ContentConfig.footer_instagram_url}
-              %i.ofn-i_043-instagram
-          - if ContentConfig.footer_linkedin_url.present?
-            %a{href: ContentConfig.footer_linkedin_url}
-              %i.ofn-i_042-linkedin
-          - if ContentConfig.footer_googleplus_url.present?
-            %a{href: ContentConfig.footer_googleplus_url}
-              %i.ofn-i_046-g
-          - if ContentConfig.footer_pinterest_url.present?
-            %a{href: ContentConfig.footer_pinterest_url}
-              %i.ofn-i_045-pintrest
+        - if show_social_icons?
+          %p.social-icons
+            - if ContentConfig.footer_facebook_url.present?
+              %a{href: ContentConfig.footer_facebook_url}
+                %i.ofn-i_044-facebook
+            - if ContentConfig.footer_twitter_url.present?
+              %a{href: ContentConfig.footer_twitter_url}
+                %i.ofn-i_041-twitter
+            - if ContentConfig.footer_instagram_url.present?
+              %a{href: ContentConfig.footer_instagram_url}
+                %i.ofn-i_043-instagram
+            - if ContentConfig.footer_linkedin_url.present?
+              %a{href: ContentConfig.footer_linkedin_url}
+                %i.ofn-i_042-linkedin
+            - if ContentConfig.footer_googleplus_url.present?
+              %a{href: ContentConfig.footer_googleplus_url}
+                %i.ofn-i_046-g
+            - if ContentConfig.footer_pinterest_url.present?
+              %a{href: ContentConfig.footer_pinterest_url}
+                %i.ofn-i_045-pintrest
         - if ContentConfig.footer_email.present?
           %p
             %a{href: ContentConfig.footer_email.reverse, mailto: true, target: '_blank'}
@@ -92,7 +93,7 @@
         %hr.hr-light
         %br
 
-    .row
+    .row.legal
       .small-12.medium-3.medium-offset-2.columns.text-left
         %a{href: main_app.root_path}
           %img{src: ContentConfig.footer_logo.url, width: "220"}
@@ -107,10 +108,9 @@
         %p.text-small
           = t '.footer_legal_text_html', {content_license: link_to('CC BY-SA 3.0', 'https://creativecommons.org/licenses/by-sa/3.0/'), code_license: link_to('AGPL 3', 'https://tldrlegal.com/license/gnu-affero-general-public-license-v3-(agpl-3.0)' )}
         %p.text-small
-          %div
-            - if Spree::Config.privacy_policy_url.present?
-              = t '.footer_data_text_with_privacy_policy_html', {cookies_policy: cookies_policy_link.html_safe, privacy_policy: privacy_policy_link.html_safe }
-            - else
-              = t '.footer_data_text_without_privacy_policy_html', {cookies_policy: cookies_policy_link.html_safe }
+          - if Spree::Config.privacy_policy_url.present?
+            = t '.footer_data_text_with_privacy_policy_html', {cookies_policy: cookies_policy_link.html_safe, privacy_policy: privacy_policy_link.html_safe }
+          - else
+            = t '.footer_data_text_without_privacy_policy_html', {cookies_policy: cookies_policy_link.html_safe }
       .medium-2.columns.text-center
         / Placeholder

engines/web/spec/features/consumer/cookies_spec.rb

@@ -155,7 +155,7 @@ feature "Cookies", js: true do
   end
 
   def click_footer_cookies_policy_link_and_wait
-    find("div > a", text: "cookies policy").click
+    find(".legal a", text: "cookies policy").click
     sleep 2
   end