Files
fusion/packages/dashboard/app/components/SettingsSyncLog.css
gsxdsm f6dd4467cc fix(dashboard): repair desktop modal widths and NodesView CSS regressions
- Move misclassified .mesh-topology, .connect-node, .nodes-view-topology, .node-status-indicator, and pulse-warning keyframe from AgentReflectionsTab.css to NodesView.css; relocate node-related mobile @media rules from SettingsSyncLog.css so NodesView renders standalone
- Add missing CSS import on GitManagerModal so its .gm-* styles load without depending on ScriptsModal being mounted
- Bump desktop max-widths for FileBrowser, Terminal, GitManager, GitHubImport, and WorkflowStepManager modals; raise selector specificity to .modal.X so the base .modal { width: 480px } can't win the cascade

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-24 22:25:57 -07:00

184 lines
3.6 KiB
CSS

/* === SettingsSyncLog === */
.settings-sync-log {
display: flex;
flex-direction: column;
gap: var(--space-sm);
}
.settings-sync-log__header {
display: flex;
align-items: center;
gap: var(--space-xs);
cursor: pointer;
padding: var(--space-xs) 0;
border-radius: var(--radius-sm);
border: none;
background: transparent;
color: var(--text);
font: inherit;
text-align: left;
transition: background-color var(--transition-fast);
}
.settings-sync-log__header:hover {
background: var(--surface-hover);
}
.settings-sync-log__header:focus-visible {
outline: none;
box-shadow: var(--focus-ring-strong);
background: var(--surface-hover);
}
.settings-sync-log__chevron {
transform: rotate(0deg);
transition: transform var(--transition-fast);
}
.settings-sync-log__chevron--expanded {
transform: rotate(180deg);
}
.settings-sync-log__filters {
display: flex;
gap: var(--space-sm);
align-items: center;
flex-wrap: wrap;
}
.settings-sync-log__filters label {
display: flex;
align-items: center;
gap: var(--space-xs);
font-size: 12px;
color: var(--text-muted);
}
.settings-sync-log__filters select {
font-size: 12px;
padding: 4px 8px;
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius-sm);
color: var(--text);
}
.settings-sync-log__filters select:focus {
outline: none;
border-color: var(--todo);
box-shadow: var(--focus-ring);
}
.settings-sync-log__list {
display: flex;
flex-direction: column;
}
.settings-sync-log__entry {
display: flex;
align-items: center;
gap: var(--space-sm);
padding: var(--space-xs) 0;
border-bottom: 1px solid var(--border);
}
.settings-sync-log__entry:last-child {
border-bottom: none;
}
.settings-sync-log__entry-timestamp {
font-size: 12px;
color: var(--text-muted);
min-width: 140px;
}
.settings-sync-log__entry-direction {
display: flex;
align-items: center;
color: var(--text-muted);
}
.settings-sync-log__entry-result {
display: inline-flex;
padding: 2px 8px;
border-radius: 999px;
font-size: 11px;
font-weight: 500;
}
.settings-sync-log__badge--success {
background: color-mix(in srgb, var(--color-success, #2da44e) 14%, transparent);
color: var(--color-success, #2da44e);
}
.settings-sync-log__badge--conflict {
background: color-mix(in srgb, #d29922 14%, transparent);
color: #d29922;
}
.settings-sync-log__badge--error {
background: color-mix(in srgb, var(--color-error, #cf222e) 14%, transparent);
color: var(--color-error, #cf222e);
}
.settings-sync-log__entry-node {
font-weight: 500;
font-size: 12px;
}
.settings-sync-log__entry-details {
font-size: 12px;
color: var(--text-muted);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
flex: 1;
}
.settings-sync-log__empty {
text-align: center;
color: var(--text-muted);
padding: var(--space-md);
font-size: 13px;
}
.project-node-selector {
display: flex;
flex-direction: column;
gap: 6px;
}
.project-node-selector__label {
color: var(--text-muted);
font-size: 12px;
}
.project-node-selector select {
width: 100%;
max-width: 320px;
}
.project-node-selector__option--dim {
color: var(--text-muted);
}
.node-badge {
display: inline-flex;
align-items: center;
padding: 2px 8px;
border-radius: 999px;
background: color-mix(in srgb, var(--accent) 14%, transparent);
border: 1px solid color-mix(in srgb, var(--accent) 36%, transparent);
color: var(--text-muted);
font-size: 11px;
width: fit-content;
margin-top: 4px;
}
@media (max-width: 768px) {
.settings-sync-conflict-modal__diff-panel {
grid-template-columns: 1fr;
}
}