From 73143b5e703dd5f0dc81e44ab6a8ce6786f40f31 Mon Sep 17 00:00:00 2001
From: Cocographique <nmi@odoo.com>
Date: Thu, 3 Sep 2020 11:25:06 +0000
Subject: [PATCH] [FIX] website: fix 'Social Media' snippet in Header/Footer
 templates
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

task-2312878

closes odoo/odoo#57077

X-original-commit: 98255310ec855f9eac65b708900b85aa7485a035
Signed-off-by: Jérémy Kersten (jke) <jke@openerp.com>
---
 addons/website/views/website_templates.xml | 127 +++++++++++----------
 1 file changed, 67 insertions(+), 60 deletions(-)

diff --git a/addons/website/views/website_templates.xml b/addons/website/views/website_templates.xml
index c20b8ea6f33..0541cd2176f 100644
--- a/addons/website/views/website_templates.xml
+++ b/addons/website/views/website_templates.xml
@@ -385,18 +385,18 @@
                         <!-- Social -->
                         <div class="col-lg-6 pb16">
                             <div class="s_share text-left no_icon_color" data-name="Social Media">
-                                <h4 class="s_share_title d-none">Follow us</h4>
+                                <h5 class="s_share_title d-none">Follow us</h5>
                                 <a href="/website/social/facebook" class="s_share_facebook" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-facebook"/>
+                                    <i class="fa fa-facebook m-1"/>
                                 </a>
                                 <a href="/website/social/twitter" class="s_share_twitter" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-twitter"/>
+                                    <i class="fa fa-twitter m-1"/>
                                 </a>
                                 <a href="/website/social/linkedin" class="s_share_linkedin" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-linkedin"/>
+                                    <i class="fa fa-linkedin m-1"/>
                                 </a>
                                 <a href="/website/social/instagram" class="s_share_instagram" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-instagram"/>
+                                    <i class="fa fa-instagram m-1"/>
                                 </a>
                             </div>
                         </div>
@@ -490,16 +490,16 @@
                     <div class="s_share no_icon_color" data-name="Social Media">
                         <h6 class="s_share_title d-none">Follow us</h6>
                         <a href="/website/social/facebook" class="s_share_facebook" target="_blank">
-                            <i class="fa fa-1x fa-fw fa-facebook"/>
+                            <i class="fa fa-facebook m-1"/>
                         </a>
                         <a href="/website/social/twitter" class="s_share_twitter" target="_blank">
-                            <i class="fa fa-1x fa-fw fa-twitter"/>
+                            <i class="fa fa-twitter m-1"/>
                         </a>
                         <a href="/website/social/linkedin" class="s_share_linkedin" target="_blank">
-                            <i class="fa fa-1x fa-fw fa-linkedin"/>
+                            <i class="fa fa-linkedin m-1"/>
                         </a>
                         <a href="/website/social/instagram" class="s_share_instagram" target="_blank">
-                            <i class="fa fa-1x fa-fw fa-instagram"/>
+                            <i class="fa fa-instagram m-1"/>
                         </a>
                     </div>
                 </div>
@@ -587,18 +587,18 @@
                 <div class="container">
                     <!-- Social -->
                     <div class="s_share mt-3" data-name="Social Media">
-                        <h6 class="s_share_title my-3 d-none">Follow us</h6>
+                        <h5 class="s_share_title d-none">Follow us</h5>
                         <a href="/website/social/facebook" class="s_share_facebook" target="_blank">
-                            <i class="fa fa-1x fa-fw fa-facebook rounded-circle shadow-sm"/>
+                            <i class="fa fa-facebook rounded-circle shadow-sm"/>
                         </a>
                         <a href="/website/social/twitter" class="s_share_twitter" target="_blank">
-                            <i class="fa fa-1x fa-fw fa-twitter rounded-circle shadow-sm"/>
+                            <i class="fa fa-twitter rounded-circle shadow-sm"/>
                         </a>
                         <a href="/website/social/linkedin" class="s_share_linkedin" target="_blank">
