classic template - move social links to the footer

ot_templating/Resources/Private/Partials/Classic/Footer.html

@@ -21,7 +21,32 @@
                 </v:menu>
             </f:then>
         </f:if>
+
+        <f:if condition="{settings.structureFacebook} != ''">
+            <li class="social-logo">
+                <a href="{ot:utilities.absoluteUrl(url: settings.structureFacebook)}" target="_blank">
+                    <i class="fab fa-facebook" style="color: #f2f2f2"></i>
+                </a>
+            </li>
+        </f:if>
+
+        <f:if condition="{settings.structureTwitter} != ''">
+            <li class="social-logo">
+                <a href="{ot:utilities.absoluteUrl(url: settings.structureTwitter)}" target="_blank">
+                    <i class="fab fa-twitter" style="color: #f2f2f2"></i>
+                </a>
+            </li>
+        </f:if>
+
+        <f:if condition="{settings.structureInstagram} != ''">
+            <li class="social-logo">
+                <a href="{ot:utilities.absoluteUrl(url: settings.structureInstagram)}" target="_blank">
+                    <i class="fab fa-instagram-square" style="color: #f2f2f2"></i>
+                </a>
+            </li>
+        </f:if>
     </ul>
+
     <div class="logo-ot">
         <a href="{settings.opentalentWebsite}" target="_blank" title="Opentalent">
             <f:image src="EXT:ot_templating/Resources/Public/media/logo-opentalent.png" height="40" />

ot_templating/Resources/Public/assets/Classic/style/classic-blue.css

@@ -527,30 +527,20 @@ ul.dropdown-left {
   color: #a6a6a6;
 }
 
