From 64c3c2cb16371ae200fd0291d2af506f3164a52c Mon Sep 17 00:00:00 2001
From: sixpointcube <sixpointcube@users.noreply.github.com>
Date: Thu, 20 Jun 2024 13:56:53 -0400
Subject: [PATCH] feat: add scrolling share buttons

---
 assets/ananke/css/custom.css       | 36 +++++++++++++++++++++++++++++-
 layouts/partials/social-share.html | 16 +++++++++++--
 2 files changed, 49 insertions(+), 3 deletions(-)

diff --git a/assets/ananke/css/custom.css b/assets/ananke/css/custom.css
index c4d2eb0..8fe8b0d 100644
--- a/assets/ananke/css/custom.css
+++ b/assets/ananke/css/custom.css
@@ -22,4 +22,38 @@
 .jump-button:focus {
     outline: none;
     box-shadow: 0 0 0 3px rgba(255, 99, 71, 0.5);
-}
\ No newline at end of file
+}
+
+
+.share-buttons {
+    position: fixed;
+    top: 50%;
+    left: 0;
+    transform: translateY(-50%);
+    display: flex;
+    flex-direction: column;
+    z-index: 1000;
+}
+
+.share-btn {
+    background-color: #333;
+    color: #fff;
+    text-align: center;
+    padding: 10px;
+    margin: 5px 0;
+    text-decoration: none;
+    transition: background-color 0.3s;
+}
+
+.share-btn:hover {
+    background-color: #555;
+}
+
+.icon svg {
+    height: 50px;
+    width: 50px
+}
+
+.facebook-share { background-color: #3b5998; }
+.pinterest-share { background-color: #bd081c; }
+.x-share { background-color: #333; }
\ No newline at end of file
diff --git a/layouts/partials/social-share.html b/layouts/partials/social-share.html
index efaf3c4..5f0f232 100644
--- a/layouts/partials/social-share.html
+++ b/layouts/partials/social-share.html
@@ -14,7 +14,7 @@
 
 {{ $services := where (partialCached "func/socials/Get" "socials/Get") "share" true }}
 {{ if not ($.Param "disable_share") }}
-  <div id="sharing" class="mt3 ananke-socials">
+  {{/*  <div id="sharing" class="mt3 ananke-socials">
     {{ range $service :=  $services }}
       {{ $href := index $hrefs .name }}
       <a href="{{ $href }}" class="ananke-social-link {{ .name }} no-underline" aria-label="share on {{ .label }}">
@@ -23,5 +23,17 @@
         {{ end }}
       </a>
     {{ end }}
+  </div>  */}}
+  <div id="sharing" class="share-buttons" class="mt3 ananke-socials">
+    {{ range $service :=  $services }}
+      {{ $href := index $hrefs .name }}
+      <a href="{{ $href }}" class="share-btn ananke-social-link {{ .name }}-share no-underline" aria-label="share on {{ .label }}">
+      {{ with .icon }}
+        <span class="icon"> {{ . }}</span>
+      {{ end }}
+      </a>
+    {{ end }}
   </div>
-{{ end }}
+
+
+  {{ end }}