拖拽或点击浏览
PNG, JPG, WEBP up to 10MB
生成视频以在此处查看结果。
正在合成帧...
import React from 'react'; export default function ExtractedDashboard() { return ( <div className="flex h-screen bg-slate-50"> {/* Sidebar */} <aside className="w-64 bg-white border-r p-6"> <h1 className="text-xl font-bold text-slate-800">AppLogo</h1> <nav className="mt-8 space-y-2"> <a href="#" className="block px-4 py-2 bg-indigo-50 text-indigo-600 rounded-lg">Dashboard</a> <a href="#" className="block px-4 py-2 text-slate-600 hover:bg-slate-50 rounded-lg">Analytics</a> </nav> </aside> {/* Main Content */} <main className="flex-1 p-8 overflow-y-auto"> <header className="flex justify-between items-center mb-8"> <h2 className="text-2xl font-bold text-slate-800">Overview</h2> <button className="bg-indigo-600 text-white px-4 py-2 rounded-lg">New Report</button> </header> {/* Metric Cards */} <div className="grid grid-cols-3 gap-6 mb-8"> {[1, 2, 3].map(i => ( <div key={i} className="bg-white p-6 rounded-xl shadow-sm border border-slate-100"> <p className="text-sm text-slate-500">Metric {i}</p> <p className="text-2xl font-bold text-slate-800 mt-2">1,234</p> </div> ))} </div> </main> </div> ); }