Add support for Mastodon, Instagram, and Liberapay

data/admin.yml

@@ -10,6 +10,9 @@ site:
 social_media:
   facebook: 'snipette'
   twitter: 'snipettemag'
+  mastodon: 'https://squeet.me/snipette'
+  instagram: 'snipettemag'
+  liberapay: 'snipettemag'
 
 nav_home:
   - title: Home

src/components/Footer.vue

@@ -9,8 +9,10 @@
           <g-link to="/">Latest Posts</g-link>
           <a v-if="Admin.social_media.facebook" :href="'https://facebook.com/' + Admin.social_media.facebook" target="_blank" rel="noopener">Facebook</a>
           <a v-if="Admin.social_media.twitter" :href="'https://twitter.com/' + Admin.social_media.twitter" target="_blank" rel="noopener">Twitter</a>
+          <a v-if="Admin.social_media.mastodon" :href="Admin.social_media.mastodon" target="_blank" rel="noopener">Mastodon</a>
+          <a v-if="Admin.social_media.instagram" :href="'https://instagram.com/' + Admin.social_media.instagram" target="_blank" rel="noopener">Instagram</a>
           <a v-if="Admin.social_media.patreon" :href="'https://www.patreon.com/' + Admin.social_media.patreon" target="_blank" rel="noopener">Become My Patron</a>
-          <a href="https://gridsome.org" target="_blank" rel="noopener">Gridsome</a>
+          <a v-if="Admin.social_media.liberapay" :href="'https://liberapay.com/' + Admin.social_media.liberapay" target="_blank" rel="noopener">Donate via Liberapay</a>
       </nav>
     </div>
   </footer>

src/components/Navbar.vue

@@ -49,6 +49,36 @@
         >
           <Twitter/>
         </a>
+        <a
+          v-if="Admin.social_media.mastodon"
+          class="social-link social-link-lp"
+          :href="Admin.social_media.mastodon"
+          title="Mastodon"
+          target="_blank"
+          rel="noopener"
+        >
+          <Mastodon/>
+        </a>
+        <a
+          v-if="Admin.social_media.instagram"
+          class="social-link social-link-lp"
+          :href="'https://instagram.com/' + Admin.social_media.instagram"
+          title="Instagram"
+          target="_blank"
+          rel="noopener"
+        >
+          <Instagram/>
+        </a>
+        <a
+          v-if="Admin.social_media.liberapay"
+          class="social-link social-link-lp"
+          :href="'https://liberapay.com/' + Admin.social_media.liberapay"
+          title="Liberapay"
+          target="_blank"
+          rel="noopener"
+        >
+          <Liberapay/>
+        </a>
       </div>
       <a v-if="Admin.site.subscribers" class="subscribe-button" href="#subscribe">Subscribe</a>
       <a v-else class="rss-button" href="/feed.xml" title="RSS" target="_blank" rel="noopener">
@@ -66,6 +96,9 @@ import Navigation from "./Navigation";
 import Facebook from "./icons/Facebook";
 import Twitter from "./icons/Twitter";
 import Patreon from "./icons/Patreon";
