✨ add social sharing buttons

OkunaOrg · Apr 29, 2018 · 6679d17 · 6679d17
1 parent f573dd0
commit 6679d17
Show file tree

Hide file tree

Showing 14 changed files with 1,489 additions and 12 deletions.
diff --git a/index.html b/index.html
@@ -3,16 +3,17 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Openbook | The open and secure social network.</title>
+    <title>Openbook | The open-source, privacy and security first, social network.</title>
     <!-- Twitter Card data -->
     <meta name="twitter:card" value="Openbook">
-    <meta name="Description" content="The open and secure social network."/>
+    <meta name="twitter:site" value="@OpenBook_org">
+    <meta name="Description" content="The open-source, privacy and security first, social network."/>
     <!-- Open Graph data -->
     <meta property="og:title" content="Openbook"/>
     <meta property="og:type" content="article"/>
     <meta property="og:url" content="https://www.open-book.org"/>
     <meta property="og:image" content="https://i.snag.gy/yBZ8EN.jpg"/>
-    <meta property="og:description" content="The open and secure social network."/>
+    <meta property="og:description" content="The open-source, privacy and security first, social network."/>
     <!-- Mobile header color for Chrome, Firefox OS and Opera -->
     <meta name="theme-color" content="#690ddc">
     <!-- Mobile header color Windows Phone -->
@@ -645,13 +646,6 @@ <h3>
                     monetizing the
                     personal information of their users.
                 </p>
-                <h3>
-                    Do you have an account in X social media?
-                </h3>
-                <p>
-                    We only have Reddit (<a href="https://www.reddit.com/user/openbook_org">@openbook_org</a>) and
-                    Twitter (<a href="https://twitter.com/OpenBook_org">@OpenBook_org</a>) accounts.
-                </p>
             </div>
         </div>
     </div>
@@ -682,6 +676,11 @@ <h3>
                             <i class="icon fab fa-reddit-alien"></i>
                         </a>
                     </div>
+                    <div class="column is-narrow">
+                        <a class="button is-rounded is-primary is-facebook" target="_blank" href="https://www.facebook.com/Openbook-2054845801502364/">
+                            <i class="icon fab fa-facebook-f"></i>
+                        </a>
+                    </div>
                     <div class="column is-narrow">
                         <a class="button is-rounded is-primary" target="_blank" href="mailto:[email protected]">
                             <i class="icon fas fa-envelope"></i>
@@ -692,6 +691,14 @@ <h3>
         </div>
     </footer>
     <ob-scroll-to-top></ob-scroll-to-top>
+    <div class="ssk-group ssk-sticky ssk-right ssk-center ssk-lg">
+        <a href="" class="ssk ssk-facebook"></a>
+        <a href="" class="ssk ssk-twitter"></a>
+        <a href="" class="ssk ssk-google-plus"></a>
+        <a href="" class="ssk ssk-pinterest"></a>
+        <a href="" class="ssk ssk-tumblr"></a>
+        <a href="" class="ssk ssk-linkedin"></a>
+    </div>
 </div>
 <!-- Site content ENDS -->
 </body>

diff --git a/src/components/scroll-to-top.vue b/src/components/scroll-to-top.vue
@@ -17,6 +17,10 @@
         height: $button-size;
         width: $button-size;
         margin: 1rem;
+
+        @media(max-width: 770px) {
+            margin-bottom: 4rem;
+        }
     }
 </style>
 

diff --git a/src/index.js b/src/index.js
@@ -5,6 +5,7 @@ require('slick-carousel');
 
 require('./scripts/typewriter.exec.js');
 require('./scripts/fontawesome-all.exec.js');
+require('./scripts/social-share.exec.js');
 
 import Vue from 'vue';
 import Buefy from 'buefy'
@@ -48,8 +49,13 @@ new Vue({
     },
     mounted() {
         this.initHello();
+        this.initSocialShare();
     },
     methods: {
+        initSocialShare(){
+            const SocialShareKit = window['SocialShareKit'];
+            SocialShareKit.init();
+        },
         initHello() {
             // This should have been added by the require of typewriter.exec.js
             const Typewriter = window['Typewriter'];