diff --git a/src/features/project-tree/ProjectView.module.css b/src/features/project-tree/ProjectView.module.css index 6166ed30..fb4a141a 100644 --- a/src/features/project-tree/ProjectView.module.css +++ b/src/features/project-tree/ProjectView.module.css @@ -42,6 +42,9 @@ .excluded { color: var(--vcs-ignored); } +.excludedRow { + background: color-mix(in srgb, var(--vcs-ignored) 14%, transparent); +} .error { text-decoration: underline wavy var(--danger); text-decoration-skip-ink: none; diff --git a/src/features/project-tree/ProjectView.tsx b/src/features/project-tree/ProjectView.tsx index 87b8b8bb..329ac6c1 100644 --- a/src/features/project-tree/ProjectView.tsx +++ b/src/features/project-tree/ProjectView.tsx @@ -654,6 +654,7 @@ export function ProjectView() { isExpandable={isExpandable} loadChildren={loadChildren} renderNode={renderNode} + rowClassName={(n) => (n.excluded ? styles.excludedRow : undefined)} expanded={expanded} onExpandedChange={onExpandedChange} selected={selected} diff --git a/src/features/vcs/GitLog.module.css b/src/features/vcs/GitLog.module.css index 088c07f3..43cc9795 100644 --- a/src/features/vcs/GitLog.module.css +++ b/src/features/vcs/GitLog.module.css @@ -144,7 +144,7 @@ top: 0; left: 0; width: 100%; - height: 22px; + height: 26px; display: flex; align-items: center; gap: 8px; @@ -153,9 +153,10 @@ cursor: default; font-size: var(--fs-ui); } -/* View Options › Highlight › Current Branch (before .row:hover / .selected so they win). */ -.currentBranch { - background: color-mix(in srgb, var(--accent) 7%, transparent); +/* View Options › Highlight › Current Branch: commits outside HEAD are dimmed. */ +.offBranch .subject, +.offBranch .muted { + color: var(--fg-subtle); } .row:hover { background: var(--bg-tree-hover); @@ -232,6 +233,7 @@ margin-left: 0; } .ref { + --tag-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M1.5 1.5h4.2l4.8 4.8-4.2 4.2-4.8-4.8z' fill='none' stroke='black' stroke-width='1.1' stroke-linejoin='round'/%3E%3Ccircle cx='4' cy='4' r='.9'/%3E%3C/svg%3E"); display: inline-flex; align-items: center; gap: 4px; @@ -242,14 +244,15 @@ text-overflow: ellipsis; max-width: 180px; } -/* IDEA's branch label: a small flag in the ref's colour. */ +/* Outlined tag glyph in the ref's colour. */ .ref::before { content: ""; flex: none; - width: 7px; - height: 10px; + width: 11px; + height: 11px; background: var(--ref-color); - clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 72%, 0 100%); + -webkit-mask: var(--tag-glyph) center / contain no-repeat; + mask: var(--tag-glyph) center / contain no-repeat; } .refHead { --ref-color: var(--warning); diff --git a/src/features/vcs/GitLog.tsx b/src/features/vcs/GitLog.tsx index 3844cef7..79fb170d 100644 --- a/src/features/vcs/GitLog.tsx +++ b/src/features/vcs/GitLog.tsx @@ -92,8 +92,8 @@ import { gitTabs, shownTab } from "./gitTabs"; import { ChangesTree, StashContent, tabItems, useStashTabCounts } from "./CommitView"; import { WorktreesPanel } from "./gitMenuDialogs"; -const ROW = 22; -const LANE = 12; +const ROW = 26; +const LANE = 14; /** The Git window's tabs (they depend on the commit interface) and the one shown. */ function useGitTabs() { @@ -1021,7 +1021,7 @@ function CommitList() { selected={selectedSet.has(commitKey(c))} head={headKeys.has(commitKey(c))} mine={opts.highlightMine && isMine(c, user)} - onBranch={!!onBranch?.has(commitKey(c))} + onBranch={!onBranch || onBranch.has(commitKey(c))} opts={opts} remoteNames={new Set((c as RepoCommit).remoteNames ?? remoteNames)} onPick={pick} @@ -1075,7 +1075,7 @@ const CommitRow = memo(function CommitRow({ id={id} role="option" aria-selected={selected} - className={clsx(styles.row, onBranch && styles.currentBranch, selected && styles.selected)} + className={clsx(styles.row, !onBranch && styles.offBranch, selected && styles.selected)} style={{ top }} onMouseDown={(e) => { if (e.shiftKey) e.preventDefault(); // no text selection on range clicks @@ -1149,7 +1149,7 @@ export function GraphCell({ row, head }: { row: GraphRow; head?: boolean }) { { rowHeight?: number; indent?: number; className?: string; + rowClassName?: (node: T) => string | undefined; "aria-label"?: string; handleRef?: Ref; empty?: ReactNode; @@ -145,6 +146,7 @@ export function Tree(props: TreeProps) { rowHeight = 24, indent = 20, className, + rowClassName, handleRef, empty, } = props; @@ -537,7 +539,12 @@ export function Tree(props: TreeProps) { aria-setsize={positions[v.index]![1]} aria-expanded={row.expandable ? row.expanded : undefined} aria-selected={isSelected} - className={clsx(styles.row, isSelected && styles.selected, isLead && styles.lead)} + className={clsx( + styles.row, + rowClassName?.(row.node), + isSelected && styles.selected, + isLead && styles.lead, + )} style={style} onMouseDown={(e) => onRowMouseDown(e, v.index)} onDoubleClick={(e) => activate(row, e)} diff --git a/src/ui/openidea/vcs/favorite.svg b/src/ui/openidea/vcs/favorite.svg index 03221cf0..84f0a683 100644 --- a/src/ui/openidea/vcs/favorite.svg +++ b/src/ui/openidea/vcs/favorite.svg @@ -1,3 +1,3 @@ - + diff --git a/src/ui/openidea/vcs/favorite_dark.svg b/src/ui/openidea/vcs/favorite_dark.svg index 2ff1e632..f1a3c9d4 100644 --- a/src/ui/openidea/vcs/favorite_dark.svg +++ b/src/ui/openidea/vcs/favorite_dark.svg @@ -1,3 +1,3 @@ - + diff --git a/src/ui/openidea/vcs/notFavorite.svg b/src/ui/openidea/vcs/notFavorite.svg index 2d082407..da2395a6 100644 --- a/src/ui/openidea/vcs/notFavorite.svg +++ b/src/ui/openidea/vcs/notFavorite.svg @@ -1,3 +1,3 @@ - + diff --git a/src/ui/openidea/vcs/notFavorite_dark.svg b/src/ui/openidea/vcs/notFavorite_dark.svg index 198a9ba6..8eaca0f4 100644 --- a/src/ui/openidea/vcs/notFavorite_dark.svg +++ b/src/ui/openidea/vcs/notFavorite_dark.svg @@ -1,3 +1,3 @@ - +