codexmate 0.1.24 → 0.1.27

package/web-ui/styles/modals-core.css

@@ -456,6 +456,54 @@
     font-weight: var(--font-weight-secondary);
 }
 
+.agents-diff-token-summary {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    margin-bottom: 8px;
+    font-size: var(--font-size-caption);
+    color: var(--color-text-tertiary);
+}
+
+.agents-diff-token-label {
+    display: inline-flex;
+    align-items: center;
+}
+
+.agents-diff-token-delta {
+    display: inline-flex;
+    align-items: center;
+    padding: 2px 8px;
+    border-radius: 999px;
+    border: 1px solid transparent;
+    font-weight: var(--font-weight-secondary);
+    font-variant-numeric: tabular-nums;
+}
+
+.agents-diff-token-delta--add {
+    color: #2b6a3b;
+    background: rgba(57, 181, 97, 0.12);
+    border-color: rgba(57, 181, 97, 0.2);
+}
+
+.agents-diff-token-delta--del {
+    color: #8a2f36;
+    background: rgba(220, 95, 108, 0.12);
+    border-color: rgba(220, 95, 108, 0.2);
+}
+
+.agents-diff-token-delta--same {
+    color: var(--color-text-tertiary);
+    background: rgba(127, 127, 127, 0.1);
+    border-color: rgba(127, 127, 127, 0.2);
+}
+
+.prompts-token-hint {
+    margin-left: 4px;
+    color: var(--color-text-tertiary);
+    font-variant-numeric: tabular-nums;
+}
+
 .agents-diff-summary {
     display: flex;
     align-items: center;

package/web-ui/styles/prompts-editor.css

@@ -1,10 +1,7 @@
 /*
- * Prompts-panel Markdown editor: syntax-highlight overlay, toolbar,
- * split live preview (desktop) and edit/preview switch (mobile).
- * Overlay alignment contract: the backdrop <pre> must mirror the
- * textarea's font, font-size, line-height, padding and white-space
- * exactly (.form-input padding 13px var(--spacing-sm), .template-editor
- * mono font 13px / 1.45, white-space pre).
+ * Prompts-panel Markdown editor: split live preview (desktop) and
+ * edit/preview switch (mobile). The editor pane itself is a plain
+ * textarea without any syntax-highlight overlay.
  */
 
 .prompts-md-toolbar {
@@ -125,66 +122,6 @@
     width: 100%;
     min-height: 75vh;
     max-height: none;
-    color: transparent;
-    caret-color: var(--color-text-primary);
-    background: transparent;
-    position: relative;
-    z-index: 2;
-}
-
-.prompts-edit-pane .template-editor::selection {
-    color: transparent;
-    background: var(--color-brand-subtle);
-}
-
-.prompts-highlight-backdrop {
-    position: absolute;
-    inset: 0;
-    z-index: 1;
-    margin: 0;
-    padding: 13px var(--spacing-sm);
-    border: none;
-    overflow: hidden;
-    white-space: pre;
-    font-family: var(--font-family-mono);
-    font-size: 13px;
-    line-height: 1.45;
-    color: var(--color-text-primary);
-    pointer-events: none;
-}
-
-/* highlight.js markdown token colors (light theme) */
-.prompts-highlight-backdrop .hljs-section {
-    color: var(--color-brand-dark);
-    font-weight: var(--font-weight-secondary);
-}
-
-.prompts-highlight-backdrop .hljs-strong {
-    color: var(--color-text-primary);
-    font-weight: 700;
-}
-
-.prompts-highlight-backdrop .hljs-emphasis {
-    color: var(--color-text-secondary);
-    font-style: italic;
-}
-
-.prompts-highlight-backdrop .hljs-bullet {
-    color: var(--color-brand);
-}
-
-.prompts-highlight-backdrop .hljs-code {
-    color: #7C5CBF;
-}
-
-.prompts-highlight-backdrop .hljs-quote {
-    color: var(--color-text-tertiary);
-    font-style: italic;
-}
-
-.prompts-highlight-backdrop .hljs-link,
-.prompts-highlight-backdrop .hljs-symbol {
-    color: #3B7EA1;
 }
 
 .prompts-preview-pane {

package/web-ui/styles/sessions-list.css

@@ -375,7 +375,7 @@
     grid-template-columns: minmax(260px, 360px) minmax(0, 1fr);
     gap: var(--spacing-md);
     align-items: start;
-    height: min(72vh, 760px);
+    height: min(760px, calc(100dvh - 340px));
     min-height: 360px;
 }
 

package/web-ui/styles/sessions-preview.css

@@ -632,13 +632,6 @@
 
     .session-source-pills {
         max-width: 100%;
-        overflow-x: auto;
-        flex-wrap: nowrap;
-        scrollbar-width: none;
-    }
-
-    .session-source-pills::-webkit-scrollbar {
-        display: none;
     }
 
     .session-path-select,
@@ -709,3 +702,59 @@
     transform: none;
     box-shadow: none;
 }
+
+
+.session-match-nav-btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 28px;
+    height: 28px;
+    padding: 0;
+    border: 1px solid var(--border-subtle, rgba(0, 0, 0, 0.12));
+    border-radius: var(--radius-sm, 6px);
+    background: transparent;
+    color: var(--text-secondary, inherit);
+    cursor: pointer;
+}
+
+.session-match-nav-btn svg {
+    width: 14px;
+    height: 14px;
+}
+
+.session-match-nav-btn:hover {
+    background: var(--bg-hover, rgba(0, 0, 0, 0.06));
+}
+
+.session-match-nav-btn[disabled] {
+    opacity: 0.5;
+    cursor: not-allowed;
+}
+
+/* Session preview jump buttons (floating bottom-right, persistent top/bottom pair) */
+.session-preview-jump {
+    position: fixed;
+    right: 12px;
+    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
+    z-index: 5;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 8px;
+    pointer-events: none;
+}
+
+.session-preview-jump .session-match-nav-btn {
+    pointer-events: auto;
+    width: 28px;
+    height: 28px;
+    border-radius: 50%;
+    background: var(--color-surface-elevated, rgba(255, 255, 255, 0.92));
+    box-shadow: var(--shadow-float, 0 4px 16px rgba(0, 0, 0, 0.16));
+}
+
+.session-preview-jump .session-match-nav-btn svg {
+    width: 14px;
+    height: 14px;
+}

package/web-ui/styles/sessions-toolbar-trash.css

@@ -151,6 +151,7 @@
 
 .session-source-pills {
     display: flex;
+    flex-wrap: wrap;
     gap: 3px;
     padding: 2px;
     border-radius: var(--radius-md);
@@ -611,10 +612,3 @@
     max-width: 100%;
 }
 
-/* ===== Session preview match highlight ===== */
-.session-msg-content mark {
-    background: rgba(200, 121, 99, 0.18);
-    color: var(--color-brand-dark);
-    border-radius: 2px;
-    padding: 0 1px;
-}