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>

packages/ui/src/components/servers/InstallingBanner.vue

@@ -27,18 +27,17 @@
 			</div>
 		</div>
 		<template v-if="contentError" #top-right-actions>
-			<ButtonStyled color="red" type="outlined">
-				<button
-					v-tooltip="retryDisabled ? retryDisabledTooltip : undefined"
-					class="!border"
-					type="button"
-					:disabled="retryDisabled"
-					@click="emit('retry')"
-				>
-					<RotateCounterClockwiseIcon class="size-5" />
-					{{ formatMessage(commonMessages.retryButton) }}
-				</button>
-			</ButtonStyled>
+			<Button
+				v-tooltip="retryDisabled ? retryDisabledTooltip : undefined"
+				type="outlined"
+				class="!border !text-red [&>svg]:!text-red !shadow-[inset_0_0_0_1px_var(--color-red)]"
+				native-type="button"
+				:disabled="retryDisabled"
+				@click="emit('retry')"
+			>
+				<RotateCounterClockwiseIcon class="size-5" />
+				{{ formatMessage(commonMessages.retryButton) }}
+			</Button>
 		</template>
 	</Admonition>
 </template>
@@ -47,11 +46,11 @@
 import { RotateCounterClockwiseIcon } from '@modrinth/assets'
 import { computed, onMounted, onUnmounted, ref } from 'vue'
 
+import { Button } from '#ui/components/base/buttons'
 import { defineMessages, useVIntl } from '#ui/composables/i18n'
 import { commonMessages } from '#ui/utils/common-messages'
 
 import Admonition from '../base/Admonition.vue'
-import ButtonStyled from '../base/ButtonStyled.vue'
 
 export interface SyncProgress {
 	phase: 'Analyzing' | 'InstallingPack' | 'InstallingLoader' | 'Addons'