mirror of
https://github.com/zed-industries/zed.git
synced 2026-06-01 03:14:56 +07:00
73126dcb81
Adds basic bookmark functionality to the editor, allowing users to mark
lines and later navigate between them. This is an MVP and will later be
expanded with a picker, vim marks integration and syntax tree based
bookmark positions. In this MVP bookmarks shift under external edits.
# UI
## Adding/Removing bookmarks
To add a bookmark:
- run the toggle bookmark action
- hold secondary and click in the gutter
- open the context menu by right clicking in the gutter and select add
bookmark To remove a bookmark:
- run the toggle bookmark action
- click on the bookmarks icon in the gutter
- open the context menu by right clicking in the gutter and select
remove bookmark
remove all bookmarks with `workspace: clear bookmarks`
# Implementation
This mirrors the implementation of breakpoints. The rendering of the
gutter was refactored to make place for bookmark icons and buttons:
- Code was extracted to a `Gutter` struct
- Runnables, breakpoints and bookmarks are now collected ahead of
layouting. Just before layouting we remove the items that collide and do
not have priority.
- The `phantom_breakpoint` is replaced by a `gutter_hover_button`
## In depth phantom breakpoint discussion:
This was phantom_breakpoint. It worked as follows:
- A fake breakpoint was added to the list of breakpoints.
- While rendering the breakpoints it a breakpoint turned out to be fake
it would get a different description and look.
- The breakpoint list was edited run_indicators ("play buttons")
rendering to removes the fake breakpoint if it collided.
This would not scale to more functionality. Now we only render
breakpoints, bookmarks and run indicators. Then we render a button if
there is not breakpoint, bookmark or run indicator already present. We
can do so since the rendering of such "gutter indicators" has been
refactored into two phases:
- collect the items.
- render them if no higher priority item collides.
This is far easier and more readable which enabled me to easily take the
phantom_breakpoint system and use it for placing bookmarks as well :)
Note: this was previously merged but it needed a better squashed commit
message. For the actual PR see: 51404. This reverts commit
|
||
|---|---|---|
| .. | ||
| src | ||
| Cargo.toml | ||
| LICENSE-GPL | ||
| README.md | ||
Zed Icons
Guidelines
Icons are a big part of Zed, and they're how we convey hundreds of actions without relying on labeled buttons. When introducing a new icon, it's important to ensure consistency with the existing set, which follows these guidelines:
- The SVG view box should be 16x16.
- For outlined icons, use a 1.2px stroke width.
- Not all icons are mathematically aligned; there's quite a bit of optical adjustment. However, try to keep the icon within an internal 12x12 bounding box as much as possible while ensuring proper visibility.
- Use the
filledandoutlinedterminology when introducing icons that will have these two variants. - Icons that are deeply contextual may have the feature context as their name prefix. For example,
ToolWeb,ReplPlay,DebugStepInto, etc. - Avoid complex layer structures in the icon SVG, like clipping masks and similar elements. When the shape becomes too complex, we recommend running the SVG through SVGOMG to clean it up.
Sourcing
Most icons are created by sourcing them from Lucide. Then, they're modified, adjusted, cleaned up, and simplified depending on their use and overall fit with Zed.
Sometimes, we may use other sources like Phosphor, but we also design many icons completely from scratch.
Contributing
To introduce a new icon, add the .svg file to the assets/icon directory and then add its corresponding item to the icons.rs file within the crates directory.
- SVG files in the assets folder follow a snake_case name format.
- Icons in the
icons.rsfile follow the PascalCase name format.
Make sure to tag a member of Zed's design team so we can review and adjust any newly introduced icon.