diff --git a/docker-compose.yml b/docker-compose.yml
index ea4789d..46dc449 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -19,6 +19,7 @@ services:
- BIO=Hey! Just a place where you can connect with me!
- GITHUB=https://github.com/timothystewart6
- TWITTER=https://twitter.com/TechnoTimLive
+ - MASTODON=https://mastodon.social/TechnoTimLive
- INSTAGRAM=https://www.instagram.com/techno.tim
- YOUTUBE=https://www.youtube.com/channel/UCOk-gHyjcWZNj3Br4oxwh0A/
- TWITCH=https://www.twitch.tv/technotim/
diff --git a/env.js b/env.js
index fdf58cf..58177c5 100644
--- a/env.js
+++ b/env.js
@@ -13,6 +13,7 @@ var env = {
BIO: '$BIO',
GITHUB: '$GITHUB',
TWITTER: '$TWITTER',
+ MASTODON: '$MASTODON',
MICRO_BLOG: '$MICRO_BLOG',
INSTAGRAM: '$INSTAGRAM',
FACEBOOK: '$FACEBOOK',
@@ -119,6 +120,14 @@ function useEnv(document) {
twitterEl.remove()
}
+ var mastodonEl = document.getElementById('mastodon');
+ if (env.MASTODON) {
+ mastodonEl.href = env.MASTODON;
+ } else {
+ mastodonEl.nextElementSibling.remove()
+ mastodonEl.remove()
+ }
+
var microblogEl = document.getElementById('microblog');
if (env.MICRO_BLOG) {
microblogEl.href = env.MICRO_BLOG;
diff --git a/template/index.html b/template/index.html
index 9e15c37..c5c03e3 100644
--- a/template/index.html
+++ b/template/index.html
@@ -96,6 +96,10 @@
+
+ Mastodon
+
+
Micro.blog
diff --git a/www/css/brands.css b/www/css/brands.css
index 777a94a..501dece 100644
--- a/www/css/brands.css
+++ b/www/css/brands.css
@@ -278,6 +278,14 @@ button:hover,
.button.button-twitter:focus {
filter: brightness(90%) }
+/* Mastodon */
+.button.button-mastodon {
+ color: #FFFFFF;
+ background-color: #0e68a0 }
+.button.button-mastodon:hover,
+.button.button-mastodon:focus {
+ filter: brightness(90%) }
+
/* Vimeo */
.button.button-vimeo {
color: #FFFFFF;
diff --git a/www/icons/mastodon.svg b/www/icons/mastodon.svg
new file mode 100644
index 0000000..87ec2c5
--- /dev/null
+++ b/www/icons/mastodon.svg
@@ -0,0 +1,4 @@
+