-                            <i class="fa fa-1x fa-fw fa-linkedin rounded-circle shadow-sm"/>
+                            <i class="fa fa-linkedin rounded-circle shadow-sm"/>
                         </a>
                         <a href="/website/social/instagram" class="s_share_instagram" target="_blank">
-                            <i class="fa fa-1x fa-fw fa-instagram rounded-circle shadow-sm"/>
+                            <i class="fa fa-instagram rounded-circle shadow-sm"/>
                         </a>
                     </div>
                     <!-- Separator -->
@@ -775,22 +775,22 @@
                             <div class="s_share no_icon_color" data-name="Social Media">
                                 <small class="s_share_title text-muted"><b>Follow us</b></small>
                                 <a href="/website/social/facebook" class="s_share_facebook" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-facebook"/>
+                                    <i class="fa fa-facebook m-1"/>
                                 </a>
                                 <a href="/website/social/twitter" class="s_share_twitter" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-twitter"/>
+                                    <i class="fa fa-twitter m-1"/>
                                 </a>
                                 <a href="/website/social/linkedin" class="s_share_linkedin" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-linkedin"/>
+                                    <i class="fa fa-linkedin m-1"/>
                                 </a>
                                 <a href="/website/social/github" class="s_share_github" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-github"/>
+                                    <i class="fa fa-github m-1"/>
                                 </a>
                                 <a href="/website/social/youtube" class="s_share_youtube" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-youtube"/>
+                                    <i class="fa fa-youtube m-1"/>
                                 </a>
                                 <a href="/website/social/instagram" class="s_share_instagram" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-instagram"/>
+                                    <i class="fa fa-instagram m-1"/>
                                 </a>
                             </div>
                         </div>
@@ -899,14 +899,15 @@
             <section class="s_text_block" data-snippet="s_text_block" name="Text">
                 <div class="container">
                     <div class="s_share text-left" data-name="Social Media">
+                        <h6 class="s_share_title d-none">Follow us</h6>
                         <a href="/website/social/facebook" class="s_share_facebook" target="_blank">
-                            <i class="fa fa-fw fa-1x fa-facebook"/>
+                            <i class="fa fa-facebook m-1"/>
                         </a>
                         <a href="/website/social/twitter" class="s_share_twitter" target="_blank">
-                            <i class="fa fa-fw fa-1x fa-twitter"/>
+                            <i class="fa fa-twitter m-1"/>
                         </a>
                         <a href="/website/social/instagram" class="s_share_linkedin" target="_blank">
-                            <i class="fa fa-fw fa-1x fa-instagram"/>
+                            <i class="fa fa-instagram m-1"/>
                         </a>
                     </div>
                 </div>
@@ -1098,24 +1099,24 @@
                 <hr class="w-100 mx-auto" style="border-top-width: 1px; border-top-style: solid; border-color: var(--400);"/>
             </div>
             <div class="s_share text-center" data-name="Social Media">
-                <h4 class="s_share_title d-none">Follow us</h4>
+                <h5 class="s_share_title d-none">Follow us</h5>
                 <a href="/website/social/facebook" class="s_share_facebook" target="_blank">
-                    <i class="fa fa-1x fa-fw fa-facebook rounded-circle shadow-sm"/>
+                    <i class="fa fa-facebook rounded-circle shadow-sm"/>
                 </a>
                 <a href="/website/social/twitter" class="s_share_twitter" target="_blank">
-                    <i class="fa fa-1x fa-fw fa-twitter rounded-circle shadow-sm"/>
+                    <i class="fa fa-twitter rounded-circle shadow-sm"/>
                 </a>
                 <a href="/website/social/linkedin" class="s_share_linkedin" target="_blank">
-                    <i class="fa fa-1x fa-fw fa-linkedin rounded-circle shadow-sm"/>
+                    <i class="fa fa-linkedin rounded-circle shadow-sm"/>
                 </a>
                 <a href="/website/social/github" class="s_share_github" target="_blank">
-                    <i class="fa fa-1x fa-fw fa-github rounded-circle shadow-sm"/>
+                    <i class="fa fa-github rounded-circle shadow-sm"/>
                 </a>
                 <a href="/website/social/youtube" class="s_share_youtube" target="_blank">
