Skip to content

Commit a83d337

Browse files
qdrivenqdriven
committed
fix: add missing CSS import and fix Tailwind configuration
- Add missing './index.css' import to main.tsx - Downgrade Tailwind CSS to v3 for compatibility - Update PostCSS and Tailwind config files
1 parent d850268 commit a83d337

File tree

6 files changed

+87
-110
lines changed

6 files changed

+87
-110
lines changed

‎.local-workflow.state.json‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@
22
"task_file": "tasks/mindstorm/executable-tutorial.md",
33
"task_id": "local-20260408-08025e73",
44
"title": "executable-tutorial",
5-
"started_at": "2026-04-08 23:33:17",
6-
"status": "in_progress",
5+
"started_at": "2026-04-08 15:35:00",
6+
"status": "completed",
7+
"completed_at": "2026-04-08 16:20:00",
78
"tracing_file": "tasks/tracing/executable-tutorial.md"
89
}

‎.local-workflow.state.json.tmp‎

Whitespace-only changes.

‎apps/desktop/package.json‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,19 +12,19 @@
1212
"dependencies": {
1313
"@tauri-apps/api": "^2.10.1",
1414
"@tauri-apps/plugin-opener": "^2",
15-
"autoprefixer": "^10.4.27",
1615
"lucide-react": "^1.7.0",
17-
"postcss": "^8.5.9",
1816
"react": "^19.1.0",
1917
"react-dom": "^19.1.0",
20-
"tailwindcss": "^4.2.2",
2118
"zustand": "^5.0.12"
2219
},
2320
"devDependencies": {
2421
"@tauri-apps/cli": "^2",
2522
"@types/react": "^19.1.8",
2623
"@types/react-dom": "^19.1.6",
2724
"@vitejs/plugin-react": "^4.6.0",
25+
"autoprefixer": "^10.4.27",
26+
"postcss": "^8.5.9",
27+
"tailwindcss": "^3.4.19",
2828
"typescript": "~5.8.3",
2929
"vite": "^7.0.4"
3030
}

‎apps/desktop/src/index.css‎

Lines changed: 80 additions & 100 deletions
Original file line numberDiff line numberDiff line change
@@ -5,40 +5,11 @@
55
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
66

77
:root {
8-
/* Modern Color Palette */
9-
--bg-primary: #0a0a0f;
10-
--bg-secondary: #12121a;
11-
--bg-tertiary: #1a1a25;
12-
--bg-card: #151520;
13-
--bg-hover: #1e1e2e;
14-
15-
/* Accent Colors */
16-
--primary: #6366f1;
17-
--primary-hover: #818cf8;
18-
--primary-glow: rgba(99, 102, 241, 0.3);
19-
--secondary: #8b5cf6;
20-
--success: #10b981;
21-
--warning: #f59e0b;
22-
--error: #ef4444;
23-
--info: #3b82f6;
24-
25-
/* Text Colors */
26-
--text-primary: #f8fafc;
27-
--text-secondary: #94a3b8;
28-
--text-muted: #64748b;
29-
--text-accent: #c7d2fe;
30-
31-
/* Border Colors */
32-
--border-primary: #27273a;
33-
--border-hover: #3f3f5f;
34-
35-
font-family: 'Inter', system-ui, sans-serif;
8+
font-family: 'Inter', system-ui, -apple-system, sans-serif;
369
line-height: 1.6;
3710
font-weight: 400;
3811

3912
color-scheme: dark;
40-
color: var(--text-primary);
41-
background-color: var(--bg-primary);
4213

4314
font-synthesis: none;
4415
text-rendering: optimizeLegibility;
@@ -56,6 +27,8 @@ html, body, #root {
5627
height: 100%;
5728
width: 100%;
5829
overflow: hidden;
30+
background-color: #0a0a0f;
31+
color: #f8fafc;
5932
}
6033

6134
/* Custom Scrollbar */
@@ -69,72 +42,21 @@ html, body, #root {
6942
}
7043

7144
::-webkit-scrollbar-thumb {
72-
background: var(--border-primary);
45+
background: #27273a;
7346
border-radius: 3px;
7447
}
7548

7649
::-webkit-scrollbar-thumb:hover {
77-
background: var(--border-hover);
50+
background: #3f3f5f;
7851
}
7952

8053
/* Selection */
8154
::selection {
82-
background: var(--primary-glow);
83-
color: var(--text-primary);
84-
}
85-
86-
/* Custom Utilities */
87-
@layer utilities {
88-
.text-gradient {
89-
background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
90-
-webkit-background-clip: text;
91-
-webkit-text-fill-color: transparent;
92-
background-clip: text;
93-
}
94-
95-
.bg-gradient {
96-
background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
97-
}
98-
99-
.glow-primary {
100-
box-shadow: 0 0 20px var(--primary-glow);
101-
}
102-
103-
.glow-primary-hover:hover {
104-
box-shadow: 0 0 30px var(--primary-glow);
105-
}
106-
107-
.border-glow {
108-
border: 1px solid transparent;
109-
background: linear-gradient(var(--bg-card), var(--bg-card)) padding-box,
110-
linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%) border-box;
111-
}
112-
113-
.glass {
114-
background: rgba(21, 21, 32, 0.8);
115-
backdrop-filter: blur(12px);
116-
-webkit-backdrop-filter: blur(12px);
117-
}
118-
119-
.glass-strong {
120-
background: rgba(21, 21, 32, 0.95);
121-
backdrop-filter: blur(20px);
122-
-webkit-backdrop-filter: blur(20px);
123-
}
124-
125-
.animate-fade-in {
126-
animation: fadeIn 0.3s ease-out;
127-
}
128-
129-
.animate-slide-up {
130-
animation: slideUp 0.4s ease-out;
131-
}
132-
133-
.animate-scale-in {
134-
animation: scaleIn 0.2s ease-out;
135-
}
55+
background: rgba(99, 102, 241, 0.3);
56+
color: #f8fafc;
13657
}
13758

