feat(canvas): Responsive full-screen layout and dark theme
Phase 2 of Canvas Professional Upgrade: - Update AtomizerCanvas with Lucide icons (MessageCircle, Plug, X) - Update CanvasView page with dark theme styling - Replace emoji buttons with Lucide icons (ClipboardList, Download, Trash2) - Update Setup canvas tab for full-width responsive layout - Use calc(100vh-6rem) for proper canvas height Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -254,12 +254,12 @@ export default function Setup() {
|
||||
return acc * 1000; // Approximate for continuous
|
||||
}, 1) || 0;
|
||||
|
||||
// Canvas tab - full height
|
||||
// Canvas tab - full height and full width
|
||||
if (activeTab === 'canvas') {
|
||||
return (
|
||||
<div className="w-full h-full flex flex-col">
|
||||
<div className="w-full h-[calc(100vh-6rem)] flex flex-col -mx-6 -my-6 px-4 pt-4">
|
||||
{/* Tab Bar */}
|
||||
<div className="flex items-center gap-2 mb-4 border-b border-dark-700 pb-4">
|
||||
<div className="flex items-center gap-2 mb-3 border-b border-dark-700 pb-3">
|
||||
<button
|
||||
onClick={() => setActiveTab('config')}
|
||||
className="flex items-center gap-2 px-4 py-2 rounded-lg transition-colors bg-dark-800 text-dark-300 hover:text-white hover:bg-dark-700"
|
||||
|
||||
Reference in New Issue
Block a user