refactor: Button components (#6929)

* feat: refactor button components

* fix: qa

* fix: storybook

* a11y: pass

* fix: build

* fix: rename default ->md

* fix: lint

* docs: buttons.md

* refactor part 1

* refactor part 2

* fix: undo refactor for fresh restart

* refactor

* Revert "refactor"

This reverts commit 96d65902d7.

* refactor: part 1

* fix: qa

* fix: qa

* fix: qa

* fix: qa

* fix: qa

* fix: qa

* fix: qa

* fix: qa

* fix: remove text-contrast

* fix: qa

* fix: v-tooltip

* fix: lint

* fix: split broken

* fix: passkey qa

* fix: qa

* fix: qa

* fix: prepr

* fix: splitbutton

* improve button group seam

---------

Signed-off-by: Calum H. <calum@modrinth.com>
Co-authored-by: Prospector <6166773+Prospector@users.noreply.github.com>

apps/frontend/src/pages/index.vue

@@ -26,22 +26,24 @@
 				{{ formatMessage(messages.discoverHeading) }}
 			</h2>
 			<div class="button-group">
-				<ButtonStyled color="brand" size="large">
-					<nuxt-link to="/discover/mods">
-						<CompassIcon aria-hidden="true" />
-						{{ formatMessage(messages.discoverMods) }}
-					</nuxt-link>
-				</ButtonStyled>
-				<ButtonStyled size="large" type="outlined">
-					<nuxt-link v-if="!auth.user" to="/auth/sign-up" rel="noopener nofollow">
-						<LogInIcon aria-hidden="true" />
-						{{ formatMessage(commonMessages.signUpButton) }}
-					</nuxt-link>
-					<nuxt-link v-else to="/dashboard/projects">
-						<DashboardIcon aria-hidden="true" />
-						{{ formatMessage(messages.goToDashboard) }}
-					</nuxt-link>
-				</ButtonStyled>
+				<ButtonLink type="colored" color="brand" size="xl" to="/discover/mods">
+					<CompassIcon aria-hidden="true" />
+					{{ formatMessage(messages.discoverMods) }}
+				</ButtonLink>
+				<ButtonLink
+					v-if="!auth.user"
+					type="outlined"
+					size="xl"
+					to="/auth/sign-up"
+					rel="noopener nofollow"
+				>
+					<LogInIcon aria-hidden="true" />
+					{{ formatMessage(commonMessages.signUpButton) }}
+				</ButtonLink>
+				<ButtonLink v-else type="outlined" size="xl" to="/dashboard/projects">
+					<DashboardIcon aria-hidden="true" />
+					{{ formatMessage(messages.goToDashboard) }}
+				</ButtonLink>
 			</div>
 		</div>
 		<div class="users-section-outer">
@@ -444,7 +446,7 @@ import {
 } from '@modrinth/assets'
 import {
 	Avatar,
-	ButtonStyled,
+	ButtonLink,
 	commonMessages,
 	defineMessages,
 	DropdownSelect,