Unify color scheme: orange primary, rose accent, gray neutral

- Primary (orange): search button, active filters, selected cards,
  channel tags, links, input focus ring
- Accent (rose): favorites/heart only
- Neutral (gray): price tags, inactive buttons
- Semantic colors preserved: red for 폐업, yellow for 임시휴업

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
joungmin
2026-03-09 16:00:13 +09:00
parent 2cd72d660a
commit 4a1c8cf1cd
5 changed files with 22 additions and 22 deletions

View File

@@ -511,7 +511,7 @@ export default function Home() {
onClick={() => setBoundsFilterOn(!boundsFilterOn)}
className={`px-3 py-1.5 text-sm border rounded-lg transition-colors ${
boundsFilterOn
? "bg-blue-50 border-blue-300 text-blue-600"
? "bg-orange-50 border-orange-300 text-orange-600"
: "hover:bg-gray-100 text-gray-600"
}`}
title="지도 영역 내 식당만 표시"
@@ -531,7 +531,7 @@ export default function Home() {
onClick={handleToggleFavorites}
className={`px-3.5 py-1.5 text-sm rounded-full border transition-colors ${
showFavorites
? "bg-red-50 border-red-300 text-red-600"
? "bg-rose-50 border-rose-300 text-rose-600"
: "border-gray-300 text-gray-600 hover:bg-gray-100"
}`}
>
@@ -541,7 +541,7 @@ export default function Home() {
onClick={handleToggleMyReviews}
className={`px-3.5 py-1.5 text-sm rounded-full border transition-colors ${
showMyReviews
? "bg-blue-50 border-blue-300 text-blue-600"
? "bg-orange-50 border-orange-300 text-orange-600"
: "border-gray-300 text-gray-600 hover:bg-gray-100"
}`}
>
@@ -566,7 +566,7 @@ export default function Home() {
className="w-8 h-8 rounded-full border border-gray-200"
/>
) : (
<div className="w-8 h-8 rounded-full bg-amber-100 text-amber-700 flex items-center justify-center text-sm font-semibold border border-amber-200">
<div className="w-8 h-8 rounded-full bg-orange-100 text-orange-700 flex items-center justify-center text-sm font-semibold border border-orange-200">
{(user.nickname || user.email || "?").charAt(0).toUpperCase()}
</div>
)}
@@ -604,7 +604,7 @@ export default function Home() {
onClick={() => setViewMode(viewMode === "map" ? "list" : "map")}
className={`px-3 py-1.5 text-xs border rounded-lg transition-colors ${
viewMode === "map"
? "bg-blue-50 border-blue-300 text-blue-600"
? "bg-orange-50 border-orange-300 text-orange-600"
: "text-gray-600"
}`}
>
@@ -614,13 +614,13 @@ export default function Home() {
onClick={() => setShowMobileFilters(!showMobileFilters)}
className={`px-3 py-1.5 text-xs border rounded-lg transition-colors relative ${
showMobileFilters || channelFilter || cuisineFilter || priceFilter || countryFilter || boundsFilterOn
? "bg-blue-50 border-blue-300 text-blue-600"
? "bg-orange-50 border-orange-300 text-orange-600"
: "text-gray-600"
}`}
>
{showMobileFilters ? "✕ 필터" : "▽ 필터"}
{!showMobileFilters && (channelFilter || cuisineFilter || priceFilter || countryFilter || boundsFilterOn) && (
<span className="absolute -top-1.5 -right-1.5 w-4 h-4 bg-blue-500 text-white rounded-full text-[9px] flex items-center justify-center">
<span className="absolute -top-1.5 -right-1.5 w-4 h-4 bg-orange-500 text-white rounded-full text-[9px] flex items-center justify-center">
{[channelFilter, cuisineFilter, priceFilter, countryFilter, boundsFilterOn].filter(Boolean).length}
</span>
)}
@@ -631,7 +631,7 @@ export default function Home() {
onClick={handleToggleFavorites}
className={`px-3 py-1.5 text-xs rounded-full border transition-colors ${
showFavorites
? "bg-red-50 border-red-300 text-red-600"
? "bg-rose-50 border-rose-300 text-rose-600"
: "border-gray-300 text-gray-600"
}`}
>
@@ -641,7 +641,7 @@ export default function Home() {
onClick={handleToggleMyReviews}
className={`px-3 py-1.5 text-xs rounded-full border transition-colors ${
showMyReviews
? "bg-blue-50 border-blue-300 text-blue-600"
? "bg-orange-50 border-orange-300 text-orange-600"
: "border-gray-300 text-gray-600"
}`}
>
@@ -739,7 +739,7 @@ export default function Home() {
onClick={() => setBoundsFilterOn(!boundsFilterOn)}
className={`px-2.5 py-1.5 text-xs border rounded-lg transition-colors ${
boundsFilterOn
? "bg-blue-50 border-blue-300 text-blue-600"
? "bg-orange-50 border-orange-300 text-orange-600"
: "text-gray-600 bg-white"
}`}
>