try to work around 1Blocker social blocking

src/components/molecules/Social.jsx

@@ -31,16 +31,16 @@ const SocialIcon = props => {
 
 const Social = ({ meta, minimal, hide }) => {
   const { social } = meta
-  const classes = minimal ? 'social social--minimal' : 'social'
+  const classes = minimal ? 'networks networks--minimal' : 'networks'
 
   return (
     !hide && (
       <FadeIn timeout={{ enter: 200, exit: 0, appear: 200 }}>
         <aside className={classes}>
           {Object.keys(social).map((key, i) => (
-            <OutboundLink className="social__link" href={social[key]} key={i}>
+            <OutboundLink className="networks__link" href={social[key]} key={i}>
               <SocialIcon title={key} className="icon" />
-              <span className="social__title">{key}</span>
+              <span className="networks__title">{key}</span>
             </OutboundLink>
           ))}
         </aside>

src/components/molecules/Social.scss

@@ -1,13 +1,13 @@
 @import 'variables';
 
-.social {
+.networks {
     margin-top: $spacer * $line-height;
     width: 100%;
     display: flex;
     justify-content: center;
 }
 
-.social__title {
+.networks__title {
     display: block;
     width: 100%;
     font-size: $font-size-mini;
@@ -17,7 +17,7 @@
     transition: .2s ease-out;
 }
 
-.social__link {
+.networks__link {
     margin-left: $spacer / 4;
     margin-right: $spacer / 4;
     text-align: center;
@@ -47,13 +47,13 @@
             fill: $brand-cyan;
         }
 
-        .social__title {
+        .networks__title {
             opacity: 1;
             transform: translate3d(0, 0, 0);
         }
     }
 
-    .social--minimal & {
+    .networks--minimal & {
         padding: $spacer / 4;
         margin-left: $spacer / 4;
         margin-right: $spacer / 4;

src/components/organisms/Footer.scss

@@ -10,7 +10,7 @@
         font-size: $font-size-mini;
     }
 
-    .social {
+    .networks {
         margin-top: 0;
         margin-bottom: $spacer;
     }