Add Mastodon account

src/data/site.js

@@ -1,8 +1,10 @@
 module.exports = {
     title: 'Dev Tips by Nikita Dubko',
     author: 'Nikita Dubko',
-    description: 'Hello, my name is Nikita and I am a front-end developer. Here are life hacks and tips related to my daily work.',
+    description:
+        'Hello, my name is Nikita and I am a front-end developer. Here are life hacks and tips related to my daily work.',
     twitter: 'dev_tip',
+    mastodon: 'dev_tip',
     paths: {
         domain: 'mefody.dev',
         site: 'https://mefody.dev',

src/includes/footer.njk

@@ -7,6 +7,9 @@
             <dd><a href="https://twitter.com/webstandards_ru" rel="noopener">@webstandards_ru</a> and <a href="https://twitter.com/webstandards_en" rel="noopener">@webstandards_en</a> editor</dd>
         </dl>
         <ul class="footer__social-list social-list">
+            <li class="social-list__item">
+                <a href="https://mastodon.social/@{{ site.mastodon }}" rel="noopener me" class="social-list__link social-list__link--mastodon">Mastodon</a>
+            </li>
             <li class="social-list__item">
                 <a href="https://twitter.com/{{ site.twitter }}" rel="noopener me" class="social-list__link social-list__link--twitter">Twitter</a>
             </li>

src/styles/blocks/footer.css

@@ -25,6 +25,7 @@
 
 .footer__about {
     margin: 0;
+    margin-right: var(--line-space);
     padding: 0;
 }
 

src/styles/blocks/social-list.css

@@ -25,6 +25,10 @@
     --social-icon: url('/images/twitter-logo.svg');
 }
 
+.social-list__link--mastodon::before {
+    --social-icon: url('/images/mastodon-logo.svg');
+}
+
 .social-list__link--github::before {
     --social-icon: url('/images/github-logo.svg');
 }