web browser (Servo)
git clone https://git.lucas.co/cce-browser.git
feat(chrome): draw the corner control as a circular plate
The folded control was a flat plate-border disc. It is now a plate of
the bar's own material and rolled bevel, plate_shaped with corner
exponent 2: folded it is exactly the seed shape the bar unfolds from,
the bar in miniature; open it sits raised on the bar's corner. Size,
hit circle and hover emphasis are unchanged.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
CLAUDE.md | 15 ++++++++++-----
src/main.rs | 16 +++++++++++-----
2 files changed, 21 insertions(+), 10 deletions(-)
diff --git a/CLAUDE.md b/CLAUDE.md
index 81f26fa..fe1b059 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -373,16 +373,21 @@ stripped), else the file name; internal pages are refused.
### The bar is a circle menu
-The chrome's persistent element is the **DE's corner control** — the
-plate-border-colored dot `cce_ui::widget::plate_dock::draw_corner_dot` draws on
-a designer pane or the terminal window — sitting in the **bar's corner nearest
+The chrome's persistent element is a **corner control** — in the place of the
+DE's dot (`cce_ui::widget::plate_dock::draw_corner_dot`, on a designer pane or
+the terminal window), but drawn as a **circular plate**: the bar's own material
+(`BAR_FILL`) and rolled bevel, `plate_shaped` with corner exponent 2 — sitting
+in the **bar's corner nearest
the window corner it is anchored to** (`dot_center()`: top-right for a top bar,
bottom-right for a bottom one). It is drawn here at **1.5x the DE's size**
(`DOT_R`, 12px radius against `plate_dock::CORNER_R`'s 8, with `DOT_INSET`
keeping the DE's margin to the plate edge): folded, it is the whole chrome, and
the pane-corner size was too small to find. The size lives in this crate, not
in `cce-ui` — the shared constant is every other app's dot too — so the drawing
-and the hit circle are the browser's own (`dot_hit`), same disc, same color. A
+and the hit circle are the browser's own (`dot_hit`), same disc. Being a plate
+rather than a flat plate-border disc (it was one until 2026-10-05) is what makes
+it read as the bar in miniature: folded, it is exactly the seed shape the bar
+unfolds from; open, it is a raised plate on the bar's corner. A
circle menu is the corner of the thing it expands into, so the dot sits where
the bar's corner will be, the bar grows out of the dot's own disc, and open,
the dot is the bar's corner. It is always drawn and always live: clicking it
@@ -390,7 +395,7 @@ unfolds the two-row bar, clicking it again folds the bar back. `chrome_open` nam
progress (animated in `tick` over `CHROME_ANIM_S`, or landed in one frame
when the DE's animations switch, `cce_ui::motion::enabled`, is off), and
`dot_hover` its hover emphasis, which is a repaint. **Do not decorate the dot** — no glyph, no
-lines, no ring; it is the DE's control, not a browser icon.
+lines, no ring; it is a plate, not a browser icon.
`chrome_plate()` is the one shape draw and hit-test both read — the bar, or
the lerp from the dot's disc up to the bar — and
diff --git a/src/main.rs b/src/main.rs
index 845d630..ca8d0a5 100644
--- a/src/main.rs
+++ b/src/main.rs
@@ -4518,13 +4518,19 @@ impl Application for BrowserApp {
});
}
- // The corner control, over the bar: the DE's dot, emphasized while
- // hovered or while the bar it opens is out.
- // `plate_dock::draw_corner_dot`'s disc, at the browser's size.
+ // The corner control, over the bar: a circular plate of the bar's
+ // own material — the seed the bar unfolds from, so folded it reads
+ // as the bar in miniature, and open it is a plate on the bar's
+ // corner. Emphasized while hovered or while the bar is out.
let (cx, cy) = self.dot_center();
let r = if self.dot_hover || self.chrome_open { DOT_R * 1.15 } else { DOT_R };
- let fill = cce_ui::color::plate_border_color().unwrap_or([0.55, 0.58, 0.66, 0.85]);
- pc.circle(cx, cy, r, fill);
+ pc.plate_shaped(
+ Rect { x: cx - r, y: cy - r, width: 2.0 * r, height: 2.0 * r },
+ (r, r, r, r),
+ &cce_ui::scene::Material::from_fill(BAR_FILL),
+ cce_ui::layout::bevel_width().min(3.0),
+ Some(2.0),
+ );
self.paint_bm_menu(&mut pc, &sans);
#[cfg(feature = "wpe")]