fix: 디자인정리

Author: JKyEun

src/routes/__root.tsx

@@ -8,7 +8,7 @@ export const Route = createRootRoute({
 function RootComponent() {
   return (
     <OverlayProvider>
-      <div className="bg-neutral-200 min-h-dvh max-w-[600px] mx-auto outline outline-1 outline-gray-200 -outline-offset-1">
+      <div className="bg-neutral-200 min-h-dvh max-w-[600px] mx-auto">
         <Outlet />
       </div>
     </OverlayProvider>

src/routes/mission/-components/MissionHeader.tsx

@@ -46,7 +46,7 @@ export default function MissionHeader() {
   };
 
   return (
-    <div className="py-4 px-4">
+    <div className="sticky top-0 py-4 px-4 bg-neutral-500 h-[78px]">
       <div className="max-w-7xl mx-auto">
         <div className="flex justify-between items-center">
           <div className="flex items-center gap-3">

src/routes/mission/index.tsx

@@ -176,8 +176,8 @@ function Mission() {
   });
 
   return (
-    <div className="flex flex-col gap-4">
-      <div className="flex justify-between items-center px-4">
+    <div className="flex flex-col">
+      <div className="flex justify-between sticky top-[78px] items-center px-4 bg-neutral-500 pb-4">
         <div id="mission-filters" className="flex gap-2">
           {(["all", "not_tried", "failed", "success"] as const).map((type) => (
             <button