From ee5461a2974d5949fdf719a1a152159ab7cfaa60 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Fri, 2 Jan 2026 11:28:11 -0600
Subject: [PATCH] feat: reset button

---
 .../TankSearch/components/FilterControl.tsx    | 18 ++++++++----------
 .../src/pages/[...locale]/tanks/_index.tsx     |  2 +-
 2 files changed, 9 insertions(+), 11 deletions(-)

diff --git a/packages/website/src/components/TankSearch/components/FilterControl.tsx b/packages/website/src/components/TankSearch/components/FilterControl.tsx
index 4cfddb32f..61fa56580 100644
--- a/packages/website/src/components/TankSearch/components/FilterControl.tsx
+++ b/packages/website/src/components/TankSearch/components/FilterControl.tsx
@@ -12,6 +12,7 @@ import locales from "@blitzkit/i18n/locales.json";
 import {
   LockClosedIcon,
   LockOpen2Icon,
+  ResetIcon,
   TrashIcon,
 } from "@radix-ui/react-icons";
 import {
@@ -128,7 +129,7 @@ const TIERS = times(10, (i) => 10 - i);
 
 export function FilterControl() {
   return (
-    <Flex align="center" gap="2" wrap="wrap" justify="center">
+    <Flex align="center" gap="2" wrap="wrap">
       <TiersFilter />
       <ClassFilter />
       <TypeFilter />
@@ -144,25 +145,22 @@ export function FilterControl() {
       <AbilitiesFilter />
       <PowersFilter />
 
-      <ClearButton />
+      <ResetButton />
     </Flex>
   );
 }
 
-function ClearButton() {
-  const { strings } = useLocale();
-
+function ResetButton() {
   return (
-    <Button
+    <IconButton
       color="red"
-      variant="surface"
+      variant="solid"
       onClick={() => {
         TankFilters.set(TankFilters.initial);
       }}
     >
-      <TrashIcon />
-      {strings.website.common.tank_search.clear}
-    </Button>
+      <ResetIcon />
+    </IconButton>
   );
 }
 
diff --git a/packages/website/src/pages/[...locale]/tanks/_index.tsx b/packages/website/src/pages/[...locale]/tanks/_index.tsx
index af64cd976..f5b22a310 100644
--- a/packages/website/src/pages/[...locale]/tanks/_index.tsx
+++ b/packages/website/src/pages/[...locale]/tanks/_index.tsx
@@ -12,7 +12,7 @@ export function Page({
 }: LocaleAcceptorProps & MaybeSkeletonComponentProps) {
   return (
     <LocaleProvider locale={locale}>
-      <PageWrapper color="purple" maxWidth="90rem">
+      <PageWrapper color="purple" maxWidth="80rem">
         <TankSearch skeleton={skeleton} />
       </PageWrapper>
     </LocaleProvider>