Set up the basic structure and core functionality for the application
Initialize project with UI components, core libraries, and basic app structure. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 556aa286-edd2-4cea-8583-f4fc3cfd119b
This commit is contained in:
@@ -0,0 +1,213 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
:root {
|
||||
--background: 0 0% 100%;
|
||||
--foreground: 222 84% 5%;
|
||||
--muted: 210 40% 98%;
|
||||
--muted-foreground: 215 16% 47%;
|
||||
--popover: 0 0% 100%;
|
||||
--popover-foreground: 222 84% 5%;
|
||||
--card: 0 0% 100%;
|
||||
--card-foreground: 222 84% 5%;
|
||||
--border: 214 32% 91%;
|
||||
--input: 214 32% 91%;
|
||||
--primary: 207 90% 54%;
|
||||
--primary-foreground: 211 100% 99%;
|
||||
--secondary: 273 69% 66%;
|
||||
--secondary-foreground: 273 100% 99%;
|
||||
--accent: 142 76% 36%;
|
||||
--accent-foreground: 142 100% 99%;
|
||||
--destructive: 0 84% 60%;
|
||||
--destructive-foreground: 0 0% 98%;
|
||||
--ring: 222 84% 5%;
|
||||
--radius: 0.5rem;
|
||||
--chart-1: 12 76% 61%;
|
||||
--chart-2: 173 58% 39%;
|
||||
--chart-3: 197 37% 24%;
|
||||
--chart-4: 43 74% 66%;
|
||||
--chart-5: 27 87% 67%;
|
||||
--sidebar-background: 0 0% 98%;
|
||||
--sidebar-foreground: 240 5% 26%;
|
||||
--sidebar-primary: 207 90% 54%;
|
||||
--sidebar-primary-foreground: 211 100% 99%;
|
||||
--sidebar-accent: 210 40% 98%;
|
||||
--sidebar-accent-foreground: 222 84% 5%;
|
||||
--sidebar-border: 214 32% 91%;
|
||||
--sidebar-ring: 222 84% 5%;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: 222 84% 5%;
|
||||
--foreground: 210 40% 98%;
|
||||
--muted: 217 32% 17%;
|
||||
--muted-foreground: 215 20% 65%;
|
||||
--popover: 222 84% 5%;
|
||||
--popover-foreground: 210 40% 98%;
|
||||
--card: 222 84% 5%;
|
||||
--card-foreground: 210 40% 98%;
|
||||
--border: 217 32% 17%;
|
||||
--input: 217 32% 17%;
|
||||
--primary: 207 90% 54%;
|
||||
--primary-foreground: 211 100% 99%;
|
||||
--secondary: 273 69% 66%;
|
||||
--secondary-foreground: 273 100% 99%;
|
||||
--accent: 142 76% 36%;
|
||||
--accent-foreground: 142 100% 99%;
|
||||
--destructive: 0 63% 31%;
|
||||
--destructive-foreground: 0 0% 98%;
|
||||
--ring: 215 20% 65%;
|
||||
--sidebar-background: 222 84% 5%;
|
||||
--sidebar-foreground: 210 40% 98%;
|
||||
--sidebar-primary: 207 90% 54%;
|
||||
--sidebar-primary-foreground: 211 100% 99%;
|
||||
--sidebar-accent: 217 32% 17%;
|
||||
--sidebar-accent-foreground: 210 40% 98%;
|
||||
--sidebar-border: 217 32% 17%;
|
||||
--sidebar-ring: 215 20% 65%;
|
||||
}
|
||||
|
||||
@layer base {
|
||||
* {
|
||||
@apply border-border;
|
||||
}
|
||||
|
||||
body {
|
||||
@apply font-sans antialiased bg-background text-foreground;
|
||||
}
|
||||
|
||||
/* Voice processing animations */
|
||||
.voice-pulse {
|
||||
animation: voice-pulse 1.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.voice-recording {
|
||||
animation: voice-recording 1.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes voice-pulse {
|
||||
0%, 100% {
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
50% {
|
||||
transform: scale(1.05);
|
||||
opacity: 0.8;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes voice-recording {
|
||||
0%, 100% {
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7);
|
||||
}
|
||||
50% {
|
||||
transform: scale(1.1);
|
||||
opacity: 0.8;
|
||||
box-shadow: 0 0 0 10px rgba(59, 130, 246, 0);
|
||||
}
|
||||
}
|
||||
|
||||
/* Custom scrollbars */
|
||||
::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
@apply bg-muted;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
@apply bg-border rounded-full;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
@apply bg-ring;
|
||||
}
|
||||
|
||||
/* Focus styles */
|
||||
.focus-ring {
|
||||
@apply focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2;
|
||||
}
|
||||
|
||||
/* Voice visualizer gradient */
|
||||
.voice-gradient {
|
||||
background: linear-gradient(45deg, hsl(var(--primary)), hsl(var(--secondary)));
|
||||
}
|
||||
|
||||
/* Task priority indicators */
|
||||
.priority-high {
|
||||
@apply border-l-4 border-red-500;
|
||||
}
|
||||
|
||||
.priority-medium {
|
||||
@apply border-l-4 border-yellow-500;
|
||||
}
|
||||
|
||||
.priority-low {
|
||||
@apply border-l-4 border-green-500;
|
||||
}
|
||||
}
|
||||
|
||||
/* Component-specific styles */
|
||||
.dashboard-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 256px 1fr;
|
||||
min-height: calc(100vh - 73px);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.dashboard-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
/* Voice status indicator */
|
||||
.voice-status-indicator {
|
||||
position: fixed;
|
||||
bottom: 1.5rem;
|
||||
right: 1.5rem;
|
||||
z-index: 50;
|
||||
transform: translateY(100%);
|
||||
transition: transform 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.voice-status-indicator.visible {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
/* AI chat animations */
|
||||
.ai-message {
|
||||
animation: slideInFromBottom 0.3s ease-out;
|
||||
}
|
||||
|
||||
@keyframes slideInFromBottom {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(20px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
/* Loading states */
|
||||
.skeleton {
|
||||
@apply animate-pulse bg-muted rounded;
|
||||
}
|
||||
|
||||
.loading-spinner {
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user