refactor: move flags into settings, change icon (#5678)

* refactor: move flags into settings, change icon

* fix: use ButtonStyled for app

apps/app-frontend/src/components/ui/settings/FeatureFlagSettings.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Toggle } from '@modrinth/ui'
+import { ButtonStyled, Toggle } from '@modrinth/ui'
 import { ref, watch } from 'vue'
 
 import { get as getSettings, set as setSettings } from '@/helpers/settings.ts'
@@ -31,11 +31,20 @@ watch(
 				{{ option.replaceAll('_', ' ') }}
 			</h2>
 		</div>
-
-		<Toggle
-			id="advanced-rendering"
-			:model-value="themeStore.getFeatureFlag(option)"
-			@update:model-value="() => setFeatureFlag(option, !themeStore.getFeatureFlag(option))"
-		/>
+		<div class="flex items-center gap-2">
+			<ButtonStyled type="transparent">
+				<button
+					:disabled="themeStore.getFeatureFlag(option) === DEFAULT_FEATURE_FLAGS[option]"
+					@click="setFeatureFlag(option, DEFAULT_FEATURE_FLAGS[option])"
+				>
+					Reset to default
+				</button>
+			</ButtonStyled>
+			<Toggle
+				id="advanced-rendering"
+				:model-value="themeStore.getFeatureFlag(option)"
+				@update:model-value="() => setFeatureFlag(option, !themeStore.getFeatureFlag(option))"
+			/>
+		</div>
 	</div>
 </template>