feat: shared components for worlds + p2p instances (#5135)

* feat: base content card component

* fix: tooltips + colors

* feat: fix orgs

* feat: add ContentModpackCard

* fix: extract types

* feat: selection v-model

* add show icon in selected for combobox with stories

* feat: add project combobox

* clean up project combobox

* feat: start install to play modal

* fix: events

* feat: figma alignments

* feat: migrate toggle to tailwind

* fix: row borders

* feat: disabled state

* feat: virtual list impl for card table based on window scroll

* fix: lint

* feat: virtualization + smaller contentcard items

* feat: fix gap + border issues on last elm

* fix: use TeleportOverflowMenu

* fix: hasUpdate type

* fix: fallback to svg if src is invalid on avatar component

* fix: storybook

* feat: start on updater modal

* feat: finish content updater modal

* feat: i18n pass

* remove install to play modal from ui package

* pnpm prepr

* feat: reusable table component

* feat: add column width prop for table and fix stories

* feat: add table overflow menu story example

* feat: add surface-1.5 and use in table

* chore: export table in index

* fix: allow more loose typing on columns

* feat: update table component to derive key from column instead of data

* feat: surface 1.5 for oled + refactor story for contentcardtable + yeet sorting funcs

* fix: lint

* feat: add no padding story for new modal

---------

Signed-off-by: Calum H. <contact@cal.engineer>
Co-authored-by: tdgao <mr.trumgao@gmail.com>

apps/frontend/src/pages/discover/[type]/index.vue

@@ -26,6 +26,7 @@ import {
 	SearchFilterControl,
 	SearchSidebarFilter,
 	type SortType,
+	Toggle,
 	useSearch,
 } from '@modrinth/ui'
 import { capitalizeString, cycleValue, type Mod as InstallableMod } from '@modrinth/utils'
@@ -466,13 +467,7 @@ useSeoMeta({
 				</div>
 				<div class="flex flex-row items-center justify-between gap-2 px-6">
 					<label for="erase-data-on-install"> Erase all data on install </label>
-					<input
-						id="erase-data-on-install"
-						v-model="eraseDataOnInstall"
-						label="Erase all data on install"
-						class="switch stylized-toggle flex-none"
-						type="checkbox"
-					/>
+					<Toggle id="erase-data-on-install" v-model="eraseDataOnInstall" class="flex-none" />
 				</div>
 				<div class="px-6 py-4 text-sm">
 					If enabled, existing mods, worlds, and configurations, will be deleted before installing
@@ -921,8 +916,4 @@ useSeoMeta({
 	mask-image: linear-gradient(to bottom, black, transparent);
 	opacity: 0.25;
 }
-
-.stylized-toggle:checked::after {
-	background: var(--color-accent-contrast) !important;
-}
 </style>