Fix multiple critical bugs: continueSessionInChat, projects link, mode buttons

Bug fixes:
- Add missing showLoadingOverlay/hideLoadingOverlay functions to ide.js
  (previously only existed in sessions-landing.js, causing continueSessionInChat to fail)
- Add loading overlay CSS styles to main style.css
- Fix Projects button URL: /projects -> /claude/ide?view=projects
- Add ?view= URL parameter handling in ide.js initialization
- Add missing Native mode button to chat view (now has 3 modes: Chat, Native, Terminal)

These fixes resolve:
1. "Continue in Chat" button not working in sessions view
2. Projects button in landing page nav taking to wrong URL
3. Missing "Native" mode button (user referred to as "Full Stack mode")
4. Loading overlay not displaying in IDE

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
uroma
2026-01-21 07:03:04 +00:00
Unverified
parent c244e118f3
commit a0fd70418f
11 changed files with 3556 additions and 2 deletions

View File

@@ -473,3 +473,99 @@
transform: translateY(-8px);
}
}
/* ============================================
Chat Mode Buttons (Chat/Terminal)
============================================ */
.chat-modes-bar {
display: flex;
gap: 8px;
padding: 12px 16px;
background: #0d0d0d;
border-bottom: 1px solid #333;
align-items: center;
}
.mode-btn {
display: flex;
align-items: center;
gap: 8px;
padding: 10px 16px;
background: #1a1a1a;
border: 2px solid #333;
border-radius: 8px;
color: #888;
font-size: 14px;
font-weight: 500;
cursor: pointer;
transition: all 0.2s ease;
white-space: nowrap;
}
.mode-btn:hover {
background: #252525;
border-color: #444;
color: #e0e0e0;
}
.mode-btn.active {
background: rgba(74, 158, 255, 0.15);
border-color: #4a9eff;
color: #4a9eff;
}
.mode-icon {
font-size: 18px;
line-height: 1;
}
.mode-label {
font-size: 14px;
}
/* Mobile Responsiveness for Mode Buttons */
@media (max-width: 768px) {
.chat-modes-bar {
padding: 10px 12px;
gap: 6px;
flex-wrap: wrap;
justify-content: center;
}
.mode-btn {
flex: 1;
min-width: 0;
padding: 8px 12px;
font-size: 13px;
justify-content: center;
}
.mode-icon {
font-size: 16px;
}
.mode-label {
font-size: 13px;
}
}
@media (max-width: 480px) {
.chat-modes-bar {
padding: 8px;
gap: 4px;
}
.mode-btn {
padding: 8px 10px;
font-size: 12px;
}
.mode-btn .mode-label {
display: none;
}
.mode-btn .mode-icon {
font-size: 18px;
}
}