Merge pull request #3347 from thiswillbeyourgithub/add-mastodon-share-button

feat: add mastodon share button

Author: rjzupkoii

_includes/social-share.html

@@ -11,5 +11,7 @@ <h4 class="page__share-title">{{ site.data.ui-text[site.locale].share_on_label |
 
   <a href="https://www.linkedin.com/shareArticle?mini=true&url={{ base_path }}{{ page.url }}" class="btn btn--linkedin" title="{{ site.data.ui-text[site.locale].share_on_label | default: 'Share on' }} LinkedIn"><i class="fab fa-linkedin" aria-hidden="true"></i><span> LinkedIn</span></a>
 
+  <a href="https://www.addtoany.com/add_to/mastodon?linkurl={{  base_path | append: page.url | url_encode }}" class="btn btn--mastodon" title="{{ site.data.ui-text[site.locale].share_on_label | default: 'Share on' }} Mastodon"><i class="fab fa-mastodon" aria-hidden="true"></i><span> Mastodon</span></a>
+
   <a href="https://x.com/intent/post?text={{ base_path }}{{ page.url }}" class="btn btn--x" title="{{ site.data.ui-text[site.locale].share_on_label | default: 'Share on' }} X"><i class="fab fa-x-twitter" aria-hidden="true"></i><span> X (formerly Twitter)</span></a>
 </section>

_sass/layout/_buttons.scss

@@ -123,6 +123,7 @@
   (twitter, $twitter-color),
   (google-plus, $google-plus-color),
   (linkedin, $linkedin-color);
+  (mastodon, $mastodon-color),
 
   @each $socialnetwork, $color in $social {
     &--#{$socialnetwork} {
@@ -151,4 +152,4 @@
   &--small {
     font-size: $type-size-7;
   }
-}
+}