-footer .logo-ot {
-  margin-right: 20px;
+footer .social-logo {
+  height: 26px;
+  width: 36px;
+  margin: 0 8px;
 }
 
-.social-bar {
-  /* OLD - iOS 6-, Safari 3.1-6 */
-  display: -webkit-box;
-  /* OLD - Firefox 19- (buggy but mostly works) */
-  display: -moz-box;
-  /* TWEENER - IE 10 */
-  display: -ms-flexbox;
-  /* NEW - Chrome */
-  display: -webkit-flex;
-  /* NEW, Spec - Opera 12.1, Firefox 20+ */
-  display: flex;
-  flex-direction: row;
-  margin: 0 18px;
+footer .social-logo a {
+  font-size: 24px;
+  padding: 0 12px;
+  margin: 0;
 }
 
-.social-logo {
-  height: 24px;
-  width: 24px;
-  font-size: 24px;
-  margin: 0 6px;
+footer .logo-ot {
+  margin-right: 20px;
 }
 
 .user-toolbar {

ot_templating/Resources/Public/assets/Classic/style/classic-green.css

@@ -527,30 +527,20 @@ ul.dropdown-left {
   color: #a6a6a6;
 }
 
-footer .logo-ot {
-  margin-right: 20px;
+footer .social-logo {
+  height: 26px;
+  width: 36px;
+  margin: 0 8px;
 }
 
-.social-bar {
-  /* OLD - iOS 6-, Safari 3.1-6 */
-  display: -webkit-box;
-  /* OLD - Firefox 19- (buggy but mostly works) */
-  display: -moz-box;
-  /* TWEENER - IE 10 */
-  display: -ms-flexbox;
-  /* NEW - Chrome */
-  display: -webkit-flex;
-  /* NEW, Spec - Opera 12.1, Firefox 20+ */
-  display: flex;
-  flex-direction: row;
-  margin: 0 18px;
+footer .social-logo a {
+  font-size: 24px;
+  padding: 0 12px;
+  margin: 0;
 }
 
-.social-logo {
-  height: 24px;
-  width: 24px;
-  font-size: 24px;
-  margin: 0 6px;
+footer .logo-ot {
+  margin-right: 20px;
 }
 
 .user-toolbar {

ot_templating/Resources/Public/assets/Classic/style/classic-grey.css

@@ -527,30 +527,20 @@ ul.dropdown-left {
   color: #a6a6a6;
 }
 
-footer .logo-ot {
-  margin-right: 20px;
+footer .social-logo {
+  height: 26px;
+  width: 36px;
+  margin: 0 8px;
 }
 
-.social-bar {
-  /* OLD - iOS 6-, Safari 3.1-6 */
-  display: -webkit-box;
-  /* OLD - Firefox 19- (buggy but mostly works) */
-  display: -moz-box;
-  /* TWEENER - IE 10 */
-  display: -ms-flexbox;
-  /* NEW - Chrome */
-  display: -webkit-flex;
-  /* NEW, Spec - Opera 12.1, Firefox 20+ */
-  display: flex;
-  flex-direction: row;
-  margin: 0 18px;
+footer .social-logo a {
+  font-size: 24px;
+  padding: 0 12px;
+  margin: 0;
 }
 
-.social-logo {
-  height: 24px;
-  width: 24px;
-  font-size: 24px;
-  margin: 0 6px;
+footer .logo-ot {
+  margin-right: 20px;
 }
 
 .user-toolbar {

ot_templating/Resources/Public/assets/Classic/style/classic-light-blue.css

@@ -527,30 +527,20 @@ ul.dropdown-left {
   color: #a6a6a6;
 }
 
-footer .logo-ot {
-  margin-right: 20px;
+footer .social-logo {
+  height: 26px;
+  width: 36px;
+  margin: 0 8px;
 }
 
-.social-bar {
-  /* OLD - iOS 6-, Safari 3.1-6 */
-  display: -webkit-box;
-  /* OLD - Firefox 19- (buggy but mostly works) */
-  display: -moz-box;
-  /* TWEENER - IE 10 */
-  display: -ms-flexbox;
-  /* NEW - Chrome */
-  display: -webkit-flex;
-  /* NEW, Spec - Opera 12.1, Firefox 20+ */
-  display: flex;
-  flex-direction: row;
-  margin: 0 18px;
+footer .social-logo a {
+  font-size: 24px;
+  padding: 0 12px;
+  margin: 0;
 }
 
-.social-logo {
-  height: 24px;
-  width: 24px;
-  font-size: 24px;
-  margin: 0 6px;
+footer .logo-ot {
+  margin-right: 20px;
 }
 
 .user-toolbar {

ot_templating/Resources/Public/assets/Classic/style/classic-light-red.css

@@ -527,30 +527,20 @@ ul.dropdown-left {
   color: #a6a6a6;
 }
 
-footer .logo-ot {
-  margin-right: 20px;
+footer .social-logo {
+  height: 26px;
+  width: 36px;
+  margin: 0 8px;
 }
 
-.social-bar {
-  /* OLD - iOS 6-, Safari 3.1-6 */
-  display: -webkit-box;
-  /* OLD - Firefox 19- (buggy but mostly works) */
-  display: -moz-box;
-  /* TWEENER - IE 10 */
-  display: -ms-flexbox;
-  /* NEW - Chrome */
-  display: -webkit-flex;
-  /* NEW, Spec - Opera 12.1, Firefox 20+ */
-  display: flex;
-  flex-direction: row;
-  margin: 0 18px;
+footer .social-logo a {
+  font-size: 24px;
+  padding: 0 12px;
+  margin: 0;
 }
 
-.social-logo {
-  height: 24px;
-  width: 24px;
-  font-size: 24px;
-  margin: 0 6px;
+footer .logo-ot {
+  margin-right: 20px;
 }
 
 .user-toolbar {

ot_templating/Resources/Public/assets/Classic/style/classic-orange.css

@@ -527,30 +527,20 @@ ul.dropdown-left {
   color: #a6a6a6;
 }
 
-footer .logo-ot {
-  margin-right: 20px;
+footer .social-logo {
+  height: 26px;
+  width: 36px;
+  margin: 0 8px;
 }
 
-.social-bar {
-  /* OLD - iOS 6-, Safari 3.1-6 */
-  display: -webkit-box;
-  /* OLD - Firefox 19- (buggy but mostly works) */
-  display: -moz-box;
-  /* TWEENER - IE 10 */
-  display: -ms-flexbox;
-  /* NEW - Chrome */
-  display: -webkit-flex;
-  /* NEW, Spec - Opera 12.1, Firefox 20+ */
-  display: flex;
-  flex-direction: row;
-  margin: 0 18px;
+footer .social-logo a {
+  font-size: 24px;
+  padding: 0 12px;
+  margin: 0;
 }
 
-.social-logo {
-  height: 24px;
-  width: 24px;
-  font-size: 24px;
-  margin: 0 6px;
+footer .logo-ot {
+  margin-right: 20px;
 }
 
 .user-toolbar {

ot_templating/Resources/Public/assets/Classic/style/classic-purple.css

@@ -527,30 +527,20 @@ ul.dropdown-left {
   color: #a6a6a6;
 }
 
-footer .logo-ot {
-  margin-right: 20px;
+footer .social-logo {
+  height: 26px;
+  width: 36px;
+  margin: 0 8px;
 }
 
-.social-bar {
-  /* OLD - iOS 6-, Safari 3.1-6 */
-  display: -webkit-box;
-  /* OLD - Firefox 19- (buggy but mostly works) */
-  display: -moz-box;
-  /* TWEENER - IE 10 */
-  display: -ms-flexbox;
-  /* NEW - Chrome */
-  display: -webkit-flex;
-  /* NEW, Spec - Opera 12.1, Firefox 20+ */
-  display: flex;
-  flex-direction: row;
-  margin: 0 18px;
+footer .social-logo a {
+  font-size: 24px;
+  padding: 0 12px;
+  margin: 0;
 }
 
-.social-logo {
-  height: 24px;
-  width: 24px;
-  font-size: 24px;
-  margin: 0 6px;
+footer .logo-ot {
+  margin-right: 20px;
 }
 
 .user-toolbar {

ot_templating/Resources/Public/assets/Classic/style/classic-red.css

@@ -527,30 +527,20 @@ ul.dropdown-left {
   color: #a6a6a6;
 }
 
-footer .logo-ot {
-  margin-right: 20px;
+footer .social-logo {
+  height: 26px;
+  width: 36px;
+  margin: 0 8px;
 }
 
-.social-bar {
-  /* OLD - iOS 6-, Safari 3.1-6 */
-  display: -webkit-box;
-  /* OLD - Firefox 19- (buggy but mostly works) */
-  display: -moz-box;
-  /* TWEENER - IE 10 */
-  display: -ms-flexbox;
-  /* NEW - Chrome */
-  display: -webkit-flex;
-  /* NEW, Spec - Opera 12.1, Firefox 20+ */
-  display: flex;
-  flex-direction: row;
-  margin: 0 18px;
+footer .social-logo a {
+  font-size: 24px;
+  padding: 0 12px;
+  margin: 0;
 }
 
-.social-logo {
-  height: 24px;
-  width: 24px;
-  font-size: 24px;
-  margin: 0 6px;
+footer .logo-ot {
+  margin-right: 20px;
 }
 
 .user-toolbar {

ot_templating/Resources/Public/assets/Classic/style/module/_footer.scss

@@ -43,6 +43,18 @@
   color: #a6a6a6;
 }
 
+footer .social-logo {
+  height: 26px;
+  width: 36px;
+  margin: 0 8px;
+}
+
+footer .social-logo a {
+  font-size: 24px;
+  padding: 0 12px;
+  margin: 0;
+}
+
 footer .logo-ot {
   margin-right: 20px
 }

ot_templating/Resources/Public/assets/Classic/style/style.scss

@@ -82,7 +82,6 @@ $warning-font-color: #ffffff !default;
 "module/_menu",
 "module/_content",
 "module/_footer",
-"module/_social-bar",
 "module/_user-toolbar",
 "module/_breadcrumb",
 "module/_carousel",