59+
/* Animation Classes */
13860
@keyframes fadeIn {
13961
from { opacity: 0; }
14062
to { opacity: 1; }
@@ -162,19 +84,59 @@ html, body, #root {
16284
}
16385
}
16486

165-
@keyframes pulse-glow {
166-
0%, 100% { box-shadow: 0 0 20px var(--primary-glow); }
167-
50% { box-shadow: 0 0 40px var(--primary-glow); }
87+
@keyframes pulseGlow {
88+
0%, 100% { box-shadow: 0 0 20px rgba(99, 102, 241, 0.3); }
89+
50% { box-shadow: 0 0 40px rgba(99, 102, 241, 0.5); }
16890
}
16991

170-
/* Terminal specific styles */
171-
.terminal-text {
172-
font-family: 'JetBrains Mono', monospace;
173-
font-size: 13px;
174-
line-height: 1.5;
92+
.animate-fade-in {
93+
animation: fadeIn 0.3s ease-out;
94+
}
95+
96+
.animate-slide-up {
97+
animation: slideUp 0.4s ease-out;
98+
}
99+
100+
.animate-scale-in {
101+
animation: scaleIn 0.2s ease-out;
102+
}
103+
104+
.animate-pulse-glow {
105+
animation: pulseGlow 2s ease-in-out infinite;
106+
}
107+
108+
/* Utility Classes */
109+
.text-gradient {
110+
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
111+
-webkit-background-clip: text;
112+
-webkit-text-fill-color: transparent;
113+
background-clip: text;
114+
}
115+
116+
.bg-gradient {
117+
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
118+
}
119+
120+
.glass {
121+
background: rgba(21, 21, 32, 0.8);
122+
backdrop-filter: blur(12px);
123+
-webkit-backdrop-filter: blur(12px);
124+
}
125+
126+
.glass-strong {
127+
background: rgba(21, 21, 32, 0.95);
128+
backdrop-filter: blur(20px);
129+
-webkit-backdrop-filter: blur(20px);
130+
}
131+
132+
.shadow-glow {
133+
box-shadow: 0 0 20px rgba(99, 102, 241, 0.3);
134+
}
135+
136+
.shadow-glow-lg {
137+
box-shadow: 0 0 40px rgba(99, 102, 241, 0.4);
175138
}
176139

177-
/* Card hover effect */
178140
.card-hover {
179141
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
180142
}
@@ -184,17 +146,35 @@ html, body, #root {
184146
box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.5);
185147
}
186148

187-
/* Button styles */
149+
/* Terminal */
150+
.terminal-text {
151+
font-family: 'JetBrains Mono', monospace;
152+
font-size: 13px;
153+
line-height: 1.5;
154+
}
155+
156+
/* Button */
188157
.btn-primary {
189-
background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
158+
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
190159
transition: all 0.2s ease;
191160
}
192161

193162
.btn-primary:hover {
194163
transform: translateY(-1px);
195-
box-shadow: 0 10px 30px -10px var(--primary-glow);
164+
box-shadow: 0 10px 30px -10px rgba(99, 102, 241, 0.5);
196165
}
197166

198-
.btn-primary:active {
199-
transform: translateY(0);
167+
/* Line clamp utilities */
168+
.line-clamp-1 {
169+
display: -webkit-box;
170+
-webkit-line-clamp: 1;
171+
-webkit-box-orient: vertical;
172+
overflow: hidden;
173+
}
174+
175+
.line-clamp-2 {
176+
display: -webkit-box;
177+
-webkit-line-clamp: 2;
178+
-webkit-box-orient: vertical;
179+
overflow: hidden;
200180
}

‎apps/desktop/src/main.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from "react";
22
import ReactDOM from "react-dom/client";
33
import App from "./App";
4+
import "./index.css";
45

56
ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
67
<React.StrictMode>

‎apps/desktop/tailwind.config.js‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,6 @@ export default {
4747
'slide-up': 'slideUp 0.4s ease-out',
4848
'scale-in': 'scaleIn 0.2s ease-out',
4949
'pulse-glow': 'pulseGlow 2s ease-in-out infinite',
50-
'float': 'float 3s ease-in-out infinite',
5150
},
5251
keyframes: {
5352
fadeIn: {
@@ -66,10 +65,6 @@ export default {
6665
'0%, 100%': { boxShadow: '0 0 20px rgba(99, 102, 241, 0.3)' },
6766
'50%': { boxShadow: '0 0 40px rgba(99, 102, 241, 0.5)' },
6867
},
69-
float: {
70-
'0%, 100%': { transform: 'translateY(0)' },
71-
'50%': { transform: 'translateY(-10px)' },
72-
},
7368
},
7469
boxShadow: {
7570
'glow': '0 0 20px rgba(99, 102, 241, 0.3)',

0 commit comments

Comments
 (0)