From 189fdd8a508f640a3d57247a6d3bc939ee71db96 Mon Sep 17 00:00:00 2001 From: Monixc Date: Sun, 3 Aug 2025 20:55:46 +0900 Subject: [PATCH 01/23] =?UTF-8?q?fix:=20search=20=ED=8E=98=EC=9D=B4?= =?UTF-8?q?=EC=A7=80=EC=97=90=EC=84=9C=20=EC=A7=81=EC=A0=91=20GlobalLayout?= =?UTF-8?q?=20=EC=82=AC=EC=9A=A9=ED=95=98=EB=8A=94=20=EC=BD=94=EB=93=9C=20?= =?UTF-8?q?=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/search/index.tsx | 35 ++++++++++++++++------------------- 1 file changed, 16 insertions(+), 19 deletions(-) diff --git a/src/pages/search/index.tsx b/src/pages/search/index.tsx index aa0fd91..6718850 100644 --- a/src/pages/search/index.tsx +++ b/src/pages/search/index.tsx @@ -1,5 +1,4 @@ import { useState } from "react"; -import GlobalLayout from "@/components/layout/GlobalLayout"; import RecentSearchList from "@/components/search/RecentSearchList"; import SearchHeader from "@/components/search/SearchHeader"; @@ -24,24 +23,22 @@ export default function SearchPage() { }; return ( - -
- {}} - /> +
+ {}} + /> -
- -
-
- +
+ +
+
); } From c9cb4f8f3143b0f50053522f82f07d8f040d8015 Mon Sep 17 00:00:00 2001 From: Monixc Date: Sun, 3 Aug 2025 21:05:07 +0900 Subject: [PATCH 02/23] =?UTF-8?q?refactor:=20=EB=A0=88=EC=9D=B4=EC=95=84?= =?UTF-8?q?=EC=9B=83=20=EA=B5=AC=EC=A1=B0=20=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 페이지 별 레이아웃 관리를 app.tsx -> globalLayout에서 담당하도록 변경 - 기존에 globalLayout에서 처리하던 header를 컴포넌트로 분리, 페이지에서 import 하여 사용하도록 변경 - header에서 bookmark, like 등 일부 기능을 처리해야 해서 컴포넌트 분리 후 페이지에서 import 하는 방식 선택 - bottomnavigation 아이콘 클릭 시 해당 페이지로 이동 --- src/App.tsx | 31 +---------- src/components/layout/BottomNavigation.tsx | 18 +++--- src/components/layout/GlobalLayout.tsx | 31 +++++------ src/components/layout/Header.tsx | 64 +++++++++++++--------- src/constants/navigation.ts | 28 ++++++---- src/index.css | 12 +++- src/main.tsx | 14 +++++ 7 files changed, 105 insertions(+), 93 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index 86cf28d..965b01a 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,36 +1,7 @@ -import { Outlet, useLocation } from "react-router-dom"; +import { Outlet } from "react-router-dom"; import GlobalLayout from "./components/layout/GlobalLayout"; function App() { - const location = useLocation(); - - const layoutGroups = { - full: ["/", "/board", "/explore", "/my"], // header + bottom nav - headerOnly: ["/developer", "/community", "/onboarding"], // only header - none: ["/login", "/search"], // no header and bottom nav - }; - - const currentPath = location.pathname; - - // no header and bottom nav - if (layoutGroups.none.some((path) => currentPath.startsWith(path))) { - return ( - - - - ); - } - - // only header - if (layoutGroups.headerOnly.some((path) => currentPath.startsWith(path))) { - return ( - - - - ); - } - - // basic(header + bommon nav) return ( diff --git a/src/components/layout/BottomNavigation.tsx b/src/components/layout/BottomNavigation.tsx index 8d9b8ac..f6f64e5 100644 --- a/src/components/layout/BottomNavigation.tsx +++ b/src/components/layout/BottomNavigation.tsx @@ -1,19 +1,22 @@ -import { NAV_ITEMS } from '@/constants/navigation'; -import { Button } from '../ui/button'; +import { NAV_ITEMS } from "@/constants/navigation"; +import { Button } from "../ui/button"; +import { useLocation, useNavigate } from "react-router-dom"; export default function BottomNavigation() { + const location = useLocation(); + const navigate = useNavigate(); + return ( ); -} \ No newline at end of file +} diff --git a/src/components/layout/GlobalLayout.tsx b/src/components/layout/GlobalLayout.tsx index 5c60167..b4cc8bf 100644 --- a/src/components/layout/GlobalLayout.tsx +++ b/src/components/layout/GlobalLayout.tsx @@ -1,31 +1,28 @@ import type { ReactNode } from "react"; -import Header from "./Header"; import BottomNavigation from "./BottomNavigation"; +import { useLocation } from "react-router-dom"; interface GlobalLayoutProps { children: ReactNode; - showHeader?: boolean; - showBottomNavigation?: boolean; - headerTitle?: string; } -function GlobalLayout({ - children, - showHeader = true, - showBottomNavigation = true, - headerTitle -}: GlobalLayoutProps) { +function GlobalLayout({ children }: GlobalLayoutProps) { + const location = useLocation(); + + const shouldShowBottomNav = ["/board", "/explore", "/chat", "/my"].some( + (path) => location.pathname.startsWith(path) + ); + return (
-
- {showHeader &&
} -
+
+
{children}
- {showBottomNavigation && } + {shouldShowBottomNav && }
-
+
); -}; +} -export default GlobalLayout; \ No newline at end of file +export default GlobalLayout; diff --git a/src/components/layout/Header.tsx b/src/components/layout/Header.tsx index 02d2955..963f3c4 100644 --- a/src/components/layout/Header.tsx +++ b/src/components/layout/Header.tsx @@ -1,40 +1,52 @@ -import { ArrowLeft, Search } from 'lucide-react'; -import { Button } from '@/components/ui/button'; +import { Button } from "@/components/ui/button"; interface HeaderProps { title?: string; + leftIcon?: React.ReactNode; + rightIcon?: React.ReactNode; + onLeftClick?: () => void; + onRightClick?: () => void; } -export default function Header({ title = "COMEET" }: HeaderProps) { - const iconButtonClass = "mx-2 text-white hover:bg-brand-surface hover:text-brand-primary cursor-pointer"; +export default function Header({ + title = "COMEET", + leftIcon, + rightIcon, + onLeftClick, + onRightClick, +}: HeaderProps) { + const iconButtonClass = + "mx-2 text-white hover:bg-brand-surface hover:text-brand-primary cursor-pointer"; return ( -
-
- +
+
+ {leftIcon && ( + + )}
-
-

{title}

+
+

{title}

-
- +
+ {rightIcon && ( + + )}
); -} \ No newline at end of file +} diff --git a/src/constants/navigation.ts b/src/constants/navigation.ts index 734d4da..2577791 100644 --- a/src/constants/navigation.ts +++ b/src/constants/navigation.ts @@ -1,4 +1,10 @@ -import { Home, MapPin, MessageCircle, User, type LucideIcon } from 'lucide-react'; +import { + Home, + MapPin, + MessageCircle, + User, + type LucideIcon, +} from "lucide-react"; interface NavItem { id: string; @@ -8,23 +14,23 @@ interface NavItem { export const NAV_ITEMS: NavItem[] = [ { - id: 'home', + id: "home", icon: Home, - path: '/' + path: "/board", }, { - id: 'nearby', + id: "nearby", icon: MapPin, - path: '/nearby' + path: "/explore", }, { - id: 'chat', + id: "chat", icon: MessageCircle, - path: '/chat' + path: "/chat", }, { - id: 'profile', + id: "profile", icon: User, - path: '/profile' - } -]; \ No newline at end of file + path: "/my", + }, +]; diff --git a/src/index.css b/src/index.css index 964cecb..d892e36 100644 --- a/src/index.css +++ b/src/index.css @@ -125,4 +125,14 @@ body { @apply bg-background text-foreground; } -} \ No newline at end of file +} + +/* 스크롤바 숨김 */ +.scrollbar-hide { + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ +} + +.scrollbar-hide::-webkit-scrollbar { + display: none; /* Chrome, Safari and Opera */ +} diff --git a/src/main.tsx b/src/main.tsx index 3c9cf3f..3ac4e11 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -10,6 +10,8 @@ import { DeveloperPage } from "./pages/developer/index.tsx"; import { ExplorePage } from "./pages/explore/index.tsx"; import { OnboardingPage } from "./pages/onboarding/OnboardingPage.tsx"; import { PostDetailPage } from "./pages/community/PostDetailPage.tsx"; +import ChatPage from "./pages/chat/index.tsx"; +import SearchPage from "./pages/search/index.tsx"; async function enableMocking() { if (import.meta.env.DEV) { @@ -27,6 +29,10 @@ const router = createBrowserRouter([ index: true, element: , }, + { + path: "board", + element: , + }, { path: "board/:category", element: , @@ -35,6 +41,10 @@ const router = createBrowserRouter([ path: "explore", element: , }, + { + path: "chat", + element: , + }, { path: "my", element: , @@ -55,6 +65,10 @@ const router = createBrowserRouter([ path: "onboarding", element: , }, + { + path: "search", + element: , + }, ], }, ]); From a25ec2511461e984594b7ff94c279eb93e09e698 Mon Sep 17 00:00:00 2001 From: Monixc Date: Mon, 4 Aug 2025 01:30:00 +0900 Subject: [PATCH 03/23] =?UTF-8?q?style:=20=EA=B2=80=EC=83=89=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20?= =?UTF-8?q?=EA=B5=AC=EC=A1=B0=20=EB=B0=8F=20=EC=8A=A4=ED=83=80=EC=9D=BC=20?= =?UTF-8?q?=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - RecentSearchList 및 SearchHeader 컴포넌트를 _components 폴더로 이동 - RecentSearchList 삭제 아이콘 p-0 적용하여 정렬 스타일 개선 - SearchHeader 컴포넌트 스타일 수정 --- .../search/_components}/RecentSearchList.tsx | 18 +++++++--------- .../search/_components}/SearchHeader.tsx | 21 +++++++++---------- src/pages/search/index.tsx | 7 +++---- 3 files changed, 21 insertions(+), 25 deletions(-) rename src/{components/search => pages/search/_components}/RecentSearchList.tsx (77%) rename src/{components/search => pages/search/_components}/SearchHeader.tsx (70%) diff --git a/src/components/search/RecentSearchList.tsx b/src/pages/search/_components/RecentSearchList.tsx similarity index 77% rename from src/components/search/RecentSearchList.tsx rename to src/pages/search/_components/RecentSearchList.tsx index 546301c..a0f3438 100644 --- a/src/components/search/RecentSearchList.tsx +++ b/src/pages/search/_components/RecentSearchList.tsx @@ -1,5 +1,5 @@ -import { Button } from '@/components/ui/button'; -import { X } from 'lucide-react'; +import { Button } from "@/components/ui/button"; +import { X } from "lucide-react"; interface RecentSearchListProps { searches: string[]; @@ -10,7 +10,7 @@ interface RecentSearchListProps { export default function RecentSearchList({ searches, onSearchClick, - onRemove + onRemove, }: RecentSearchListProps) { if (searches.length === 0) { return ( @@ -21,27 +21,25 @@ export default function RecentSearchList({ } return ( - <> +
{searches.map((search, index) => (
))} - +
); } diff --git a/src/components/search/SearchHeader.tsx b/src/pages/search/_components/SearchHeader.tsx similarity index 70% rename from src/components/search/SearchHeader.tsx rename to src/pages/search/_components/SearchHeader.tsx index 7e8110a..bff3bd8 100644 --- a/src/components/search/SearchHeader.tsx +++ b/src/pages/search/_components/SearchHeader.tsx @@ -1,5 +1,5 @@ -import { Button } from '@/components/ui/button'; -import { ArrowLeft } from 'lucide-react'; +import { Button } from "@/components/ui/button"; +import { ArrowLeft } from "lucide-react"; interface SearchHeaderProps { query: string; @@ -12,31 +12,30 @@ export default function SearchHeader({ query, onQueryChange, onSubmit, - onBack + onBack, }: SearchHeaderProps) { return ( -
+
-
+ onQueryChange(e.target.value)} placeholder="검색어 입력" className=" - w-full p-3 + w-full p-2 bg-brand-surface - rounded-lg + rounded-md text-white - placeholder-white + placeholder-gray-500 focus:outline-none focus:ring-1 focus:ring-brand-primary @@ -46,4 +45,4 @@ export default function SearchHeader({
); -} \ No newline at end of file +} diff --git a/src/pages/search/index.tsx b/src/pages/search/index.tsx index 6718850..b141572 100644 --- a/src/pages/search/index.tsx +++ b/src/pages/search/index.tsx @@ -1,6 +1,6 @@ import { useState } from "react"; -import RecentSearchList from "@/components/search/RecentSearchList"; -import SearchHeader from "@/components/search/SearchHeader"; +import RecentSearchList from "@/pages/search/_components/RecentSearchList"; +import SearchHeader from "@/pages/search/_components/SearchHeader"; export default function SearchPage() { const [query, setQuery] = useState(""); @@ -31,8 +31,7 @@ export default function SearchPage() { // TODO: React Router useNavigate 훅 추가 후 navigate(-1) 기능 구현 onBack={() => {}} /> - -
+
Date: Mon, 4 Aug 2025 01:30:26 +0900 Subject: [PATCH 04/23] =?UTF-8?q?feat:=20=ED=8E=98=EC=9D=B4=EC=A7=80=20?= =?UTF-8?q?=EB=9D=BC=EC=9A=B0=ED=8C=85=20=ED=99=95=EC=9D=B8=EC=9A=A9=20?= =?UTF-8?q?=EC=9E=84=EC=8B=9C=20=EC=B1=84=ED=8C=85=20=ED=8E=98=EC=9D=B4?= =?UTF-8?q?=EC=A7=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/chat/index.tsx | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 src/pages/chat/index.tsx diff --git a/src/pages/chat/index.tsx b/src/pages/chat/index.tsx new file mode 100644 index 0000000..36bff1f --- /dev/null +++ b/src/pages/chat/index.tsx @@ -0,0 +1,7 @@ +export default function ChatPage() { + return ( +
+

채팅

+
+ ); +} From c2d3b59fc8a79f87e07daf2e96dad0742bd3f908 Mon Sep 17 00:00:00 2001 From: Monixc Date: Mon, 4 Aug 2025 01:32:47 +0900 Subject: [PATCH 05/23] =?UTF-8?q?style:=20=ED=8E=98=EC=9D=B4=EC=A7=80=20?= =?UTF-8?q?=EB=B3=84=20=ED=97=A4=EB=8D=94=20=EC=B6=94=EA=B0=80=20=EB=B0=8F?= =?UTF-8?q?=20=EB=A0=88=EC=9D=B4=EC=95=84=EC=9B=83=20=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 페이지 별 헤더 및 헤더 아이콘 적용 - header을 페이지에서 관리함에 따라 GlobalLayout에서 p 적용 시 header에도 패딩 적용됨 - GlobalLayout p-4 속성 삭제 후, 각 페이지 콘텐트 div에서 패딩 적용 --- src/pages/developer/index.tsx | 29 +++++---- .../explore/_components/FilteringModal.tsx | 2 +- src/pages/explore/index.tsx | 2 +- src/pages/home/index.tsx | 63 +++++++++++++------ src/pages/my/index.tsx | 34 +++++----- 5 files changed, 82 insertions(+), 48 deletions(-) diff --git a/src/pages/developer/index.tsx b/src/pages/developer/index.tsx index 3e2cea8..73c01ac 100644 --- a/src/pages/developer/index.tsx +++ b/src/pages/developer/index.tsx @@ -5,6 +5,8 @@ import type { DeveloperTabValue } from "@/constants/profile"; import { DEVELOPER_TABS } from "@/constants/profile"; import Posts from "./_components/Posts.tsx"; import Profile from "./_components/Profile.tsx"; +import Header from "@/components/layout/Header.tsx"; +import { ArrowLeft, Heart } from "lucide-react"; export const DeveloperPage = () => { const [activeTab, setActiveTab] = useState("profile"); @@ -14,20 +16,23 @@ export const DeveloperPage = () => { }; return ( -
-
+
+
} rightIcon={} /> +
- -
- {activeTab === "profile" && } - {activeTab === "posts" && } +
+ +
+ {activeTab === "profile" && } + {activeTab === "posts" && } +
); diff --git a/src/pages/explore/_components/FilteringModal.tsx b/src/pages/explore/_components/FilteringModal.tsx index 167d0e8..0c5df70 100644 --- a/src/pages/explore/_components/FilteringModal.tsx +++ b/src/pages/explore/_components/FilteringModal.tsx @@ -104,7 +104,7 @@ export const FilteringModal = ({ onClose }: FilteringModalProps) => { return (
-
+

조건 설정

-
); }; diff --git a/src/pages/my/index.tsx b/src/pages/my/index.tsx index 458e41a..8c2ee92 100644 --- a/src/pages/my/index.tsx +++ b/src/pages/my/index.tsx @@ -1,6 +1,7 @@ import { ProfileSection } from "@/components/profile/ProfileSection"; -import { ChevronRight } from "lucide-react"; +import { Bell, ChevronRight } from "lucide-react"; import { MENU_ITEMS, type MenuItemId } from "@/constants/my"; +import Header from "@/components/layout/Header"; export const MyPage = () => { const handleMenuItemClick = (menuId: MenuItemId) => { @@ -8,20 +9,23 @@ export const MyPage = () => { }; return ( -
- -
-
    - {MENU_ITEMS.map((item) => ( -
  • handleMenuItemClick(item.id)} - className="flex justify-between items-center py-4 border-b border-brand-surface cursor-pointer hover:bg-brand-surface/50 transition-colors"> - {item.label} - -
    • - ))} -
+
+
} /> +
+ +
+
    + {MENU_ITEMS.map((item) => ( +
  • handleMenuItemClick(item.id)} + className="flex justify-between items-center py-4 border-b border-brand-surface cursor-pointer hover:bg-brand-surface/50 transition-colors px-4"> + {item.label} + +
    • + ))} +
+
); From d7eff677e622744528ffedd21fd7dfec8a4fb9f1 Mon Sep 17 00:00:00 2001 From: Monixc Date: Mon, 4 Aug 2025 02:17:33 +0900 Subject: [PATCH 06/23] =?UTF-8?q?style:=20=EC=98=A8=EB=B3=B4=EB=94=A9=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EB=B0=8F=20=EB=B2=84=ED=8A=BC=20?= =?UTF-8?q?=EC=8A=A4=ED=83=80=EC=9D=BC=20=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 버튼 컴포넌트의 스타일을 통일성 있게 수정 - 입력 필드 및 선택기 스타일 개선 - 관심 분야 선택 제한 로직 추가 --- src/components/ui/button.tsx | 20 +++---- src/index.css | 2 +- src/pages/onboarding/OnboardingPage.tsx | 59 ++++++++++--------- .../__components/OnboardingStep1.tsx | 24 ++++---- .../__components/OnboardingStep2.tsx | 55 ++++++++--------- .../__components/OnboardingStep3.tsx | 29 +++++---- .../__components/OnboardingStep4.tsx | 16 ++--- 7 files changed, 99 insertions(+), 106 deletions(-) diff --git a/src/components/ui/button.tsx b/src/components/ui/button.tsx index a2df8dc..ddacc0d 100644 --- a/src/components/ui/button.tsx +++ b/src/components/ui/button.tsx @@ -1,8 +1,8 @@ -import * as React from "react" -import { Slot } from "@radix-ui/react-slot" -import { cva, type VariantProps } from "class-variance-authority" +import * as React from "react"; +import { Slot } from "@radix-ui/react-slot"; +import { cva, type VariantProps } from "class-variance-authority"; -import { cn } from "@/lib/utils" +import { cn } from "@/lib/utils"; const buttonVariants = cva( "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", @@ -14,7 +14,7 @@ const buttonVariants = cva( destructive: "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60", outline: - "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50", + "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:hover:bg-input/50", secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80", ghost: @@ -33,7 +33,7 @@ const buttonVariants = cva( size: "default", }, } -) +); function Button({ className, @@ -43,9 +43,9 @@ function Button({ ...props }: React.ComponentProps<"button"> & VariantProps & { - asChild?: boolean + asChild?: boolean; }) { - const Comp = asChild ? Slot : "button" + const Comp = asChild ? Slot : "button"; return ( - ) + ); } -export { Button, buttonVariants } +export { Button, buttonVariants }; diff --git a/src/index.css b/src/index.css index d892e36..aa7641f 100644 --- a/src/index.css +++ b/src/index.css @@ -99,7 +99,7 @@ --accent: oklch(0.269 0 0); --accent-foreground: oklch(0.985 0 0); --destructive: oklch(0.704 0.191 22.216); - --border: oklch(1 0 0 / 10%); + --border: oklch(0.9042 0.2304 134.57); --input: oklch(1 0 0 / 15%); --ring: oklch(0.556 0 0); --chart-1: oklch(0.488 0.243 264.376); diff --git a/src/pages/onboarding/OnboardingPage.tsx b/src/pages/onboarding/OnboardingPage.tsx index b747bc3..1165f9c 100644 --- a/src/pages/onboarding/OnboardingPage.tsx +++ b/src/pages/onboarding/OnboardingPage.tsx @@ -4,6 +4,8 @@ import { OnboardingStep2 } from "@/pages/onboarding/__components/OnboardingStep2 import { OnboardingStep3 } from "@/pages/onboarding/__components/OnboardingStep3"; import { OnboardingStep4 } from "@/pages/onboarding/__components/OnboardingStep4"; import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; +import Header from "@/components/layout/Header"; +import { ArrowLeft } from "lucide-react"; export interface OnboardingData { nickname?: string; @@ -55,36 +57,39 @@ export function OnboardingPage() { }; return ( -
- {step < TOTAL_STEPS && ( -
-
-
- )} - +
+
+
{step < TOTAL_STEPS && ( - - - {getStepTitle()} - - +
+
+
)} - - {step === 1 && ( - + + {step < TOTAL_STEPS && ( + + + {getStepTitle()} + + )} - {step === 2 && ( - - )} - {step === 3 && ( - - )} - {step === 4 && } - - + + {step === 1 && ( + + )} + {step === 2 && ( + + )} + {step === 3 && ( + + )} + {step === 4 && } + + +
); } diff --git a/src/pages/onboarding/__components/OnboardingStep1.tsx b/src/pages/onboarding/__components/OnboardingStep1.tsx index 595b2b4..28ffec4 100644 --- a/src/pages/onboarding/__components/OnboardingStep1.tsx +++ b/src/pages/onboarding/__components/OnboardingStep1.tsx @@ -64,17 +64,17 @@ export function OnboardingStep1({ onNext, data }: StepProps) { return (
-
+
setNickname(e.target.value)} - className="bg-gray-800 border-gray-600 focus:border-lime-400" + className="bg-brand-surface border-transparent focus:!ring-0 focus:!border-brand-primary" />
-
+
= MAX_AGE_LIMIT && "border-red-500 focus:border-red-500 text-red-500" )} />
-
+
-
+