-                    <i class="fa fa-1x fa-fw fa-youtube rounded-circle shadow-sm"/>
+                    <i class="fa fa-youtube rounded-circle shadow-sm"/>
                 </a>
                 <a href="/website/social/instagram" class="s_share_instagram" target="_blank">
-                    <i class="fa fa-1x fa-fw fa-instagram rounded-circle shadow-sm"/>
+                    <i class="fa fa-instagram rounded-circle shadow-sm"/>
                 </a>
             </div>
         </div>
@@ -1180,25 +1181,25 @@
                             <div class="s_share no_icon_color" data-name="Social Media">
                                 <small class="s_share_title d-none"><b>Follow us</b></small>
                                 <a href="/website/social/facebook" class="s_share_facebook" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-facebook"/>
+                                    <i class="fa fa-facebook m-1"/>
                                 </a>
                                 <a href="/website/social/twitter" class="s_share_twitter" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-twitter"/>
+                                    <i class="fa fa-twitter m-1"/>
                                 </a>
                                 <a href="/website/social/linkedin" class="s_share_linkedin" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-linkedin"/>
+                                    <i class="fa fa-linkedin m-1"/>
                                 </a>
                                 <a href="/website/social/github" class="s_share_github" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-github"/>
+                                    <i class="fa fa-github m-1"/>
                                 </a>
                                 <a href="/website/social/youtube" class="s_share_youtube" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-youtube"/>
+                                    <i class="fa fa-youtube m-1"/>
                                 </a>
                                 <a href="/website/social/instagram" class="s_share_instagram" target="_blank">
-                                    <i class="fa fa-1x fa-fw fa-instagram"/>
+                                    <i class="fa fa-instagram m-1"/>
                                 </a>
-                                <a href="mailto:info@yourcompany.example.com">
-                                    <i class="fa fa-1x fa-fw fa-envelope ml-3"/>
+                                <a href="mailto:info@yourcompany.example.com" class="ml-3" target="_blank">
+                                    <i class="fa fa-1x fa-envelope"/>
                                 </a>
                             </div>
                         </div>
@@ -1366,7 +1367,7 @@
                                 <li><i class="fa fa-phone fa-fw mr-2"/><span class="o_force_ltr"><a href="tel:1 (650) 691-3277">1 (650) 691-3277</a></span></li>
                             </ul>
                             <div class="s_share text-left" data-name="Social Media">
-                                <h4 class="s_share_title d-none">Follow us</h4>
+                                <h5 class="s_share_title d-none">Follow us</h5>
                                 <a href="/website/social/facebook" class="s_share_facebook" target="_blank">
                                     <i class="fa fa-facebook rounded-circle shadow-sm"/>
                                 </a>
@@ -1376,8 +1377,8 @@
                                 <a href="/website/social/linkedin" class="s_share_linkedin" target="_blank">
                                     <i class="fa fa-linkedin rounded-circle shadow-sm"/>
                                 </a>
-                                <a href="/" class="float-right" target="_blank">
-                                    <i class="fa fa-home bg-primary rounded-circle shadow-sm"/>
+                                <a href="/" class="float-right">
+                                    <i class="fa fa-home rounded-circle shadow-sm"/>
                                 </a>
                             </div>
                         </div>
@@ -1411,18 +1412,18 @@
                                 <li><i class="fa fa-envelope fa-fw mr-2"/><span><a href="mailto:hello@mycompany.com">hello@mycompany.com</a></span></li>
                             </ul>
                             <div class="s_share text-left no_icon_color" data-name="Social Media">
-                                <h4 class="s_share_title d-none">Follow us</h4>
-                                <a href="/website/social/github" class="s_share_github mr-2" target="_blank">
-                                    <i class="fa fa-2x fa-github"/>
+                                <h5 class="s_share_title d-none">Follow us</h5>
+                                <a href="/website/social/github" class="s_share_github" target="_blank">
+                                    <i class="fa fa-2x fa-github m-1"/>
                                 </a>
-                                <a href="/website/social/twitter" class="s_share_twitter mr-2" target="_blank">
-                                    <i class="fa fa-2x fa-twitter"/>
+                                <a href="/website/social/twitter" class="s_share_twitter" target="_blank">
+                                    <i class="fa fa-2x fa-twitter m-1"/>
                                 </a>
