refactor: extract CSS modules for session/settings and delete styles.css (Task 2.3)

- Create InstanceList.module.css, AppShell.module.css, SettingsTabLayout.module.css
- Create CommitPanel.module.css, FileViewer.module.css
- Create page CSS files: sessions, repo-workspace, dashboard, projects,
  git-history, ssh-keys, settings
- Update components to import and use CSS modules
- Delete monolithic styles.css (2,255 lines)
- Update main.tsx to import page CSS and new modules

Quality gates: tsc (pass), eslint (pass), build (pass)
Refs: repo-restructure Task 2.3
This commit is contained in:
Developer
2026-06-02 21:09:57 +00:00
parent c8c490eb2b
commit cccf4379d8
27 changed files with 2146 additions and 3388 deletions
@@ -0,0 +1,76 @@
.commitPanel {
padding: 1rem;
border-top: 1px solid var(--border);
background: var(--panel);
}
.commitPanel h4 {
margin: 0 0 0.5rem 0;
font-size: 0.875rem;
font-weight: 600;
}
.fileList {
max-height: 150px;
overflow: auto;
margin-bottom: 0.75rem;
}
.fileItem {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.25rem 0;
font-size: 0.8125rem;
}
.fileStatus {
font-weight: bold;
font-size: 0.75rem;
width: 1rem;
text-align: center;
}
.fileItem.modified .fileStatus { color: #f59e0b; }
.fileItem.added .fileStatus { color: #10b981; }
.fileItem.deleted .fileStatus { color: #ef4444; }
.fileItem.untracked .fileStatus { color: #6b7280; }
.commitForm {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.commitMessageInput {
width: 100%;
padding: 0.5rem;
border: 1px solid var(--border);
border-radius: 4px;
background: var(--bg);
color: var(--ink);
font-family: inherit;
font-size: 0.875rem;
resize: vertical;
}
.commitButton {
padding: 0.5rem 1rem;
background: var(--primary);
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 0.875rem;
font-weight: 500;
}
.commitButton:disabled {
opacity: 0.5;
cursor: not-allowed;
}
.commitError {
color: #ef4444;
font-size: 0.8125rem;
}
@@ -0,0 +1,45 @@
.fileViewer {
background: var(--panel);
border: 1px solid var(--border);
border-radius: 8px;
overflow: hidden;
}
.fileViewerHeader {
padding: 0.75rem 1rem;
border-bottom: 1px solid var(--border);
background: var(--bg);
}
.fileBreadcrumbs {
font-size: 0.875rem;
font-family: monospace;
}
.breadcrumbSep {
color: var(--muted);
margin: 0 0.25rem;
}
.fileContent {
padding: 1rem;
overflow: auto;
max-height: calc(100vh - 200px);
}
.fileContent pre {
margin: 0;
font-family: "IBM Plex Mono", monospace;
font-size: 0.875rem;
line-height: 1.5;
white-space: pre-wrap;
word-wrap: break-word;
}
.fileViewerEmpty {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
min-height: 300px;
}