@pheem49/mint 1.16.0 → 1.17.0

package/src/renderer/src/css/chat.css

@@ -170,6 +170,34 @@
   color: var(--text-primary);
 }
 
+.provider-chip-logo {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 13px;
+  height: 13px;
+  flex-shrink: 0;
+  vertical-align: middle;
+}
+
+.provider-chip-logo img {
+  width: 100%;
+  height: 100%;
+  object-fit: contain;
+  display: block;
+}
+
+.provider-chip-logo.is-monochrome {
+  background-color: var(--provider-brand-color, currentColor);
+  -webkit-mask-repeat: no-repeat;
+  mask-repeat: no-repeat;
+  -webkit-mask-size: contain;
+  mask-size: contain;
+  -webkit-mask-position: center;
+  mask-position: center;
+  display: inline-block;
+}
+
 .provider-chip-dot {
   width: 6px;
   height: 6px;
@@ -650,16 +678,16 @@
 
 #chat-tool-btn,
 #screen-capture-btn {
-  background: transparent;
-  color: var(--text-muted);
-  border: 1px solid var(--border);
+  background: var(--btn-gray-bg, transparent);
+  color: var(--btn-gray-fg, var(--text-muted));
+  border: 1px solid var(--btn-gray-border, var(--border));
 }
 
 #chat-tool-btn:hover,
 #screen-capture-btn:hover {
-  background: color-mix(in srgb, var(--accent) 15%, transparent);
-  color: var(--interactive-fg);
-  border-color: color-mix(in srgb, var(--accent) 40%, transparent);
+  background: var(--btn-gray-bg-hover, color-mix(in srgb, var(--accent) 15%, transparent));
+  color: var(--interactive-fg, #ffffff);
+  border-color: var(--accent-border, color-mix(in srgb, var(--accent) 40%, transparent));
 }
 
 .action-card {
@@ -1593,31 +1621,31 @@
 }
 
 .agent-activity-status[data-state="done"] {
-  border-color: rgba(16, 185, 129, 0.35);
-  color: #34d399;
-  background: rgba(16, 185, 129, 0.08);
+  border-color: var(--status-success-border);
+  color: var(--status-success-fg);
+  background: var(--status-success-bg);
 }
 
 .agent-activity-status[data-state="done"]::before {
-  background: #34d399;
-  box-shadow: 0 0 6px #34d399;
+  background: var(--status-success-fg);
+  box-shadow: 0 0 6px var(--status-success-fg);
 }
 
 .agent-activity-status[data-state="error"] {
-  border-color: rgba(239, 68, 68, 0.35);
-  color: #f87171;
-  background: rgba(239, 68, 68, 0.08);
+  border-color: var(--status-error-border);
+  color: var(--status-error-fg);
+  background: var(--status-error-bg);
 }
 
 .agent-activity-status[data-state="error"]::before {
-  background: #f87171;
-  box-shadow: 0 0 6px #f87171;
+  background: var(--status-error-fg);
+  box-shadow: 0 0 6px var(--status-error-fg);
 }
 
 .agent-activity-status[data-state="cancelled"] {
-  border-color: rgba(148, 163, 184, 0.28);
+  border-color: var(--border-default);
   color: var(--text-muted);
-  background: rgba(148, 163, 184, 0.05);
+  background: var(--bg-surface-soft);
 }
 
 .agent-activity-status[data-state="cancelled"]::before {
@@ -1625,13 +1653,13 @@
 }
 
 .agent-activity-status[data-state="approval"] {
-  border-color: rgba(245, 158, 11, 0.4);
-  color: #fbbf24;
-  background: rgba(245, 158, 11, 0.12);
+  border-color: var(--status-warning-border);
+  color: var(--status-warning-fg);
+  background: var(--status-warning-bg);
 }
 
 .agent-activity-status[data-state="approval"]::before {
-  background: #fbbf24;
+  background: var(--status-warning-fg);
   animation: pulse-ring-amber 1.8s infinite;
 }
 
