Improve the visual design and clarity of the auction guide page
Refactor the AuctionGuide component to update styling, adjust font sizes and spacing, and refine the overall layout for a cleaner user experience. 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/bLfICpO
This commit is contained in:
kimjaehyeon0101
@ -24,10 +24,10 @@ import {
|
||||
export default function AuctionGuide() {
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-background">
|
||||
<div className="min-h-screen bg-gray-50">
|
||||
{/* Header */}
|
||||
<header className="bg-card border-b border-border sticky top-0 z-50">
|
||||
<div className="max-w-7xl mx-auto px-4 py-2">
|
||||
<header className="bg-white border-b border-gray-200 sticky top-0 z-50">
|
||||
<div className="max-w-7xl mx-auto px-4 py-3">
|
||||
<div className="flex items-center justify-between">
|
||||
<Link href="/">
|
||||
<img
|
||||
@ -53,28 +53,28 @@ export default function AuctionGuide() {
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main className="max-w-6xl mx-auto px-4 py-4">
|
||||
<main className="max-w-6xl mx-auto px-4 py-3">
|
||||
{/* Header Section */}
|
||||
<div className="mb-4">
|
||||
<h1 className="text-3xl font-bold mb-2" data-testid="text-guide-title">SAPIENS Media Outlet Auction System Complete Guide</h1>
|
||||
<p className="text-lg text-muted-foreground">
|
||||
<div className="mb-3">
|
||||
<h1 className="text-2xl font-bold mb-1" data-testid="text-guide-title">Media Outlet Auction System Guide</h1>
|
||||
<p className="text-sm text-gray-600">
|
||||
Innovative media management rights auction platform based on advertising bidding methods
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Overview Card */}
|
||||
<Card className="mb-4" data-testid="section-overview">
|
||||
<CardHeader className="pb-2">
|
||||
<CardTitle className="flex items-center space-x-2 text-lg">
|
||||
<Card className="mb-3" data-testid="section-overview">
|
||||
<CardHeader className="pb-1 pt-3 px-3">
|
||||
<CardTitle className="flex items-center gap-2 text-base font-semibold">
|
||||
<Lightbulb className="h-4 w-4 text-primary" />
|
||||
<span>Auction System Overview</span>
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="pt-0">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<CardContent className="pt-0 px-3 pb-3">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<div>
|
||||
<h3 className="font-semibold mb-2">🎯 Core Principles</h3>
|
||||
<ul className="space-y-1 text-sm">
|
||||
<h3 className="font-semibold mb-1 text-sm">🎯 Core Principles</h3>
|
||||
<ul className="space-y-0.5 text-xs">
|
||||
<li>• <strong>Vickrey Auction Method</strong>: Nobel Prize-winning theory applied</li>
|
||||
<li>• <strong>Hybrid Scoring</strong>: Bid amount × quality score combination</li>
|
||||
<li>• <strong>Fair Pricing</strong>: Second-price bid-based charging</li>
|
||||
@ -82,8 +82,8 @@ export default function AuctionGuide() {
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="font-semibold mb-2">📊 Auction Targets</h3>
|
||||
<ul className="space-y-1 text-sm">
|
||||
<h3 className="font-semibold mb-1 text-sm">📊 Auction Targets</h3>
|
||||
<ul className="space-y-0.5 text-xs">
|
||||
<li>• <strong>People (24)</strong>: Management rights for key figures' media outlets</li>
|
||||
<li>• <strong>Topics (20)</strong>: Core topic content management rights</li>
|
||||
<li>• <strong>Companies (27)</strong>: Corporate media management rights</li>
|
||||
@ -95,41 +95,41 @@ export default function AuctionGuide() {
|
||||
</Card>
|
||||
|
||||
{/* Core Mechanism */}
|
||||
<Card className="mb-4" data-testid="section-mechanism">
|
||||
<CardHeader className="pb-2">
|
||||
<CardTitle className="flex items-center space-x-2 text-lg">
|
||||
<Card className="mb-3" data-testid="section-mechanism">
|
||||
<CardHeader className="pb-1 pt-3 px-3">
|
||||
<CardTitle className="flex items-center gap-2 text-base font-semibold">
|
||||
<Settings className="h-4 w-4 text-chart-1" />
|
||||
<span>1. Basic Auction Mechanism</span>
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="pt-0">
|
||||
<div className="space-y-4">
|
||||
<div className="bg-primary/5 rounded-lg p-4">
|
||||
<h3 className="font-semibold mb-3 flex items-center">
|
||||
<CardContent className="pt-0 px-3 pb-3">
|
||||
<div className="space-y-2">
|
||||
<div className="bg-blue-50 rounded p-3">
|
||||
<h3 className="font-semibold mb-2 flex items-center text-sm">
|
||||
<Award className="h-4 w-4 text-primary mr-2" />
|
||||
Vickrey Auction Method
|
||||
</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-3">
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-2">
|
||||
<div className="text-center">
|
||||
<div className="w-10 h-10 bg-primary rounded-full flex items-center justify-center text-primary-foreground font-bold mx-auto mb-2">1</div>
|
||||
<h4 className="font-medium mb-1 text-sm">Highest Bidder Wins</h4>
|
||||
<p className="text-xs text-muted-foreground">Bidder with highest total score wins</p>
|
||||
<div className="w-8 h-8 bg-blue-600 rounded-full flex items-center justify-center text-white text-sm font-bold mx-auto mb-1">1</div>
|
||||
<h4 className="font-medium mb-0.5 text-xs">Highest Bidder Wins</h4>
|
||||
<p className="text-xs text-gray-600">Bidder with highest total score wins</p>
|
||||
</div>
|
||||
<div className="text-center">
|
||||
<div className="w-10 h-10 bg-chart-2 rounded-full flex items-center justify-center text-white font-bold mx-auto mb-2">2</div>
|
||||
<h4 className="font-medium mb-1 text-sm">Pay Second Price</h4>
|
||||
<p className="text-xs text-muted-foreground">Actually only pay second-place bid</p>
|
||||
<div className="w-8 h-8 bg-green-600 rounded-full flex items-center justify-center text-white text-sm font-bold mx-auto mb-1">2</div>
|
||||
<h4 className="font-medium mb-0.5 text-xs">Pay Second Price</h4>
|
||||
<p className="text-xs text-gray-600">Actually only pay second-place bid</p>
|
||||
</div>
|
||||
<div className="text-center">
|
||||
<div className="w-10 h-10 bg-chart-3 rounded-full flex items-center justify-center text-white font-bold mx-auto mb-2">3</div>
|
||||
<h4 className="font-medium mb-1 text-sm">Fair Price Formation</h4>
|
||||
<p className="text-xs text-muted-foreground">Prevents excessive bidding and increases efficiency</p>
|
||||
<div className="w-8 h-8 bg-purple-600 rounded-full flex items-center justify-center text-white text-sm font-bold mx-auto mb-1">3</div>
|
||||
<h4 className="font-medium mb-0.5 text-xs">Fair Price Formation</h4>
|
||||
<p className="text-xs text-gray-600">Prevents excessive bidding and increases efficiency</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-chart-1/5 rounded-lg p-4">
|
||||
<h4 className="font-semibold mb-2 text-sm">📝 Real Example</h4>
|
||||
<div className="bg-gray-100 rounded p-3">
|
||||
<h4 className="font-semibold mb-1 text-xs">📝 Real Example</h4>
|
||||
<div className="space-y-1 text-xs">
|
||||
<p><strong>Bidder A:</strong> $1,000 × 85pts = 85,000pts (1st place winner)</p>
|
||||
<p><strong>Bidder B:</strong> $800 × 90pts = 72,000pts (2nd place)</p>
|
||||
@ -144,30 +144,30 @@ export default function AuctionGuide() {
|
||||
</Card>
|
||||
|
||||
{/* Ranking System */}
|
||||
<Card className="mb-4" data-testid="section-ranking">
|
||||
<CardHeader className="pb-2">
|
||||
<CardTitle className="flex items-center space-x-2 text-lg">
|
||||
<Card className="mb-3" data-testid="section-ranking">
|
||||
<CardHeader className="pb-1 pt-3 px-3">
|
||||
<CardTitle className="flex items-center gap-2 text-base font-semibold">
|
||||
<TrendingUp className="h-4 w-4 text-chart-2" />
|
||||
<span>2. Ranking System</span>
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="pt-0">
|
||||
<div className="space-y-4">
|
||||
<div className="text-center bg-gradient-to-r from-primary/10 to-chart-2/10 rounded-lg p-4">
|
||||
<h3 className="text-xl font-bold mb-2">Final Ranking Formula</h3>
|
||||
<div className="text-2xl font-bold text-primary mb-1">
|
||||
<CardContent className="pt-0 px-3 pb-3">
|
||||
<div className="space-y-2">
|
||||
<div className="text-center bg-gradient-to-r from-blue-50 to-green-50 rounded p-3">
|
||||
<h3 className="text-sm font-bold mb-1">Final Ranking Formula</h3>
|
||||
<div className="text-lg font-bold text-blue-600 mb-0.5">
|
||||
Ranking Score = Bid Amount × (Quality Score ÷ 100)
|
||||
</div>
|
||||
<p className="text-sm text-muted-foreground">Same weighting system as advertising auctions</p>
|
||||
<p className="text-xs text-gray-600">Same weighting system as advertising auctions</p>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<div>
|
||||
<h4 className="font-semibold mb-2 flex items-center">
|
||||
<DollarSign className="h-4 w-4 text-primary mr-2" />
|
||||
<h4 className="font-semibold mb-1 flex items-center text-sm">
|
||||
<DollarSign className="h-3 w-3 text-blue-600 mr-1" />
|
||||
Bid Amount
|
||||
</h4>
|
||||
<ul className="space-y-1 text-sm">
|
||||
<ul className="space-y-0.5 text-xs">
|
||||
<li>• Minimum bid: $100</li>
|
||||
<li>• Maximum bid: $100,000</li>
|
||||
<li>• Must be higher than current top bid</li>
|
||||
@ -175,11 +175,11 @@ export default function AuctionGuide() {
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h4 className="font-semibold mb-2 flex items-center">
|
||||
<Star className="h-4 w-4 text-chart-2 mr-2" />
|
||||
<h4 className="font-semibold mb-1 flex items-center text-sm">
|
||||
<Star className="h-3 w-3 text-green-600 mr-1" />
|
||||
Quality Score
|
||||
</h4>
|
||||
<ul className="space-y-1 text-sm">
|
||||
<ul className="space-y-0.5 text-xs">
|
||||
<li>• Score range: 1-100 points</li>
|
||||
<li>• Content quality evaluation</li>
|
||||
<li>• User engagement analysis</li>
|
||||
@ -192,18 +192,18 @@ export default function AuctionGuide() {
|
||||
</Card>
|
||||
|
||||
{/* Quality Score System */}
|
||||
<Card className="mb-4" data-testid="section-quality">
|
||||
<CardHeader className="pb-2">
|
||||
<CardTitle className="flex items-center space-x-2 text-lg">
|
||||
<Card className="mb-3" data-testid="section-quality">
|
||||
<CardHeader className="pb-1 pt-3 px-3">
|
||||
<CardTitle className="flex items-center gap-2 text-base font-semibold">
|
||||
<Award className="h-4 w-4 text-chart-3" />
|
||||
<span>3. Quality Score System</span>
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="pt-0">
|
||||
<div className="space-y-4">
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-3">
|
||||
<Card className="border-destructive/20">
|
||||
<CardContent className="p-3 text-center">
|
||||
<CardContent className="pt-0 px-3 pb-3">
|
||||
<div className="space-y-2">
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-2">
|
||||
<Card className="border-red-200">
|
||||
<CardContent className="p-2 text-center">
|
||||
<Badge variant="destructive" className="mb-1 text-xs">1-40 pts</Badge>
|
||||
<h4 className="font-semibold mb-1 text-sm">Low Quality</h4>
|
||||
<ul className="text-xs space-y-0.5">
|
||||
@ -213,8 +213,8 @@ export default function AuctionGuide() {
|
||||
</ul>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card className="border-chart-4/20">
|
||||
<CardContent className="p-3 text-center">
|
||||
<Card className="border-gray-200">
|
||||
<CardContent className="p-2 text-center">
|
||||
<Badge variant="secondary" className="mb-1 text-xs">41-70 pts</Badge>
|
||||
<h4 className="font-semibold mb-1 text-sm">Average Quality</h4>
|
||||
<ul className="text-xs space-y-0.5">
|
||||
@ -224,8 +224,8 @@ export default function AuctionGuide() {
|
||||
</ul>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card className="border-chart-2/20">
|
||||
<CardContent className="p-3 text-center">
|
||||
<Card className="border-green-200">
|
||||
<CardContent className="p-2 text-center">
|
||||
<Badge variant="default" className="mb-1 text-xs">71-100 pts</Badge>
|
||||
<h4 className="font-semibold mb-1 text-sm">High Quality</h4>
|
||||
<ul className="text-xs space-y-0.5">
|
||||
@ -237,23 +237,23 @@ export default function AuctionGuide() {
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
<div className="bg-chart-2/5 rounded-lg p-4">
|
||||
<h4 className="font-semibold mb-2 flex items-center">
|
||||
<Calculator className="h-4 w-4 text-chart-2 mr-2" />
|
||||
<div className="bg-green-50 rounded p-3">
|
||||
<h4 className="font-semibold mb-1 flex items-center text-sm">
|
||||
<Calculator className="h-3 w-3 text-green-600 mr-1" />
|
||||
Quality Score Benefits
|
||||
</h4>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-3 text-sm">
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-2 text-xs">
|
||||
<div>
|
||||
<h5 className="font-medium mb-1">📈 Ranking Improvement</h5>
|
||||
<p className="text-xs text-muted-foreground">Higher quality scores prioritized among same bids</p>
|
||||
<h5 className="font-medium mb-0.5 text-xs">📈 Ranking Improvement</h5>
|
||||
<p className="text-xs text-gray-600">Higher quality scores prioritized among same bids</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 className="font-medium mb-1">💰 Cost Savings</h5>
|
||||
<p className="text-xs text-muted-foreground">Achieve high rankings with lower bids</p>
|
||||
<h5 className="font-medium mb-0.5 text-xs">💰 Cost Savings</h5>
|
||||
<p className="text-xs text-gray-600">Achieve high rankings with lower bids</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 className="font-medium mb-1">🎯 Increased Effectiveness</h5>
|
||||
<p className="text-xs text-muted-foreground">More exposure and user engagement opportunities</p>
|
||||
<h5 className="font-medium mb-0.5 text-xs">🎯 Increased Effectiveness</h5>
|
||||
<p className="text-xs text-gray-600">More exposure and user engagement opportunities</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -262,22 +262,22 @@ export default function AuctionGuide() {
|
||||
</Card>
|
||||
|
||||
{/* Auction Types */}
|
||||
<Card className="mb-4" data-testid="section-types">
|
||||
<CardHeader className="pb-2">
|
||||
<CardTitle className="flex items-center space-x-2 text-lg">
|
||||
<Card className="mb-3" data-testid="section-types">
|
||||
<CardHeader className="pb-1 pt-3 px-3">
|
||||
<CardTitle className="flex items-center gap-2 text-base font-semibold">
|
||||
<List className="h-4 w-4 text-chart-4" />
|
||||
<span>4. Auction Types</span>
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="pt-0">
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<Card className="border-primary/20">
|
||||
<CardContent className="p-3">
|
||||
<h4 className="font-semibold mb-2 flex items-center">
|
||||
<Users className="h-4 w-4 text-primary mr-2" />
|
||||
<CardContent className="pt-0 px-3 pb-3">
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-3">
|
||||
<Card className="border-blue-200">
|
||||
<CardContent className="p-2">
|
||||
<h4 className="font-semibold mb-1 flex items-center text-sm">
|
||||
<Users className="h-3 w-3 text-blue-600 mr-1" />
|
||||
People
|
||||
</h4>
|
||||
<ul className="space-y-1 text-sm">
|
||||
<ul className="space-y-0.5 text-xs">
|
||||
<li>• <strong>24 key figures</strong></li>
|
||||
<li>• Personal branding management</li>
|
||||
<li>• Statements and activity content</li>
|
||||
@ -286,13 +286,13 @@ export default function AuctionGuide() {
|
||||
</ul>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card className="border-chart-1/20">
|
||||
<CardContent className="p-3">
|
||||
<h4 className="font-semibold mb-2 flex items-center">
|
||||
<Hash className="h-4 w-4 text-chart-1 mr-2" />
|
||||
<Card className="border-green-200">
|
||||
<CardContent className="p-2">
|
||||
<h4 className="font-semibold mb-1 flex items-center text-sm">
|
||||
<Hash className="h-3 w-3 text-green-600 mr-1" />
|
||||
Topics
|
||||
</h4>
|
||||
<ul className="space-y-1 text-sm">
|
||||
<ul className="space-y-0.5 text-xs">
|
||||
<li>• <strong>20 core topics</strong></li>
|
||||
<li>• Trend analysis management</li>
|
||||
<li>• Topic-specific content curation</li>
|
||||
@ -301,13 +301,13 @@ export default function AuctionGuide() {
|
||||
</ul>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card className="border-chart-2/20">
|
||||
<CardContent className="p-3">
|
||||
<h4 className="font-semibold mb-2 flex items-center">
|
||||
<Building className="h-4 w-4 text-chart-2 mr-2" />
|
||||
<Card className="border-purple-200">
|
||||
<CardContent className="p-2">
|
||||
<h4 className="font-semibold mb-1 flex items-center text-sm">
|
||||
<Building className="h-3 w-3 text-purple-600 mr-1" />
|
||||
Companies
|
||||
</h4>
|
||||
<ul className="space-y-1 text-sm">
|
||||
<ul className="space-y-0.5 text-xs">
|
||||
<li>• <strong>27 major companies</strong></li>
|
||||
<li>• Corporate news management</li>
|
||||
<li>• Financial information updates</li>
|
||||
@ -321,19 +321,19 @@ export default function AuctionGuide() {
|
||||
</Card>
|
||||
|
||||
{/* Strategic Bidding */}
|
||||
<Card className="mb-4" data-testid="section-strategy">
|
||||
<CardHeader className="pb-2">
|
||||
<CardTitle className="flex items-center space-x-2 text-lg">
|
||||
<Card className="mb-3" data-testid="section-strategy">
|
||||
<CardHeader className="pb-1 pt-3 px-3">
|
||||
<CardTitle className="flex items-center gap-2 text-base font-semibold">
|
||||
<Target className="h-4 w-4 text-chart-5" />
|
||||
<span>5. Strategic Bidding Guide</span>
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="pt-0">
|
||||
<div className="space-y-4">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<CardContent className="pt-0 px-3 pb-3">
|
||||
<div className="space-y-2">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3">
|
||||
<div>
|
||||
<h4 className="font-semibold mb-2 text-primary">💡 Effective Bidding Strategies</h4>
|
||||
<ul className="space-y-1 text-sm">
|
||||
<h4 className="font-semibold mb-1 text-blue-600 text-sm">💡 Effective Bidding Strategies</h4>
|
||||
<ul className="space-y-0.5 text-xs">
|
||||
<li>• <strong>Improve Quality Score First</strong>: Higher ROI than bid amount</li>
|
||||
<li>• <strong>Analyze Competition</strong>: Study similar category auctions</li>
|
||||
<li>• <strong>Gradual Bidding</strong>: Step-by-step increases over large amounts</li>
|
||||
@ -341,8 +341,8 @@ export default function AuctionGuide() {
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h4 className="font-semibold mb-2 text-destructive">⚠️ Mistakes to Avoid</h4>
|
||||
<ul className="space-y-1 text-sm">
|
||||
<h4 className="font-semibold mb-1 text-red-600 text-sm">⚠️ Mistakes to Avoid</h4>
|
||||
<ul className="space-y-0.5 text-xs">
|
||||
<li>• <strong>Ignoring Quality Score</strong>: Cannot win with bid amount alone</li>
|
||||
<li>• <strong>Excessive Competition</strong>: Losses from emotional bidding</li>
|
||||
<li>• <strong>Short-term Thinking</strong>: Not considering profitability vs management period</li>
|
||||
@ -351,31 +351,31 @@ export default function AuctionGuide() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-accent/10 rounded-lg p-4">
|
||||
<h4 className="font-semibold mb-2 flex items-center">
|
||||
<Lightbulb className="h-4 w-4 text-accent mr-2" />
|
||||
<div className="bg-blue-50 rounded p-3">
|
||||
<h4 className="font-semibold mb-1 flex items-center text-sm">
|
||||
<Lightbulb className="h-3 w-3 text-blue-600 mr-1" />
|
||||
Successful Auction Participation Tips
|
||||
</h4>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-3 text-sm">
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-2 text-xs">
|
||||
<div>
|
||||
<h5 className="font-medium mb-1">Phase 1: Preparation</h5>
|
||||
<ul className="space-y-0.5 text-xs text-muted-foreground">
|
||||
<h5 className="font-medium mb-0.5 text-xs">Phase 1: Preparation</h5>
|
||||
<ul className="space-y-0.5 text-xs text-gray-600">
|
||||
<li>• Select target media outlets</li>
|
||||
<li>• Establish budget plan</li>
|
||||
<li>• Self-assess quality score</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h5 className="font-medium mb-1">Phase 2: Analysis</h5>
|
||||
<ul className="space-y-0.5 text-xs text-muted-foreground">
|
||||
<h5 className="font-medium mb-0.5 text-xs">Phase 2: Analysis</h5>
|
||||
<ul className="space-y-0.5 text-xs text-gray-600">
|
||||
<li>• Analyze past auction results</li>
|
||||
<li>• Competitor bidding patterns</li>
|
||||
<li>• Market value assessment</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h5 className="font-medium mb-1">Phase 3: Execution</h5>
|
||||
<ul className="space-y-0.5 text-xs text-muted-foreground">
|
||||
<h5 className="font-medium mb-0.5 text-xs">Phase 3: Execution</h5>
|
||||
<ul className="space-y-0.5 text-xs text-gray-600">
|
||||
<li>• Execute planned bids</li>
|
||||
<li>• Real-time monitoring</li>
|
||||
<li>• Timely adjustments and responses</li>
|
||||
@ -388,29 +388,29 @@ export default function AuctionGuide() {
|
||||
</Card>
|
||||
|
||||
{/* Technical Implementation */}
|
||||
<Card className="mb-4" data-testid="section-technical">
|
||||
<CardHeader className="pb-2">
|
||||
<CardTitle className="flex items-center space-x-2 text-lg">
|
||||
<Card className="mb-3" data-testid="section-technical">
|
||||
<CardHeader className="pb-1 pt-3 px-3">
|
||||
<CardTitle className="flex items-center gap-2 text-base font-semibold">
|
||||
<Brain className="h-4 w-4 text-primary" />
|
||||
<span>6. Technical Implementation</span>
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="pt-0">
|
||||
<div className="space-y-4">
|
||||
<div className="bg-primary/5 rounded-lg p-4">
|
||||
<h4 className="font-semibold mb-2">🔧 System Architecture</h4>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-3 text-sm">
|
||||
<CardContent className="pt-0 px-3 pb-3">
|
||||
<div className="space-y-2">
|
||||
<div className="bg-blue-50 rounded p-3">
|
||||
<h4 className="font-semibold mb-1 text-sm">🔧 System Architecture</h4>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-2 text-xs">
|
||||
<div>
|
||||
<h5 className="font-medium mb-1">Real-time Bid Processing</h5>
|
||||
<ul className="space-y-0.5 text-xs text-muted-foreground">
|
||||
<h5 className="font-medium mb-0.5 text-xs">Real-time Bid Processing</h5>
|
||||
<ul className="space-y-0.5 text-xs text-gray-600">
|
||||
<li>• PostgreSQL-based transaction management</li>
|
||||
<li>• Concurrency control and integrity assurance</li>
|
||||
<li>• Real-time ranking updates</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<h5 className="font-medium mb-1">Security and Verification</h5>
|
||||
<ul className="space-y-0.5 text-xs text-muted-foreground">
|
||||
<h5 className="font-medium mb-0.5 text-xs">Security and Verification</h5>
|
||||
<ul className="space-y-0.5 text-xs text-gray-600">
|
||||
<li>• User authentication and authorization</li>
|
||||
<li>• Bid data encryption</li>
|
||||
<li>• Fraud prevention system</li>
|
||||
@ -419,20 +419,20 @@ export default function AuctionGuide() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="bg-chart-2/5 rounded-lg p-4">
|
||||
<h4 className="font-semibold mb-2">📊 Data Analysis</h4>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-3 text-sm">
|
||||
<div className="bg-green-50 rounded p-3">
|
||||
<h4 className="font-semibold mb-1 text-sm">📊 Data Analysis</h4>
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-2 text-xs">
|
||||
<div>
|
||||
<h5 className="font-medium mb-1">Bidding Pattern Analysis</h5>
|
||||
<p className="text-xs text-muted-foreground">Track user-specific bid history and success rates</p>
|
||||
<h5 className="font-medium mb-0.5 text-xs">Bidding Pattern Analysis</h5>
|
||||
<p className="text-xs text-gray-600">Track user-specific bid history and success rates</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 className="font-medium mb-1">Market Price Prediction</h5>
|
||||
<p className="text-xs text-muted-foreground">ML-based optimal bid suggestions</p>
|
||||
<h5 className="font-medium mb-0.5 text-xs">Market Price Prediction</h5>
|
||||
<p className="text-xs text-gray-600">ML-based optimal bid suggestions</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 className="font-medium mb-1">Performance Measurement</h5>
|
||||
<p className="text-xs text-muted-foreground">ROI analysis after acquiring management rights</p>
|
||||
<h5 className="font-medium mb-0.5 text-xs">Performance Measurement</h5>
|
||||
<p className="text-xs text-gray-600">ROI analysis after acquiring management rights</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -441,13 +441,13 @@ export default function AuctionGuide() {
|
||||
</Card>
|
||||
|
||||
{/* Call to Action */}
|
||||
<Card className="bg-gradient-to-r from-primary/10 to-chart-2/10">
|
||||
<CardContent className="p-6 text-center">
|
||||
<h3 className="text-2xl font-bold mb-2">Join the Auction Now!</h3>
|
||||
<p className="text-muted-foreground mb-4">
|
||||
<Card className="bg-gradient-to-r from-blue-50 to-green-50">
|
||||
<CardContent className="p-4 text-center">
|
||||
<h3 className="text-lg font-bold mb-1">Join the Auction Now!</h3>
|
||||
<p className="text-gray-600 mb-3 text-sm">
|
||||
Start your innovative media management experience and acquire the best media outlet rights
|
||||
</p>
|
||||
<div className="flex justify-center space-x-3">
|
||||
<div className="flex justify-center gap-2">
|
||||
<Link href="/auctions">
|
||||
<Button data-testid="button-view-auctions">
|
||||
<Gavel className="mr-2 h-4 w-4" />
|
||||
|
||||
Reference in New Issue
Block a user