UserCard: Make user roles translateable

I did not add a translation for my native language in this patch because
I am not sure how weblate would react, but I did add it locally and it
seems to work.

src/components/user_card/user_card.vue

@@ -83,7 +83,7 @@
                   v-if="!!visibleRole"
                   class="alert user-role"
                 >
-                  {{ visibleRole }}
+                  {{ $t(`user_card.roles.${visibleRole}`) }}
                 </span>
                 <span
                   v-if="user.bot"
@@ -507,7 +507,6 @@
 
     .user-role {
       flex: none;
-      text-transform: capitalize;
       color: $fallback--text;
       color: var(--alertNeutralText, $fallback--text);
       background-color: $fallback--fg;

src/i18n/en.json

@@ -729,6 +729,10 @@
       "quarantine": "Disallow user posts from federating",
       "delete_user": "Delete user",
       "delete_user_confirmation": "Are you absolutely sure? This action cannot be undone."
+    },
+    "roles": {
+      "admin": "Admin",
+      "moderator": "Moderator"
     }
   },
   "user_profile": {