@@ -1769,15 +1797,15 @@
 }
 
 .agent-activity-badge.retry {
-  background: rgba(245, 158, 11, 0.16);
-  border: 1px solid rgba(245, 158, 11, 0.35);
-  color: #fbbf24;
+  background: var(--status-warning-bg);
+  border: 1px solid var(--status-warning-border);
+  color: var(--status-warning-fg);
 }
 
 .agent-activity-badge.error {
-  background: rgba(239, 68, 68, 0.16);
-  border: 1px solid rgba(239, 68, 68, 0.35);
-  color: #f87171;
+  background: var(--status-error-bg);
+  border: 1px solid var(--status-error-border);
+  color: var(--status-error-fg);
 }
 
 .agent-activity-chevron {
@@ -2504,7 +2532,7 @@ input:checked + .slider:before {
   flex: none;
   display: flex;
   flex-direction: column;
-  padding: 44px 28px 24px 0;
+  padding: 44px 28px 12px 0;
   background: transparent;
   border: 0;
   border-radius: 0;
@@ -2743,6 +2771,130 @@ input:checked + .slider:before {
   }
 }
 
+/* Subagent Status Strip (Docked above composer) */
+.subagent-status-strip {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  max-width: calc(100% - 28px);
+  margin: 0 auto 8px;
+  padding: 8px 12px;
+  background: var(--bg-surface-raised, #18181b);
+  border: 1px solid var(--border-subtle, #27272a);
+  border-radius: var(--radius-md, 8px);
+  box-shadow: var(--shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.1));
+  font-size: 0.75rem;
+  line-height: 1.35;
+  transition: border-color 140ms ease, box-shadow 140ms ease;
+  user-select: none;
+}
+
+.subagent-status-strip[role="button"] {
+  cursor: pointer;
+}
+
+.subagent-status-strip[role="button"]:hover {
+  border-color: var(--border-strong, #3f3f46);
+  box-shadow: var(--shadow-sm, 0 2px 4px rgba(0, 0, 0, 0.15));
+}
+
+.subagent-status-strip-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  padding-bottom: 4px;
+  border-bottom: 1px solid var(--border-subtle, #27272a);
+}
+
+.subagent-status-strip-header-left {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.subagent-status-strip-title {
+  font-weight: 600;
+  color: var(--text-primary, #f4f4f5);
+}
+
+.subagent-status-strip-hint {
+  font-size: 0.7rem;
+  color: var(--flavor-mint, #10b981);
+}
+
+.subagent-status-spinner,
+.subagent-status-row-spinner {
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  border: 1.5px solid var(--border-subtle, #3f3f46);
+  border-top-color: var(--flavor-mint, #10b981);
+  border-radius: 50%;
+  animation: subagent-strip-spin 700ms linear infinite;
+}
+
+@keyframes subagent-strip-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.subagent-status-icon-check,
+.subagent-status-row-check {
+  color: var(--flavor-mint, #10b981);
+  font-weight: bold;
+}
+
+.subagent-status-icon-alert,
+.subagent-status-row-cross {
+  color: #ef4444;
+  font-weight: bold;
+}
+
+.subagent-status-strip-list {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.subagent-status-strip-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  padding: 2px 4px;
+  border-radius: var(--radius-sm, 4px);
+  background: var(--bg-surface-subtle, rgba(255, 255, 255, 0.02));
+}
+
+.subagent-status-strip-row-main {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  min-width: 0;
+  overflow: hidden;
+}
+
+.subagent-status-strip-tag {
+  color: var(--flavor-mint, #10b981);
+  font-weight: 600;
+  white-space: nowrap;
+}
+
+.subagent-status-strip-desc {
+  color: var(--text-secondary, #a1a1aa);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.subagent-status-strip-timing {
+  font-size: 0.7rem;
+  color: var(--text-muted, #71717a);
+  white-space: nowrap;
+}
+
 /* Project context is the first row of the composer, not a promotional CTA. */
 .project-context-row {
   position: relative;
@@ -3642,15 +3794,43 @@ input:checked + .slider:before {
   box-shadow: none;
 }
 
-#send-btn:hover,
-#chat-tool-btn:hover,
-#screen-capture-btn:hover {
-  background: var(--panel-raised);
-  transform: none;
+:root[data-accent-mode="monochrome"] #send-btn,
+:root[data-accent-mode="gray"] #send-btn {
+  background: var(--btn-gray-bg, #17171a);
+  color: #ffffff;
+  border: 1px solid var(--btn-gray-border, rgba(255, 255, 255, 0.12));
+}
+
+:root[data-accent-mode="monochrome"] #send-btn:hover,
+:root[data-accent-mode="gray"] #send-btn:hover {
+  background: var(--btn-gray-bg-hover, #222227);
+  color: #ffffff;
+}
+
+[data-theme="light"][data-accent-mode="monochrome"] #send-btn,
+[data-theme="light"][data-accent-mode="gray"] #send-btn {
+  background: var(--btn-gray-bg, #334155);
+  color: #ffffff;
+  border: 1px solid rgba(15, 23, 42, 0.2);
+}
+
+[data-theme="light"][data-accent-mode="monochrome"] #send-btn:hover,
+[data-theme="light"][data-accent-mode="gray"] #send-btn:hover {
+  background: var(--btn-gray-bg-hover, #1e293b);
+  color: #ffffff;
 }
 
 #send-btn:hover {
   background: var(--accent-hover);
+  transform: none;
+}
+
+#chat-tool-btn:hover,
+#screen-capture-btn:hover {
+  background: var(--btn-gray-bg-hover, var(--panel-raised));
+  border-color: var(--accent-border, var(--btn-gray-border-hover));
+  color: #ffffff;
+  transform: none;
 }
 
 #chat-tool-btn {
@@ -4098,3 +4278,10 @@ input:checked + .slider:before {
   background: #e2e8f0;
   color: #0f172a;
 }
+
+[data-theme="studio"] .user-message .message-bubble {
+  background: #1c1c1c;
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  color: #e1e1e1;
+}
+

package/src/renderer/src/css/desktop-tools.css

@@ -1,6 +1,6 @@
 .mint-titlebar {
   position: relative;
-  z-index: 300;
+  z-index: 1001;
   display: grid;
   grid-template-columns: auto minmax(24px, 1fr) auto auto;
   align-items: center;
@@ -23,337 +23,6 @@
   height: 100%;
 }
 
-.workspace-context {
-  position: relative;
-  display: flex;
-  align-items: center;
-  height: 100%;
-  -webkit-app-region: no-drag;
-}
-
-.workspace-context-trigger {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 30px;
-  height: 28px;
-  margin-right: 4px;
-  border: 0;
-  border-radius: 5px;
-  color: inherit;
-  background: transparent;
-  cursor: pointer;
-}
-
-.workspace-context-trigger:hover,
-.workspace-context-trigger.is-open {
-  color: var(--text-main, #f1f2f4);
-  background: var(--bg-surface-hover, rgba(255, 255, 255, 0.08));
-}
-
-.workspace-context-trigger svg,
-.workspace-context-heading svg {
-  width: 16px;
-  height: 16px;
-  fill: none;
-  stroke: currentColor;
-  stroke-width: 1.7;
-  stroke-linecap: round;
-  stroke-linejoin: round;
-}
-
-.workspace-context-popover {
-  max-height: calc(100dvh - 72px);
-  position: absolute;
-  z-index: 550;
-  top: calc(100% + 5px);
-  right: 6px;
-  width: min(360px, calc(100vw - 24px));
-  overflow: hidden auto;
-  border: 1px solid var(--border-default, rgba(255, 255, 255, 0.14));
-  border-radius: 12px;
-  color: var(--text-main, #f1f2f4);
-  background: var(--bg-overlay, #111113);
-  box-shadow: var(--shadow-lg, 0 20px 60px rgba(0, 0, 0, 0.6));
-}
-
-.workspace-context-heading,
-.workspace-context-sources-heading {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-
-.workspace-context-heading {
-  min-height: 42px;
-  padding: 0 10px 0 14px;
-  color: var(--text-secondary, #cbd5e1);
-  font-size: 0.74rem;
-  font-weight: 600;
-}
-
-.workspace-context-heading button {
-  display: inline-grid;
-  width: 28px;
-  height: 28px;
-  place-items: center;
-  border: 0;
-  border-radius: 5px;
-  color: var(--text-muted, #94a3b8);
-  background: transparent;
-  cursor: pointer;
-}
-
-.workspace-context-heading button:hover:not(:disabled) {
-  color: var(--text-main, #f1f2f4);
-  background: var(--bg-surface-hover, rgba(255, 255, 255, 0.08));
-}
-
-.workspace-context-heading button:disabled { opacity: 0.5; cursor: wait; }
-
-.workspace-context-row {
-  display: grid;
-  grid-template-columns: 22px minmax(0, 1fr) auto;
-  align-items: center;
-  width: 100%;
-  min-height: 54px;
-  padding: 7px 14px;
-  border: 0;
-  border-top: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
-  color: inherit;
-  background: transparent;
-  font: inherit;
-  text-align: left;
-}
-
-button.workspace-context-row { cursor: pointer; }
-button.workspace-context-row:hover:not(:disabled) { background: var(--bg-surface-hover, rgba(255, 255, 255, 0.08)); }
-button.workspace-context-row:disabled { opacity: 0.52; cursor: default; }
-
-.workspace-context-icon {
-  color: var(--interactive-fg, var(--accent));
-  font-family: var(--font-mono, monospace);
-  font-size: 0.82rem;
-}
-
-.workspace-context-copy { min-width: 0; }
-.workspace-context-copy strong,
-.workspace-context-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.workspace-context-copy strong { font-size: 0.77rem; font-weight: 600; }
-.workspace-context-copy small { margin-top: 2px; color: var(--text-muted, #94a3b8); font-size: 0.68rem; }
-.workspace-context-action { color: var(--interactive-fg, var(--accent)); font-size: 0.68rem; }
-.workspace-context-status { color: var(--text-muted, #94a3b8); font-size: 0.68rem; }
-.workspace-context-status.is-dirty { color: var(--status-warning, #fbbf24); }
-.workspace-context-diff { display: flex; gap: 5px; font: 0.68rem var(--font-mono, monospace); }
-.workspace-context-diff b { color: var(--status-success, #34d399); font-weight: 600; }
-.workspace-context-diff i { color: var(--status-error, #ef4444); font-style: normal; }
-
-.workspace-context-sources {
-  padding: 10px 14px 12px;
-  border-top: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
-}
-
-.workspace-context-sources-heading { margin-bottom: 6px; color: var(--text-muted, #94a3b8); font-size: 0.68rem; font-weight: 600; }
-.workspace-context-sources p { overflow: hidden; margin: 4px 0 0; color: var(--text-secondary, #cbd5e1); font-size: 0.7rem; text-overflow: ellipsis; white-space: nowrap; }
-.workspace-context-sources .workspace-context-more { color: var(--interactive-fg, var(--accent)); }
-
-/* Workspace context popover */
-.workspace-context-trigger {
-  width: 32px;
-  height: 30px;
-  margin-right: 5px;
-  border: 1px solid transparent;
-  border-radius: 8px;
-  transition: color 0.16s ease, background 0.16s ease, border-color 0.16s ease;
-}
-
-.workspace-context-trigger:hover,
-.workspace-context-trigger.is-open {
-  border-color: var(--border, rgba(255, 255, 255, 0.1));
-  background: var(--bg-surface-hover, rgba(255, 255, 255, 0.07));
-}
-
-.workspace-context-trigger:focus-visible,
-.workspace-context-heading button:focus-visible,
-.workspace-context-row:focus-visible {
-  outline: 2px solid var(--accent, #10b981);
-  outline-offset: 2px;
-}
-
-.workspace-context-popover {
-  width: min(380px, calc(100vw - 24px));
-  padding: 8px;
-  border-color: var(--border-default, rgba(255, 255, 255, 0.12));
-  border-radius: 16px;
-  background: var(--bg-overlay, #111113);
-  box-shadow: 0 18px 52px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.24);
-}
-
-.workspace-context-heading {
-  min-height: 42px;
-  padding: 0 4px 7px 8px;
-  border-bottom: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
-  color: var(--text-main, #f1f2f4);
-  font-size: 0.78rem;
-}
-
-.workspace-context-heading-title {
-  display: inline-flex;
-  align-items: center;
-  gap: 9px;
-}
-
-.workspace-context-heading-title svg {
-  color: var(--accent, #10b981);
-}
-
-.workspace-context-heading button {
-  width: 30px;
-  height: 30px;
-  border: 1px solid transparent;
-  border-radius: 8px;
-  transition: color 0.16s ease, background 0.16s ease, border-color 0.16s ease;
-}
-
-.workspace-context-heading button:hover:not(:disabled) {
-  border-color: var(--border, rgba(255, 255, 255, 0.1));
-}
-
-.workspace-context-heading button .is-refreshing {
-  animation: workspaceContextSpin 0.9s linear infinite;
-}
-
-@keyframes workspaceContextSpin {
-  to { transform: rotate(360deg); }
-}
-
-.workspace-context-row {
-  grid-template-columns: 34px minmax(0, 1fr) auto;
-  gap: 10px;
-  min-height: 58px;
-  margin-top: 4px;
-  padding: 8px 10px;
-  border: 1px solid transparent;
-  border-radius: 11px;
-  transition: background 0.16s ease, border-color 0.16s ease;
-}
-
-.workspace-context-row.is-static {
-  color: var(--text-main, #f1f2f4);
-}
-
-button.workspace-context-row:hover:not(:disabled) {
-  border-color: var(--border, rgba(255, 255, 255, 0.08));
-  background: var(--bg-surface-hover, rgba(255, 255, 255, 0.045));
-}
-
-button.workspace-context-row:disabled {
-  opacity: 0.7;
-}
-
-.workspace-context-icon {
-  display: grid;
-  width: 32px;
-  height: 32px;
-  place-items: center;
-  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
-  border-radius: 9px;
-  background: var(--bg-surface-soft, rgba(255, 255, 255, 0.035));
-  color: var(--interactive-fg, var(--accent));
-}
-
-.workspace-context-copy strong { font-size: 0.78rem; }
-.workspace-context-copy small { margin-top: 3px; font-size: 0.69rem; }
-
-.workspace-context-action,
-.workspace-context-status {
-  display: inline-flex;
-  align-items: center;
-  min-height: 22px;
-  padding: 2px 8px;
-  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
-  border-radius: 999px;
-  background: var(--bg-surface-soft, rgba(255, 255, 255, 0.035));
-  color: var(--text-secondary, #cbd5e1);
-  font-size: 0.65rem;
-  white-space: nowrap;
-}
-
-.workspace-context-action {
-  color: var(--interactive-fg, var(--accent));
-}
-
-.workspace-context-status.is-dirty {
-  border-color: color-mix(in srgb, var(--status-warning, #fbbf24) 25%, transparent);
-  background: color-mix(in srgb, var(--status-warning, #fbbf24) 9%, transparent);
-  color: var(--status-warning, #fbbf24);
-}
-
-.workspace-context-diff {
-  display: inline-flex;
-  gap: 6px;
-  padding: 3px 7px;
-  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
-  border-radius: 999px;
-  background: var(--bg-surface-soft, rgba(255, 255, 255, 0.035));
-  font: 0.66rem var(--font-mono, monospace);
-}
-
-.workspace-context-sources {
-  margin-top: 6px;
-  padding: 10px;
-  border: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.08));
-  border-radius: 11px;
-  background: var(--bg-surface-soft, rgba(255, 255, 255, 0.025));
-}
-
-.workspace-context-sources-heading {
-  margin-bottom: 8px;
-  color: var(--text-muted, #94a3b8);
-  font-size: 0.68rem;
-}
-
-.workspace-context-sources-heading > span:first-child {
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-}
-
-.workspace-context-sources-heading > span:last-child {
-  display: inline-grid;
-  min-width: 20px;
-  height: 20px;
-  place-items: center;
-  border-radius: 999px;
-  background: var(--bg-surface-hover, rgba(255, 255, 255, 0.06));
-}
-
-.workspace-context-sources p {
-  display: flex;
-  align-items: center;
-  gap: 7px;
-  margin: 5px 0 0;
-  color: var(--text-secondary, #cbd5e1);
-  font-size: 0.7rem;
-}
-
-.workspace-context-sources p svg {
-  flex: 0 0 auto;
-  color: var(--text-muted, #94a3b8);
-}
-
-.workspace-context-sources p:first-of-type:last-child {
-  color: var(--text-muted, #94a3b8);
-  line-height: 1.4;
-}
-
-@media (max-width: 420px) {
-  .workspace-context-popover {
-    right: -6px;
-    width: min(380px, calc(100vw - 16px));
-  }
-}
-
 .mint-titlebar-left {
   gap: 3px;
   min-width: 0;
@@ -831,8 +500,8 @@ button.workspace-context-row:disabled {
   width: 7px;
   height: 7px;
   border-radius: 50%;
-  background: #57c78b;
-  box-shadow: 0 0 8px rgba(87, 199, 139, 0.42);
+  background: var(--status-success-fg, #57c78b);
+  box-shadow: 0 0 8px var(--status-success-border, rgba(87, 199, 139, 0.42));
 }
 
 .terminal-dock-cwd {
@@ -856,7 +525,7 @@ button.workspace-context-row:disabled {
 
 .terminal-dock-header > button:hover {
   color: var(--text-main, #e5e7eb);
-  background: rgba(255, 255, 255, 0.08);
+  background: var(--bg-surface-hover);
 }
 
 .terminal-dock-header-actions {
@@ -881,7 +550,7 @@ button.workspace-context-row:disabled {
 
 .terminal-dock-header-actions > button:hover {
   color: var(--text-main, #e5e7eb);
-  background: rgba(255, 255, 255, 0.08);
+  background: var(--bg-surface-hover);
 }
 
 .terminal-dock-surface {
@@ -891,7 +560,7 @@ button.workspace-context-row:disabled {
   padding: 10px 12px;
   border: 1px solid var(--border-default, rgba(255, 255, 255, 0.12));
   border-radius: 0 0 10px 10px;
-  background: #111318;
+  background: var(--bg-terminal, #111318);
 }
 
 .terminal-dock-surface .xterm {