Fix React error #130 by correcting Card component usage

- Fixed all Card components to use padding prop instead of className
- Updated padding values: p-4 -> sm, p-6 -> md, p-8 -> lg
- This resolves the React element type invalid error

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
2025-07-07 11:00:15 +02:00
parent 225d017718
commit 8dad933ff1
15 changed files with 73 additions and 47 deletions
+9 -9
View File
@@ -181,7 +181,7 @@ export const AnalyticsPage: React.FC = () => {
</Button>
</div>
<Card className="p-0 overflow-hidden" style={{ height: '800px' }}>
<Card padding="none" className="overflow-hidden" style={{ height: '800px' }}>
<iframe
src={umamiShareUrl}
className="w-full h-full border-0"
@@ -231,7 +231,7 @@ export const AnalyticsPage: React.FC = () => {
{/* Key Metrics */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-6 mb-6">
<Card className="p-6">
<Card padding="md">
<div className="flex items-start justify-between mb-4">
<div>
<p className="text-sm text-neutral-600">Page Views</p>
@@ -248,7 +248,7 @@ export const AnalyticsPage: React.FC = () => {
)}
</Card>
<Card className="p-6">
<Card padding="md">
<div className="flex items-start justify-between mb-4">
<div>
<p className="text-sm text-neutral-600">Unique Visitors</p>
@@ -265,7 +265,7 @@ export const AnalyticsPage: React.FC = () => {
)}
</Card>
<Card className="p-6">
<Card padding="md">
<div className="flex items-start justify-between mb-4">
<div>
<p className="text-sm text-neutral-600">Total Downloads</p>
@@ -288,7 +288,7 @@ export const AnalyticsPage: React.FC = () => {
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
{/* Top Pages */}
<div className="lg:col-span-2">
<Card className="p-6">
<Card padding="md">
<h2 className="text-lg font-semibold text-neutral-900 mb-4">Top Pages</h2>
<div className="space-y-3">
{analytics?.topPages.map((page, index) => (
@@ -309,7 +309,7 @@ export const AnalyticsPage: React.FC = () => {
</Card>
{/* Top Downloads */}
<Card className="p-6 mt-6">
<Card padding="md" className="mt-6">
<h2 className="text-lg font-semibold text-neutral-900 mb-4">Top Downloads by Gallery</h2>
<div className="space-y-3">
{analytics?.downloads.topGalleries.map((gallery, index) => (
@@ -339,7 +339,7 @@ export const AnalyticsPage: React.FC = () => {
{/* Right Column */}
<div className="space-y-6">
{/* Device Breakdown */}
<Card className="p-6">
<Card padding="md">
<h2 className="text-lg font-semibold text-neutral-900 mb-4">Device Breakdown</h2>
<div className="space-y-4">
<div className="flex items-center justify-between">
@@ -368,7 +368,7 @@ export const AnalyticsPage: React.FC = () => {
{/* Storage Information */}
{dashboardStats && (
<Card className="p-6">
<Card padding="md">
<h2 className="text-lg font-semibold text-neutral-900 mb-4">Storage Usage</h2>
<div className="space-y-4">
<div>
@@ -404,7 +404,7 @@ export const AnalyticsPage: React.FC = () => {
{/* Configuration Notice */}
{!umamiUrl && (
<Card className="p-6 mt-6 bg-amber-50 border-amber-200">
<Card padding="md" className="mt-6 bg-amber-50 border-amber-200">
<div className="flex items-start gap-3">
<Activity className="w-5 h-5 text-amber-600 flex-shrink-0" />
<div>