Fix Tailwind CSS styling configuration
- Add tailwind.config.ts with proper content paths and theme config - Add postcss.config.js for Tailwind and autoprefixer processing - Downgrade tailwindcss to v3.4.17 and add missing PostCSS dependencies - Update Dockerfile to clarify build process - Fix UI styling issues in Docker environment
This commit is contained in:
@@ -3,16 +3,68 @@ import type { Metadata } from 'next'
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'Trading Bot Dashboard',
|
||||
description: 'AI-powered trading bot dashboard with auto-trading, analysis, and developer tools.'
|
||||
description: 'AI-powered trading bot dashboard with auto-trading, analysis, and developer tools.',
|
||||
viewport: 'width=device-width, initial-scale=1',
|
||||
}
|
||||
|
||||
export default function RootLayout({ children }: { children: React.ReactNode }) {
|
||||
return (
|
||||
<html lang="en" suppressHydrationWarning>
|
||||
<body className="bg-gray-950 text-gray-100 min-h-screen" suppressHydrationWarning>
|
||||
<main className="max-w-5xl mx-auto py-8">
|
||||
{children}
|
||||
</main>
|
||||
<body className="bg-gray-950 text-gray-100 min-h-screen antialiased" suppressHydrationWarning>
|
||||
<div className="min-h-screen bg-gradient-to-br from-gray-950 via-gray-900 to-gray-950">
|
||||
{/* Header */}
|
||||
<header className="border-b border-gray-800 bg-gray-900/50 backdrop-blur-sm">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div className="flex justify-between items-center h-16">
|
||||
<div className="flex items-center space-x-4">
|
||||
<div className="flex items-center space-x-2">
|
||||
<div className="w-8 h-8 bg-gradient-to-br from-cyan-400 to-blue-600 rounded-lg flex items-center justify-center">
|
||||
<span className="text-white font-bold text-sm">TB</span>
|
||||
</div>
|
||||
<div>
|
||||
<h1 className="text-xl font-bold text-white">Trading Bot</h1>
|
||||
<p className="text-xs text-gray-400">AI-Powered Dashboard</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center space-x-4">
|
||||
<div className="hidden sm:flex items-center space-x-2 text-sm">
|
||||
<div className="w-2 h-2 bg-green-400 rounded-full animate-pulse"></div>
|
||||
<span className="text-gray-300">Live</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center space-x-2">
|
||||
<div className="w-8 h-8 bg-gray-700 rounded-full flex items-center justify-center">
|
||||
<span className="text-gray-300 text-sm">👤</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{/* Main Content */}
|
||||
<main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
||||
{children}
|
||||
</main>
|
||||
|
||||
{/* Footer */}
|
||||
<footer className="border-t border-gray-800 bg-gray-900/30 backdrop-blur-sm mt-16">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
|
||||
<div className="flex flex-col sm:flex-row justify-between items-center">
|
||||
<div className="text-sm text-gray-400">
|
||||
© 2025 Trading Bot Dashboard. Powered by AI.
|
||||
</div>
|
||||
<div className="flex items-center space-x-4 mt-4 sm:mt-0">
|
||||
<div className="text-xs text-gray-500">
|
||||
Next.js 15 • TypeScript • Tailwind CSS
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user