Theme Files Update

assets/js/main.js

@@ -1,7 +1,3 @@
-/**
- * Utils
- */
-
 // Throttle
 //
 const throttle = (callback, limit) => {
@@ -63,6 +59,23 @@ const toggleMobileMenu = () => {
   }
 }
 
+// Social Share Toggle
+//
+let shareMenuVisible = false;
+const shareMobileMenu = () => {
+  let shareMenu = document.getElementById('share-links');
+  if (shareMenuVisible == false) {
+    shareMenu.style.animationName = 'bounceInRight';
+    shareMenu.style.webkitAnimationName = 'bounceInRight';
+    shareMenu.style.display = 'block';
+    shareMenuVisible = true;
+  } else {
+    shareMenu.style.animationName = 'bounceOutRight';
+    shareMenu.style.webkitAnimationName = 'bounceOutRight'
+    shareMenuVisible = false;
+  }
+}
+
 // Featured Image Toggle
 //
 const showImg = () => {
@@ -82,6 +95,7 @@ const toggleToc = () => {
 
 if (header !== null) {
   listen('#menu-btn', "click", toggleMobileMenu);
+  listen('#share-btn', "click", shareMobileMenu);
   listen('#toc-btn', "click", toggleToc);
   listen('#img-btn', "click", showImg);
   listen('.bg-img', "click", hideImg);
@@ -98,5 +112,8 @@ if (header !== null) {
     if (mobileMenuVisible == true) {
       toggleMobileMenu();
     }
+    if (shareMenuVisible == true) {
+      shareMobileMenu();
+    }
   }, 250));
 }

assets/scss/_socialshare.scss

@@ -0,0 +1,31 @@
+#share-links {
+    position: fixed;
+    bottom: 7.0em;
+    right: 0.5em;
+    display: none;
+    padding: .6em 0.5em;
+    z-index: 1;
+    box-sizing: border-box;
+    box-shadow: -1px -2px 3px 0px rgba(0, 0, 0, 0.45);
+    background-color: $midnightblue;
+  
+    ul {
+      list-style: none;
+      margin: 0;
+      padding: 0;
+      line-height: 2;
+      font-size: 1.2em;
+      a {
+        color: $highlight-grey;
+        &:hover,&:active,&:focus{
+            color: $text;
+        }
+      }
+    }
+}
+@media (max-width: 520px) {
+    #share-links {
+        right: 0.2em;
+        bottom: 8.0em;
+      }
+}

assets/scss/style.scss

@@ -5,6 +5,7 @@
 @import "_scroll.scss";
 @import "_admonition.scss";
 @import "_mathjax.scss";
+@import "_socialshare.scss";
 
 /* Webkit Scrollbar Customize */
 ::-webkit-scrollbar {
@@ -299,7 +300,7 @@ table {
 #mobile-menu {
   position: fixed;
   bottom: 4.8em;
-  right: 1.5em;
+  right: 4.5em;
   display: none;
   padding: .6em 1.8em;
   z-index: 1;
@@ -904,7 +905,7 @@ a.footnote-ref {
   }
 
   #mobile-menu {
-    right: 1.2em;
+    right: 4.2em;
   }
   #home-subtitle {
     font-size: 0.5em;