Add link to Bluesky profile

Signed-off-by: Manuel Rego Casasnovas <[email protected]>

Author: mrego

_data/social.json

@@ -1,5 +1,6 @@
 [
   { "title": "GitHub", "color": "github-color", "url": "https://github.com/servo/servo", "icon": "fab fa-github" },
   { "title": "Mastodon", "color": "mastodon-color", "url": "https://floss.social/@servo", "icon": "fab fa-mastodon" },
+  { "title": "Bluesky", "color": "bluesky-color", "url": "https://bsky.app/profile/servo.org", "icon": "fab fa-bluesky" },
   { "title": "Twitter", "color": "twitter-color", "url": "https://twitter.com/ServoDev", "icon": "fab fa-twitter" }
 ]

_includes/footer.html

@@ -5,6 +5,7 @@
     <a href="https://servo.zulipchat.com/">Zulip Chat</a>,
     <a href="https://github.com/servo/servo/discussions">GitHub Discussions</a>,
     <a href="https://floss.social/@servo">Mastodon</a>,
+    <a href="https://bsky.app/profile/servo.org">Bluesky</a>,
     <a href="https://twitter.com/ServoDev">Twitter</a>
   </div>
   <div class="container" style="text-align: center; font-size: 0.875em;">

_includes/social-buttons.html

@@ -1,9 +1,8 @@
 <div class="navbar-end">
   {% for link in social %}
     <div class="navbar-item">
-      <a class="button is-{{ link.color }}" href="{{ link.url | url }}"{% if link.title == "Mastodon" %} rel="me"{% endif %}>
+      <a class="button is-{{ link.color }}" title="{{ link.title }}" href="{{ link.url | url }}"{% if link.title == "Mastodon" %} rel="me"{% endif %}>
         <span class="icon"><i class="{{ link.icon }}"></i></span>
-        <span>{{ link.title }}</span>
       </a>
     </div>
   {% endfor %}

assets/sass/style.sass

@@ -1,7 +1,7 @@
 @charset "utf-8"
 
 @import url("https://fonts.googleapis.com/css?family=Fira+Sans:300,400,600,700|Fira+Mono:300,400,600,700|Fire+Sans:100,200,300,400,500,600,700")
-@import url("https://use.fontawesome.com/releases/v5.12.0/css/all.css")
+@import url("https://use.fontawesome.com/releases/v6.5.2/css/all.css")
 
 // Site-specific variables here
 
@@ -58,8 +58,10 @@ $menu-item-hover-background-color: $dark
 $github-color: #000000
 $twitter-color: #00aced
 $mastodon-color: #6d6eff
+$bluesky-color: #0085ff
 $colors: mergeColorMaps(("github-color": ($github-color, $white)), $colors)
 $colors: mergeColorMaps(("twitter-color": ($twitter-color, $white)), $colors)
+$colors: mergeColorMaps(("bluesky-color": ($bluesky-color, $white)), $colors)
 $colors: mergeColorMaps(("mastodon-color": ($mastodon-color, $white)), $colors)
 
 // Bulma core