Improve layout and spacing of media outlet management pages
Refactor MediaOutletManagement component to optimize spacing and translate UI elements to English. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 069d4324-6c40-4355-955e-c714a50de1ea Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/069d4324-6c40-4355-955e-c714a50de1ea/gVirbWH
This commit is contained in:
@ -28,16 +28,6 @@ export default function MediaOutletManagement({ outlet, onBack }: MediaOutletMan
|
|||||||
<div className="max-w-7xl mx-auto px-6 py-4">
|
<div className="max-w-7xl mx-auto px-6 py-4">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<div className="flex items-center space-x-4">
|
<div className="flex items-center space-x-4">
|
||||||
<Button
|
|
||||||
variant="ghost"
|
|
||||||
size="sm"
|
|
||||||
onClick={onBack}
|
|
||||||
data-testid="button-back"
|
|
||||||
>
|
|
||||||
<ArrowLeft className="h-4 w-4 mr-2" />
|
|
||||||
뒤로가기
|
|
||||||
</Button>
|
|
||||||
|
|
||||||
<div className="flex items-center space-x-3">
|
<div className="flex items-center space-x-3">
|
||||||
{outlet.imageUrl ? (
|
{outlet.imageUrl ? (
|
||||||
<img
|
<img
|
||||||
@ -69,7 +59,7 @@ export default function MediaOutletManagement({ outlet, onBack }: MediaOutletMan
|
|||||||
data-testid="button-edit-outlet"
|
data-testid="button-edit-outlet"
|
||||||
>
|
>
|
||||||
<Edit className="h-4 w-4 mr-2" />
|
<Edit className="h-4 w-4 mr-2" />
|
||||||
편집
|
Edit
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -80,11 +70,11 @@ export default function MediaOutletManagement({ outlet, onBack }: MediaOutletMan
|
|||||||
<div className="max-w-7xl mx-auto px-6 py-6">
|
<div className="max-w-7xl mx-auto px-6 py-6">
|
||||||
<Tabs value={activeTab} onValueChange={setActiveTab} className="w-full">
|
<Tabs value={activeTab} onValueChange={setActiveTab} className="w-full">
|
||||||
<TabsList className="grid w-full grid-cols-5">
|
<TabsList className="grid w-full grid-cols-5">
|
||||||
<TabsTrigger value="overview" data-testid="tab-overview">개요</TabsTrigger>
|
<TabsTrigger value="overview" data-testid="tab-overview">Overview</TabsTrigger>
|
||||||
<TabsTrigger value="articles" data-testid="tab-articles">기사 관리</TabsTrigger>
|
<TabsTrigger value="articles" data-testid="tab-articles">Articles</TabsTrigger>
|
||||||
<TabsTrigger value="predictions" data-testid="tab-predictions">예측시장</TabsTrigger>
|
<TabsTrigger value="predictions" data-testid="tab-predictions">Prediction Markets</TabsTrigger>
|
||||||
<TabsTrigger value="auctions" data-testid="tab-auctions">경매</TabsTrigger>
|
<TabsTrigger value="auctions" data-testid="tab-auctions">Auctions</TabsTrigger>
|
||||||
<TabsTrigger value="comments" data-testid="tab-comments">댓글</TabsTrigger>
|
<TabsTrigger value="comments" data-testid="tab-comments">Comments</TabsTrigger>
|
||||||
</TabsList>
|
</TabsList>
|
||||||
|
|
||||||
<TabsContent value="overview" className="mt-6">
|
<TabsContent value="overview" className="mt-6">
|
||||||
@ -93,7 +83,7 @@ export default function MediaOutletManagement({ outlet, onBack }: MediaOutletMan
|
|||||||
<CardContent className="p-6">
|
<CardContent className="p-6">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<div>
|
<div>
|
||||||
<h3 className="text-sm font-medium text-gray-500">총 기사 수</h3>
|
<h3 className="text-sm font-medium text-gray-500">Total Articles</h3>
|
||||||
<p className="text-2xl font-bold">0</p>
|
<p className="text-2xl font-bold">0</p>
|
||||||
</div>
|
</div>
|
||||||
<div className="text-blue-600">
|
<div className="text-blue-600">
|
||||||
@ -107,7 +97,7 @@ export default function MediaOutletManagement({ outlet, onBack }: MediaOutletMan
|
|||||||
<CardContent className="p-6">
|
<CardContent className="p-6">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<div>
|
<div>
|
||||||
<h3 className="text-sm font-medium text-gray-500">활성 예측시장</h3>
|
<h3 className="text-sm font-medium text-gray-500">Active Prediction Markets</h3>
|
||||||
<p className="text-2xl font-bold">0</p>
|
<p className="text-2xl font-bold">0</p>
|
||||||
</div>
|
</div>
|
||||||
<div className="text-green-600">
|
<div className="text-green-600">
|
||||||
@ -121,7 +111,7 @@ export default function MediaOutletManagement({ outlet, onBack }: MediaOutletMan
|
|||||||
<CardContent className="p-6">
|
<CardContent className="p-6">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<div>
|
<div>
|
||||||
<h3 className="text-sm font-medium text-gray-500">진행중인 경매</h3>
|
<h3 className="text-sm font-medium text-gray-500">Active Auctions</h3>
|
||||||
<p className="text-2xl font-bold">0</p>
|
<p className="text-2xl font-bold">0</p>
|
||||||
</div>
|
</div>
|
||||||
<div className="text-orange-600">
|
<div className="text-orange-600">
|
||||||
@ -135,7 +125,7 @@ export default function MediaOutletManagement({ outlet, onBack }: MediaOutletMan
|
|||||||
<CardContent className="p-6">
|
<CardContent className="p-6">
|
||||||
<div className="flex items-center justify-between">
|
<div className="flex items-center justify-between">
|
||||||
<div>
|
<div>
|
||||||
<h3 className="text-sm font-medium text-gray-500">총 댓글 수</h3>
|
<h3 className="text-sm font-medium text-gray-500">Total Comments</h3>
|
||||||
<p className="text-2xl font-bold">0</p>
|
<p className="text-2xl font-bold">0</p>
|
||||||
</div>
|
</div>
|
||||||
<div className="text-purple-600">
|
<div className="text-purple-600">
|
||||||
@ -149,23 +139,23 @@ export default function MediaOutletManagement({ outlet, onBack }: MediaOutletMan
|
|||||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
||||||
<Card>
|
<Card>
|
||||||
<CardHeader>
|
<CardHeader>
|
||||||
<CardTitle>언론매체 정보</CardTitle>
|
<CardTitle>Media Outlet Information</CardTitle>
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent className="space-y-4">
|
<CardContent className="space-y-4">
|
||||||
<div>
|
<div>
|
||||||
<label className="text-sm font-medium text-gray-700">이름</label>
|
<label className="text-sm font-medium text-gray-700">Name</label>
|
||||||
<Input value={outlet.name} readOnly className="mt-1" />
|
<Input value={outlet.name} readOnly className="mt-1" />
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<label className="text-sm font-medium text-gray-700">설명</label>
|
<label className="text-sm font-medium text-gray-700">Description</label>
|
||||||
<Input value={outlet.description || ""} readOnly className="mt-1" />
|
<Input value={outlet.description || ""} readOnly className="mt-1" />
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<label className="text-sm font-medium text-gray-700">카테고리</label>
|
<label className="text-sm font-medium text-gray-700">Category</label>
|
||||||
<Input value={outlet.category} readOnly className="mt-1" />
|
<Input value={outlet.category} readOnly className="mt-1" />
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<label className="text-sm font-medium text-gray-700">슬러그</label>
|
<label className="text-sm font-medium text-gray-700">Slug</label>
|
||||||
<Input value={outlet.slug} readOnly className="mt-1" />
|
<Input value={outlet.slug} readOnly className="mt-1" />
|
||||||
</div>
|
</div>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
@ -173,7 +163,7 @@ export default function MediaOutletManagement({ outlet, onBack }: MediaOutletMan
|
|||||||
|
|
||||||
<Card>
|
<Card>
|
||||||
<CardHeader>
|
<CardHeader>
|
||||||
<CardTitle>빠른 작업</CardTitle>
|
<CardTitle>Quick Actions</CardTitle>
|
||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardContent className="space-y-3">
|
<CardContent className="space-y-3">
|
||||||
<Button
|
<Button
|
||||||
|
|||||||
Reference in New Issue
Block a user