-                                <a href="/website/social/instagram" class="s_share_instagram mr-2" target="_blank">
-                                    <i class="fa fa-2x fa-instagram"/>
+                                <a href="/website/social/instagram" class="s_share_instagram" target="_blank">
+                                    <i class="fa fa-2x fa-instagram m-1"/>
                                 </a>
-                                <a href="/website/social/linkedin" class="s_share_linkedin mr-2" target="_blank">
-                                    <i class="fa fa-2x fa-linkedin"/>
+                                <a href="/website/social/linkedin" class="s_share_linkedin" target="_blank">
+                                    <i class="fa fa-2x fa-linkedin m-1"/>
                                 </a>
                             </div>
                         </div>
@@ -1439,7 +1440,7 @@
             <section class="s_text_block pt32" data-snippet="s_text_block" data-name="Text">
                 <div class="container s_allow_columns">
                     <div class="s_share text-center mb-4" data-name="Social Media">
-                        <h4 class="s_share_title d-none">Share</h4>
+                        <h5 class="s_share_title d-none">Follow us</h5>
                         <a href="/website/social/facebook" class="s_share_facebook" target="_blank">
                             <i class="fa fa-facebook rounded-circle rounded shadow-sm"/>
                         </a>
@@ -1544,15 +1545,15 @@
                         </div>
                         <div class="col-lg-3 pt16 pb16">
                             <div class="s_share text-right no_icon_color" data-name="Social Media">
-                                <h4 class="s_share_title d-none">Follow us</h4>
+                                <h5 class="s_share_title d-none">Follow us</h5>
                                 <a href="/website/social/github" class="s_share_github" target="_blank">
-                                    <i class="fa fa-2x fa-github"/>
+                                    <i class="fa fa-2x fa-github m-1"/>
                                 </a>
                                 <a href="/website/social/twitter" class="s_share_twitter" target="_blank">
-                                    <i class="fa fa-2x fa-twitter"/>
+                                    <i class="fa fa-2x fa-twitter m-1"/>
                                 </a>
                                 <a href="/website/social/instagram" class="s_share_instagram" target="_blank">
-                                    <i class="fa fa-2x fa-instagram"/>
+                                    <i class="fa fa-2x fa-instagram m-1"/>
                                 </a>
                             </div>
                         </div>
@@ -1586,10 +1587,16 @@
                         </div>
                         <div class="col-lg-3 pt16 pb16">
                             <div class="s_share text-right no_icon_color" data-name="Social Media">
-                                <p class="s_share_title d-block mb-1">Follow us</p>
-                                <a href="/website/social/twitter" class="px-1 ml-1" target="_blank"><i class="fa fa-2x fa-twitter"/></a>
-                                <a href="/website/social/linkedin" class="px-1 ml-1" target="_blank"><i class="fa fa-2x fa-linkedin"/></a>
-                                <a href="/website/social/instagram" class="px-1 ml-1" target="_blank"><i class="fa fa-2x fa-instagram"/></a>
+                                <p class="s_share_title d-block mb-2">Follow us</p>
+                                <a href="/website/social/twitter" class="s_share_twitter" target="_blank">
+                                    <i class="fa fa-twitter m-1"/>
+                                </a>
+                                <a href="/website/social/linkedin" class="s_share_linkedin" target="_blank">
+                                    <i class="fa fa-linkedin m-1"/>
+                                </a>
+                                <a href="/website/social/instagram" class="s_share_instagram" target="_blank">
+                                    <i class="fa fa-instagram m-1"/>
+                                </a>
                             </div>
                         </div>
                     </div>
@@ -1701,7 +1708,7 @@
                         </div>
                         <div class="col-lg-3 pb24">
                             <div class="s_share text-right" data-name="Social Media">
-                                <h4 class="s_share_title d-none">Share</h4>
+                                <h5 class="s_share_title d-none">Share</h5>
                                 <a href="/website/social/facebook" class="s_share_facebook" target="_blank">
                                     <i class="fa fa-1x fa-facebook rounded-circle shadow-sm"/>
                                 </a>