diff --git a/content/ui/navbar/social.json b/content/ui/navbar/social.json
new file mode 100644
index 0000000..0ec85e9
--- /dev/null
+++ b/content/ui/navbar/social.json
@@ -0,0 +1,27 @@
+[
+    {
+        "title": "Patreon",
+        "color": "red",
+        "href": "https://patreon.com/Ryujinx",
+        "icon": "fa-patreon"
+    },
+    {
+        "title": "GitHub",
+        "color": "green",
+        "href": "https://github.com/Ryujinx/Ryujinx",
+        "icon": "fa-github"
+    },
+    {
+        "title": "Twitter",
+        "color": "blue",
+        "href": "https://twitter.com/RyujinxEmu",
+        "icon": "fa-twitter"
+        
+    },
+    {
+        "title": "Discord",
+        "color": "#7289DA",
+        "href": "https://discord.gg/VkQYXAZ",
+        "icon": "fa-discord"
+    }
+]
\ No newline at end of file
diff --git a/gridsome.server.js b/gridsome.server.js
index 02bf054..d9403ce 100644
--- a/gridsome.server.js
+++ b/gridsome.server.js
@@ -1,6 +1,17 @@
 const nodeExternals = require('webpack-node-externals')
 const fs = require('fs')
 
+function addJSONCollection(actions,typeName, path) {
+  const list = JSON.parse(fs.readFileSync(path));
+  const collection = actions.addCollection({
+    typeName: typeName
+  })
+
+  for (const element of list) {
+    collection.addNode(element)
+  }
+}
+
 module.exports = function (api) {
   api.chainWebpack((config, { isServer }) => {
     if (isServer) {
@@ -13,15 +24,7 @@ module.exports = function (api) {
   })
 
   api.loadSource(async actions => {
-    const teamList = JSON.parse(fs.readFileSync("./content/team.json"))
-    const teamCollection = actions.addCollection({
-      typeName: 'Team'
-    })
-
-    for (const teamMember of teamList) {
-
-      teamMember.description = teamMember.description | ""
-      teamCollection.addNode(teamMember)
-    }
+    addJSONCollection(actions, "Team", "./content/team.json")
+    addJSONCollection(actions, "SocialNavbarElements", "./content/ui/navbar/social.json")
   })
 }
diff --git a/src/layouts/Default.vue b/src/layouts/Default.vue
index 7cc7e6c..f2e9b31 100644
--- a/src/layouts/Default.vue
+++ b/src/layouts/Default.vue
@@ -29,17 +29,8 @@
           <v-icon>fas fa-gamepad</v-icon>
         </v-btn>
 
-        <v-btn flat color="red" href="https://patreon.com/Ryujinx">
-          <v-icon>fab fa-patreon</v-icon>
-        </v-btn>
-        <v-btn flat color="green" href="https://github.com/Ryujinx/Ryujinx">
-          <v-icon>fab fa-github</v-icon>
-        </v-btn>
-        <v-btn flat color="blue" href="https://twitter.com/RyujinxEmu">
-          <v-icon>fab fa-twitter</v-icon>
-        </v-btn>
-        <v-btn flat color="#7289DA" href="https://discord.gg/VkQYXAZ">
-          <v-icon>fab fa-discord</v-icon>
+        <v-btn flat v-for="element in $static.socialNavbarElements.edges" :key="element.node.id" :color="element.node.color" :href="element.node.href">
+          <v-icon>fab {{ element.node.icon }}</v-icon>
         </v-btn>
       </v-toolbar-items>
       <v-toolbar-items class="hidden-md-and-down">
@@ -54,17 +45,8 @@
           target="_blank"
         >Compatibility</v-btn>
 
-        <v-btn flat color="red" href="https://patreon.com/Ryujinx">
-          <v-icon>fab fa-patreon</v-icon>
-        </v-btn>
-        <v-btn flat color="green" href="https://github.com/Ryujinx/Ryujinx">
-          <v-icon>fab fa-github</v-icon>
-        </v-btn>
-        <v-btn flat color="blue" href="https://twitter.com/RyujinxEmu">
-          <v-icon>fab fa-twitter</v-icon>
-        </v-btn>
-        <v-btn flat color="#7289DA" href="https://discord.gg/VkQYXAZ">
-          <v-icon>fab fa-discord</v-icon>
+        <v-btn flat v-for="element in $static.socialNavbarElements.edges" :key="element.node.id" :color="element.node.color" :href="element.node.href">
+          <v-icon>fab {{ element.node.icon }}</v-icon>
         </v-btn>
       </v-toolbar-items>
       <v-toolbar-items class="ml-0 mr-2">
@@ -125,36 +107,11 @@
 
         <v-divider></v-divider>
 
-        <!-- Patreon -->
-        <v-list-tile color="red" href="https://patreon.com/Ryujinx">
+        <v-list-tile v-for="element in $static.socialNavbarElements.edges" :key="element.node.id" :color="element.node.color" :href="element.node.href">
           <v-list-tile-action>
-            <v-icon color="red">fab fa-patreon</v-icon>
+            <v-icon :color="element.node.color">fab {{ element.node.icon }}</v-icon>
           </v-list-tile-action>
-          <v-list-tile-title>Patreon</v-list-tile-title>
-        </v-list-tile>
-
-        <!-- GitHub -->
-        <v-list-tile color="green" href="https://github.com/Ryujinx/Ryujinx">
-          <v-list-tile-action>
-            <v-icon color="green">fab fa-github</v-icon>
-          </v-list-tile-action>
-          <v-list-tile-title>GitHub</v-list-tile-title>
-        </v-list-tile>
-
-        <!-- YouTube -->
-        <v-list-tile color="blue" href="https://twitter.com/RyujinxEmu">
-          <v-list-tile-action>
-            <v-icon color="blue">fab fa-twitter</v-icon>
-          </v-list-tile-action>
-          <v-list-tile-title>Twitter</v-list-tile-title>
-        </v-list-tile>
-
-        <!-- Discord -->
-        <v-list-tile color="#7289DA" href="https://discord.gg/VkQYXAZ">
-          <v-list-tile-action>
-            <v-icon>fab fa-discord</v-icon>
-          </v-list-tile-action>
-          <v-list-tile-title>Discord</v-list-tile-title>
+          <v-list-tile-title>{{element.node.title}}</v-list-tile-title>
         </v-list-tile>
       </v-list>
     </v-navigation-drawer>
@@ -178,6 +135,22 @@ query {
 }
 </static-query>
 
+
+<static-query>
+query {
+  socialNavbarElements: allSocialNavbarElements(order: ASC) {
+    edges {
+      node {
+        title
+        color
+        href
+        icon
+      }
+    }
+  }
+}
+</static-query>
+
 <style scoped>
 .btn {
   min-width: 0;
diff --git a/src/pages/Index.vue b/src/pages/Index.vue
index d38910e..81d16b3 100644
--- a/src/pages/Index.vue
+++ b/src/pages/Index.vue
@@ -52,7 +52,7 @@
               <v-flex xs12 md4>
                 <v-card class="elevation-0 transparent">
                   <v-card-text class="text-xs-center">
-                    <v-icon x-large class="ryu_blue--text text--lighten-2">fab fa-github</v-icon>
+                    <v-icon x-large class="--text text--lighten-2">fab fa-github</v-icon>
                   </v-card-text>
                   <v-card-title primary-title class="layout justify-center">
                     <div class="display-1 text-xs-center">Where can I grab it?</div>
@@ -67,7 +67,7 @@
               <v-flex xs12 md4>
                 <v-card class="elevation-0 transparent">
                   <v-card-text class="text-xs-center">
-                    <v-icon x-large class="ryu_blue--text text--lighten-2">fas fa-code</v-icon>
+                    <v-icon x-large class="--text text--lighten-2">fas fa-code</v-icon>
                   </v-card-text>
                   <v-card-title primary-title class="layout justify-center">
                     <div class="display-1 text-xs-center">How can I contribute?</div>
@@ -80,7 +80,7 @@
               <v-flex xs12 md4>
                 <v-card class="elevation-0 transparent">
                   <v-card-text class="text-xs-center">
-                    <v-icon x-large class="ryu_blue--text text--lighten-2">fas fa-gamepad</v-icon>
+                    <v-icon x-large class="--text text--lighten-2">fas fa-gamepad</v-icon>
                   </v-card-text>
                   <v-card-title primary-title class="layout justify-center">
                     <div class="display-1 text-xs-center">Gaming?</div>
@@ -100,9 +100,9 @@
               <v-flex xs12 md4>
                 <v-card class="elevation-0 transparent">
                   <v-card-text class="text-xs-center">
-                    <v-icon x-large class="ryu_blue--text text--lighten-2 mr-4">fab fa-windows</v-icon>
-                    <v-icon x-large class="ryu_blue--text text--lighten-2 mr-4">fab fa-apple</v-icon>
-                    <v-icon x-large class="ryu_blue--text text--lighten-2">fab fa-linux</v-icon>
+                    <v-icon x-large class="--text text--lighten-2 mr-4">fab fa-windows</v-icon>
+                    <v-icon x-large class="--text text--lighten-2 mr-4">fab fa-apple</v-icon>
+                    <v-icon x-large class="--text text--lighten-2">fab fa-linux</v-icon>
                   </v-card-text>
                   <v-card-title primary-title class="layout justify-center">
                     <div class="display-1 text-xs-center">Platforms</div>
@@ -115,7 +115,7 @@
               <v-flex xs12 md4>
                 <v-card class="elevation-0 transparent">
                   <v-card-text class="text-xs-center">
-                    <v-icon x-large class="ryu_blue--text text--lighten-2">fab fa-discord</v-icon>
+                    <v-icon x-large class="--text text--lighten-2">fab fa-discord</v-icon>
                   </v-card-text>
                   <v-card-title primary-title class="layout justify-center">
                     <div class="display-1 text-xs-center">Discord</div>
@@ -129,7 +129,7 @@
               <v-flex xs12 md4>
                 <v-card class="elevation-0 transparent">
                   <v-card-text class="text-xs-center">
-                    <v-icon x-large class="ryu_blue--text text--lighten-2">fab fa-nintendo-switch</v-icon>
+                    <v-icon x-large class="--text text--lighten-2">fab fa-nintendo-switch</v-icon>
                   </v-card-text>
                   <v-card-title primary-title class="layout justify-center">
                     <div class="display-1 text-xs-center">Why the name?</div>
@@ -154,7 +154,7 @@
               <v-flex xs12>
                 <v-card class="elevation-0 transparent">
                   <v-card-text class="text-xs-center">
-                    <v-icon x-large class="ryu_blue--text text--lighten-2">fas fa-users</v-icon>
+                    <v-icon x-large class="--text text--lighten-2">fas fa-users</v-icon>
                   </v-card-text>
                   <v-card-title primary-title class="layout justify-center">
                     <div class="display-1 text-xs-center">Our Team</div>
@@ -162,11 +162,6 @@
                 </v-card>
               </v-flex>
             </v-layout>
-            <v-layout v-if="loading" row wrap align-center justify-center>
-              <v-flex xs12 class="text-xs-center">
-                <v-progress-circular :size="100" indeterminate color="primary"></v-progress-circular>
-              </v-flex>
-            </v-layout>
             <v-layout row wrap align-start justify-center>
               <v-flex xs12 sm4 md2 v-for="member in $page.teams.edges" :key="member.node.id">
                 <v-card class="elevation-0 transparent">