Browse Source

Adds color swatches to minimap options

main
Eric Amodio 1 year ago
parent
commit
7457baa606
2 changed files with 35 additions and 0 deletions
  1. +10
    -0
      src/webviews/apps/plus/graph/GraphWrapper.tsx
  2. +25
    -0
      src/webviews/apps/plus/graph/graph.scss

+ 10
- 0
src/webviews/apps/plus/graph/GraphWrapper.tsx View File

@ -1266,6 +1266,10 @@ export function GraphWrapper({
graphConfig?.minimapMarkerTypes?.includes('localBranches') ?? false graphConfig?.minimapMarkerTypes?.includes('localBranches') ?? false
} }
> >
<span
className="minimap-marker-swatch"
data-marker="localBranches"
></span>
Local Branches Local Branches
</VSCodeCheckbox> </VSCodeCheckbox>
</MenuItem> </MenuItem>
@ -1277,6 +1281,10 @@ export function GraphWrapper({
graphConfig?.minimapMarkerTypes?.includes('remoteBranches') ?? true graphConfig?.minimapMarkerTypes?.includes('remoteBranches') ?? true
} }
> >
<span
className="minimap-marker-swatch"
data-marker="remoteBranches"
></span>
Remote Branches Remote Branches
</VSCodeCheckbox> </VSCodeCheckbox>
</MenuItem> </MenuItem>
@ -1288,6 +1296,7 @@ export function GraphWrapper({
graphConfig?.minimapMarkerTypes?.includes('stashes') ?? false graphConfig?.minimapMarkerTypes?.includes('stashes') ?? false
} }
> >
<span className="minimap-marker-swatch" data-marker="stashes"></span>
Stashes Stashes
</VSCodeCheckbox> </VSCodeCheckbox>
</MenuItem> </MenuItem>
@ -1299,6 +1308,7 @@ export function GraphWrapper({
graphConfig?.minimapMarkerTypes?.includes('tags') ?? true graphConfig?.minimapMarkerTypes?.includes('tags') ?? true
} }
> >
<span className="minimap-marker-swatch" data-marker="tags"></span>
Tags Tags
</VSCodeCheckbox> </VSCodeCheckbox>
</MenuItem> </MenuItem>

+ 25
- 0
src/webviews/apps/plus/graph/graph.scss View File

@ -1079,3 +1079,28 @@ button:not([disabled]),
white-space: break-spaces; white-space: break-spaces;
} }
} }
.minimap-marker-swatch {
display: inline-block;
width: 1.6rem;
height: 1.6rem;
border-radius: 3px;
margin-right: 0.75rem;
vertical-align: bottom;
&[data-marker='localBranches'] {
background-color: var(--color-graph-minimap-marker-local-branches);
}
&[data-marker='remoteBranches'] {
background-color: var(--color-graph-minimap-marker-remote-branches);
}
&[data-marker='stashes'] {
background-color: var(--color-graph-minimap-marker-stashes);
}
&[data-marker='tags'] {
background-color: var(--color-graph-minimap-marker-tags);
}
}

Loading…
Cancel
Save