docs: use vitepress v1 (#993)

5 files changed, 136 insertions, 172 deletions

diff --git a/docs/about/team.md b/docs/about/team.md
index 9013ee90..a3502b76 100644
--- a/docs/about/team.md
+++ b/docs/about/team.md
@@ -1,9 +1,11 @@
 ---
+layout: page
 title: Team
+description: The development of Faker is guided by an international team.
 ---
 
 <script setup>
-  import TeamPage from './team/TeamPage.vue'
+import TeamPage from './team/TeamPage.vue'
 </script>
 
 <TeamPage />
diff --git a/docs/about/team/TeamMember.ts b/docs/about/team/TeamMember.ts
deleted file mode 100644
index 01fe3771..00000000
--- a/docs/about/team/TeamMember.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export interface Member {
-  readonly name: string;
-  readonly github: string;
-  readonly gitlab?: string;
-  readonly twitter?: string;
-  readonly roles: readonly string[];
-}
diff --git a/docs/about/team/TeamMember.vue b/docs/about/team/TeamMember.vue
deleted file mode 100644
index 03514a1f..00000000
--- a/docs/about/team/TeamMember.vue
+++ /dev/null
@@ -1,76 +0,0 @@
-<script lang="ts" setup>
-import type { Member } from './TeamMember';
-
-defineProps<{ member: Member }>();
-</script>
-
-<template>
-  <div class="TeamMember">
-    <div class="avatar">
-      <img :src="'https://github.com/' + member.github + '.png'" width="120" />
-    </div>
-    <div class="info">
-      <div class="name">
-        <b>{{ member.name }}</b>
-      </div>
-      <div class="socials">
-        <a :href="'https://github.com/' + member.github">
-          <img
-            src="https://img.icons8.com/ios-glyphs/344/github.png"
-            alt="GitHub"
-            title="GitHub"
-            width="32"
-          />
-        </a>
-        <a v-if="member.gitlab" :href="'https://gitlab.com/' + member.gitlab">
-          <img
-            src="https://img.icons8.com/color/344/gitlab.png"
-            alt="GitLab"
-            title="GitLab"
-            width="32"
-          />
-        </a>
-        <a
-          v-if="member.twitter"
-          :href="'https://twitter.com/' + member.twitter"
-        >
-          <img
-            src="https://img.icons8.com/color/344/twitter.png"
-            alt="Twitter"
-            title="Twitter"
-            width="32"
-          />
-        </a>
-      </div>
-      <div v-if="member.roles?.length" class="roles">
-        <span>Roles: </span>
-        <template v-for="(role, index) in member.roles">
-          <i>{{ role }}</i>
-          <span v-if="index < member.roles.length - 1">, </span>
-        </template>
-      </div>
-    </div>
-  </div>
-</template>
-
-<style scoped>
-.TeamMember {
-  padding: 0.5em;
-
-  display: flex;
-  align-items: center;
-}
-
-.TeamMember .avatar {
-  flex: 0 0 120px;
-  margin-right: 1em;
-}
-
-.TeamMember .avatar img {
-  border-radius: 50%;
-}
-
-.TeamMember .roles i {
-  white-space: nowrap;
-}
-</style>
diff --git a/docs/about/team/TeamPage.vue b/docs/about/team/TeamPage.vue
index 99801f17..67171917 100644
--- a/docs/about/team/TeamPage.vue
+++ b/docs/about/team/TeamPage.vue
@@ -1,60 +1,41 @@
-<script lang="ts" setup>
-import membersData from './members.json';
-import TeamMember from './TeamMember.vue';
+<script setup lang="ts">
+import {
+  VPTeamMembers,
+  VPTeamPage,
+  VPTeamPageSection,
+  VPTeamPageTitle,
+} from 'vitepress/theme';
+import { contributors, core, emeriti } from './members.json';
 </script>
 
 <template>
-  <div class="TeamPage">
-    <div class="core">
-      <h2>Core Team</h2>
-      <div class="members">
-        <TeamMember
-          v-for="member in membersData.core"
-          :key="member.name"
-          :member="member"
-        />
-      </div>
-    </div>
+  <VPTeamPage>
+    <VPTeamPageTitle>
+      <template #title>Meet the Team</template>
+      <template #lead>
+        The development of Faker is guided by an international team, some of
+        whom have chosen to be featured below.
+      </template>
+    </VPTeamPageTitle>
 
-    <div class="contributors">
-      <h2>Contributors</h2>
-      <div class="members">
-        <TeamMember
-          v-for="member in membersData.contributors"
-          :key="member.name"
-          :member="member"
-        />
-      </div>
-    </div>
+    <VPTeamMembers :members="core" />
 
-    <div class="previous">
-      <h2>Honorable previous members</h2>
-      <div class="members">
-        <TeamMember
-          v-for="member in membersData.previous"
-          :key="member.name"
-          :member="member"
-        />
-      </div>
-    </div>
-  </div>
-</template>
-
-<style scoped>
-.TeamPage .members {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  width: 100%;
-}
+    <VPTeamPageSection>
+      <template #title>Team Contributors</template>
+      <template #members>
+        <VPTeamMembers :members="contributors" />
+      </template>
+    </VPTeamPageSection>
 
-.TeamPage .members .TeamMember {
-  width: 50%;
-}
-
-@media (max-width: 120rem) {
-  .TeamPage .members .TeamMember {
-    width: 100%;
-  }
-}
-</style>
+    <VPTeamPageSection>
+      <template #title>Team Emeriti</template>
+      <template #lead>
+        Here we honor some no-longer-active team members who have made valuable
+        contributions in the past.
+      </template>
+      <template #members>
+        <VPTeamMembers size="small" :members="emeriti" />
+      </template>
+    </VPTeamPageSection>
+  </VPTeamPage>
+</template>
diff --git a/docs/about/team/members.json b/docs/about/team/members.json
index 31018175..7732eab2 100644
--- a/docs/about/team/members.json
+++ b/docs/about/team/members.json
@@ -1,77 +1,141 @@
 {
   "core": [
     {
+      "avatar": "https://github.com/Shinigami92.png",
       "name": "Christopher Quadflieg",
-      "github": "Shinigami92",
-      "twitter": "Shini_92",
-      "roles": ["Code Maintainer"]
+      "title": "Code Maintainer",
+      "org": "Faker",
+      "orgLink": "https://fakerjs.dev",
+      "desc": "Passionate TypeScript enthusiast. Also core member of Vite.",
+      "links": [
+        { "icon": "github", "link": "https://github.com/Shinigami92" },
+        { "icon": "twitter", "link": "https://twitter.com/Shini_92" }
+      ],
+      "sponsor": "https://github.com/sponsors/Shinigami92"
     },
     {
+      "avatar": "https://github.com/damienwebdev.png",
       "name": "Damien Retzinger",
-      "github": "damienwebdev",
-      "twitter": "damienwebdev",
-      "roles": ["Advisor"]
+      "title": "Advisor",
+      "org": "",
+      "orgLink": "",
+      "desc": "",
+      "links": [
+        { "icon": "github", "link": "https://github.com/damienwebdev" },
+        { "icon": "twitter", "link": "https://twitter.com/damienwebdev" }
+      ],
+      "sponsor": "https://github.com/sponsors/damienwebdev"
     },
     {
+      "avatar": "https://github.com/prisis.png",
       "name": "Daniel Bannert",
-      "github": "prisis",
-      "twitter": "_prisis_",
-      "roles": ["Organization Owner"]
+      "title": "Organization Owner",
+      "org": "",
+      "orgLink": "",
+      "desc": "",
+      "links": [
+        { "icon": "github", "link": "https://github.com/prisis" },
+        { "icon": "twitter", "link": "https://twitter.com/_prisis_" }
+      ],
+      "sponsor": "https://github.com/sponsors/prisis"
     },
     {
+      "avatar": "https://github.com/ST-DDT.png",
       "name": "Daniel Theuke",
-      "github": "ST-DDT",
-      "roles": ["Code Maintainer", "Docs Automation"]
+      "title": "Code Maintainer | Docs Automation",
+      "org": "",
+      "orgLink": "",
+      "desc": "",
+      "links": [{ "icon": "github", "link": "https://github.com/ST-DDT" }],
+      "sponsor": "https://github.com/sponsors/ST-DDT"
     },
     {
+      "avatar": "https://github.com/clarkerican.png",
       "name": "Erica Clark",
-      "github": "clarkerican",
-      "twitter": "clarkerican",
-      "roles": []
+      "title": "",
+      "org": "",
+      "orgLink": "",
+      "desc": "",
+      "links": [
+        { "icon": "github", "link": "https://github.com/clarkerican" },
+        { "icon": "twitter", "link": "https://twitter.com/clarkerican" }
+      ]
     },
     {
+      "avatar": "https://github.com/griest024.png",
       "name": "griest",
-      "github": "griest024",
-      "gitlab": "griest",
-      "roles": ["Code Reviewer"]
+      "title": "Code Reviewer",
+      "org": "",
+      "orgLink": "",
+      "desc": "",
+      "links": [
+        { "icon": "github", "link": "https://github.com/griest024" },
+        { "icon": "gitlab", "link": "https://gitlab.com/griest" }
+      ]
     },
     {
+      "avatar": "https://github.com/JessicaSachs.png",
       "name": "Jessica Sachs",
-      "github": "JessicaSachs",
-      "twitter": "_JessicaSachs",
-      "roles": ["Press Officer"]
+      "title": "Press Officer",
+      "org": "",
+      "orgLink": "",
+      "desc": "",
+      "links": [
+        { "icon": "github", "link": "https://github.com/JessicaSachs" },
+        { "icon": "twitter", "link": "https://twitter.com/_JessicaSachs" }
+      ],
+      "sponsor": "https://github.com/sponsors/JessicaSachs"
     }
   ],
   "contributors": [
     {
+      "avatar": "https://github.com/import-brain.png",
       "name": "Eric Cheng",
-      "github": "import-brain",
-      "roles": ["Triage", "Contributor"]
+      "title": "Triage",
+      "org": "",
+      "orgLink": "",
+      "desc": "",
+      "links": [{ "icon": "github", "link": "https://github.com/import-brain" }]
     },
     {
+      "avatar": "https://github.com/xDivisionByZerox.png",
       "name": "Leyla Jähnig",
-      "github": "xDivisionByZerox",
-      "roles": ["Contributor"]
+      "title": "Contributor",
+      "desc": "",
+      "links": [
+        { "icon": "github", "link": "https://github.com/xDivisionByZerox" }
+      ]
     },
     {
+      "avatar": "https://github.com/pkuczynski.png",
       "name": "Piotr Kuczynski",
-      "github": "pkuczynski",
-      "twitter": "PiotrKuczynski",
-      "roles": ["Contributor"]
+      "title": "Contributor",
+      "org": "",
+      "orgLink": "",
+      "desc": "",
+      "links": [
+        { "icon": "github", "link": "https://github.com/pkuczynski" },
+        { "icon": "twitter", "link": "https://twitter.com/PiotrKuczynski" }
+      ],
+      "sponsor": "https://github.com/sponsors/pkuczynski"
     }
   ],
-  "previous": [
+  "emeriti": [
     {
+      "avatar": "https://github.com/MateusDadalto.png",
       "name": "Mateus Dadalto",
-      "github": "MateusDadalto",
-      "twitter": "MateusD",
-      "roles": []
+      "links": [
+        { "icon": "github", "link": "https://github.com/MateusDadalto" },
+        { "icon": "twitter", "link": "https://twitter.com/MateusD" }
+      ]
     },
     {
+      "avatar": "https://github.com/mmahalwy.png",
       "name": "Mo Mahallawy",
-      "github": "mmahalwy",
-      "twitter": "mmahalwy",
-      "roles": []
+      "links": [
+        { "icon": "github", "link": "https://github.com/mmahalwy" },
+        { "icon": "twitter", "link": "https://twitter.com/mmahalwy" }
+      ]
     }
   ]
 }