+import Mastodon from "./icons/Mastodon";
+import Instagram from "./icons/Instagram";
+import Liberapay from "./icons/Liberapay";
 import RSS from "./icons/RSS";
 
 export default {
@@ -80,6 +113,9 @@ export default {
     Patreon,
     Facebook,
     Twitter,
+    Mastodon,
+    Instagram,
+    Liberapay,
     RSS
   },
   computed: {

src/components/icons/Instagram.vue

@@ -0,0 +1,5 @@
+<template>
+  <svg width="1536" height="1536" xmlns="http://www.w3.org/2000/svg" viewBox="0 100 1536 1636">
+    <path d="M1024 896c0-141-115-256-256-256S512 755 512 896s115 256 256 256 256-115 256-256zm138 0c0 218-176 394-394 394s-394-176-394-394 176-394 394-394 394 176 394 394zm108-410c0 51-41 92-92 92s-92-41-92-92 41-92 92-92 92 41 92 92zM768 266c-112 0-352-9-453 31-35 14-61 31-88 58s-44 53-58 88c-40 101-31 341-31 453s-9 352 31 453c14 35 31 61 58 88s53 44 88 58c101 40 341 31 453 31s352 9 453-31c35-14 61-31 88-58s44-53 58-88c40-101 31-341 31-453s9-352-31-453c-14-35-31-61-58-88s-53-44-88-58c-101-40-341-31-453-31zm768 630c0 106 1 211-5 317-6 123-34 232-124 322s-199 118-322 124c-106 6-211 5-317 5s-211 1-317-5c-123-6-232-34-322-124S11 1336 5 1213c-6-106-5-211-5-317s-1-211 5-317c6-123 34-232 124-322s199-118 322-124c106-6 211-5 317-5s211-1 317 5c123 6 232 34 322 124s118 199 124 322c6 106 5 211 5 317z"/>
+</svg>
+</template>

src/components/icons/Liberapay.vue

@@ -0,0 +1,5 @@
+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" width="1536" height="1796" viewBox="0 0 1536 1796">
+      <path d="M469.093 132l-247.737 38.364L18.4 1018.984C6.639 1069.078.554 1116.24.024 1160.442c-.551 44.224 8.502 83.402 27.147 117.495 18.649 34.116 49.543 60.997 92.707 80.704 43.163 19.706 102.54 29.551 178.208 29.551l47.966-196.585c-27.715-2.118-49.321-6.922-64.769-14.402-15.447-7.439-26.337-17.28-32.736-29.55-6.4-12.247-9.368-26.36-8.816-42.336.53-15.978 2.921-33.592 7.202-52.77l222.16-920.465zm382.159 380.586c-63.93 0-123.348 5.038-178.209 15.145-54.882 10.15-103.666 21.616-146.257 34.394L261.5 1668h236.522l71.93-289.245c36.212 6.4 72.443 9.601 108.679 9.601 74.566 0 143.572-13.108 206.971-39.192 63.379-26.106 117.675-62.573 162.98-109.466 45.154-46.871 80.62-102.513 106.196-166.994 25.576-64.416 38.365-135.6 38.365-213.386h.165c0-47.952-6.663-92.898-19.948-135.002-13.35-42.082-33.847-78.848-61.541-110.294-27.802-31.424-63.199-56.212-106.364-74.33-43.14-18.095-94.554-27.15-154.205-27.15zm-30.294 199.73c50.071 0 85.235 16.012 105.492 47.966 20.216 31.953 30.337 70.875 30.337 116.665 0 46.893-6.643 89.745-19.948 128.629-13.35 38.925-31.989 72.212-55.954 99.907-23.987 27.716-53.024 49.301-87.118 64.728-34.094 15.468-71.927 23.175-113.48 23.175-26.636 0-48.992-2.099-67.087-6.375l111.866-465.095c29.812-6.4 61.776-9.601 95.892-9.601z"/>
+  </svg>
+</template>

src/components/icons/Mastodon.vue

@@ -0,0 +1,5 @@
+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" width="1536" height="1792" viewBox="0 0 1536 1792">
+    <path d="M1503.302 1111.386c-22.579 116.159-202.224 243.284-408.55 267.921-107.588 12.837-213.519 24.636-326.476 19.455-184.728-8.463-330.494-44.092-330.494-44.092 0 17.983 1.11 35.106 3.328 51.12 24.015 182.308 180.772 193.228 329.261 198.32 149.872 5.127 283.321-36.951 283.321-36.951l6.157 135.491s-104.827 56.293-291.574 66.646c-102.974 5.66-230.836-2.59-379.759-42.009C65.529 1641.797 10.219 1297.502 1.482 948.17-1.11 844.449.485 746.646.49 664.847.5 307.631 234.539 202.924 234.539 202.924c118.011-54.199 320.512-76.99 531.033-78.71h5.173c210.52 1.721 413.152 24.511 531.157 78.71 0 0 234.04 104.706 234.04 461.923 0 0 2.935 263.556-32.64 446.539zm-243.429-418.827c0-88.4-21.711-159.35-67.71-210.618-46.63-51.972-107.687-78.613-183.47-78.613-87.699 0-154.104 33.703-198.002 101.121L768 576l-42.683-71.55c-43.907-67.42-110.313-101.124-198.003-101.124-75.792 0-136.849 26.642-183.47 78.614-45.21 51.973-67.718 122.219-67.718 210.618v432.53h171.359V705.273c0-88.498 37.234-133.415 111.713-133.415 82.35 0 123.63 53.283 123.63 158.646v229.788h170.35V730.505c0-105.363 41.272-158.646 123.62-158.646 74.478 0 111.715 44.917 111.715 133.415v419.816h171.358V692.56z"/>
+  </svg>
+</template>