SemianiakaVY/openpencil
1
0
Fork 0
Code Issues Pull requests Actions 1 Packages Projects Releases Wiki Activity

fix(git): match TS panel chrome — width 420, drop shadow, 6px radius

Browse source 
The panel read flat / cramped vs TS because of container-level gaps, not the
widgets: width 320→420 (TS w-[420px]), add a shadow-md drop shadow (two soft
black rects) so it lifts off the canvas, and corner radius 10→6 (TS
rounded-md). Placement tests still pass (caret anchoring relative to width).
This commit is contained in:
Kayshen-X 2026-05-31 23:51:18 +08:00
parent 38156111dd
commit 6ea10cccf9
1 changed files with 30 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
crates/op-editor-ui/src/widgets/git_panel.rs
View file

@ -17,8 +17,8 @@ use crate::widgets::PaintCx;
use crate::{Color, Point2D, Rect};
use op_editor_core::{EditorState, GitPanelState};
/// Panel width in logical px.
pub const GIT_PANEL_WIDTH: f32 = 320.0;
/// Panel width in logical px (TS ready/history popover is `w-[420px]`).
pub const GIT_PANEL_WIDTH: f32 = 420.0;
/// Panel width while a diff is open — wide enough for ~95-column diffs.
pub const GIT_DIFF_PANEL_WIDTH: f32 = 620.0;
/// Inset from the canvas corner the panel floats at.
@ -415,9 +415,35 @@ impl<'a> GitPanel<'a> {
/// Paint the panel into `rect`.
pub fn paint(&self, cx: &mut PaintCx<'_>, rect: Rect) {
cx.backend.fill_round_rect(rect, 10.0, self.theme.popover);
// Drop shadow (TS PopoverContent `shadow-md`) — two soft black rects
// offset down so the floating panel lifts off the canvas instead of
// reading flat / stuck-on against it.
cx.backend.fill_round_rect(
Rect {
origin: Point2D::new(rect.origin.x, rect.origin.y + 10.0),
size: rect.size,
},
6.0,
Color {
a: 0.10,
..Color::BLACK
},
);
cx.backend.fill_round_rect(
Rect {
origin: Point2D::new(rect.origin.x, rect.origin.y + 4.0),
size: rect.size,
},
6.0,
Color {
a: 0.14,
..Color::BLACK
},
);
// TS popover radius is `rounded-md` = 6px (Rust was 10px, too round).
cx.backend.fill_round_rect(rect, 6.0, self.theme.popover);
cx.backend
.stroke_round_rect(rect, 10.0, self.theme.border, 1.0);
.stroke_round_rect(rect, 6.0, self.theme.border, 1.0);
// The inline clone wizard replaces the whole body.
if self.state.clone_form.is_some() {