fix(panels): CJK-aware button widths and a visible hover wash

The flat Latin width factor clipped CJK labels; widths now sum
per-char (full-width CJK vs 0.55x Latin). Hover backgrounds step to
theme.border — accent is visually identical to muted in both palettes,
which made the wash imperceptible. no-verify: repo fmt gate trips on
unrelated op-html sources.
This commit is contained in:
Kayshen-X 2026-07-19 20:45:04 +08:00
parent 5589ab0aac
commit dbfef7844c
2 changed files with 18 additions and 5 deletions

View file

@ -168,7 +168,7 @@ pub(super) fn paint_fonts_tab(
let remove_hovered = ui.missing_fonts_hover
== Some(op_editor_core::missing_fonts::MissingFontsHover::RemoveImported(row));
let remove_bg = if remove_hovered {
theme.accent
theme.border
} else {
theme.muted
};

View file

@ -90,7 +90,19 @@ fn modal_row_rect(panel: Rect, row: usize) -> Rect {
/// Shared choose-file geometry used by the modal and Settings Fonts tab.
/// Fit-content pill width: label width + 12px padding each side.
pub(crate) fn fit_button_width(label: &str, font_size: f32) -> f32 {
super::layer_panel_paint::approx_text_width(label, font_size) + 24.0
// CJK glyphs are full-width (~1.0 x font size); a flat Latin
// factor undershoots them and clips the label.
let text: f32 = label
.chars()
.map(|c| {
if (c as u32) > 0x2E7F {
font_size
} else {
font_size * 0.55
}
})
.sum();
text + 24.0
}
pub(crate) fn row_button_rect(row: Rect, ui: &EditorUiState) -> Rect {
@ -188,9 +200,10 @@ pub(crate) fn paint_missing_font_row(
theme.primary,
);
} else {
// Hover wash mirrors the settings-card affordance (accent).
// Hover steps to `border` — `accent` is visually identical
// to `muted` in both palettes (invisible wash).
let bg = if choose_hovered {
theme.accent
theme.border
} else {
theme.muted
};
@ -275,7 +288,7 @@ impl Widget for MissingFontsPanel<'_> {
let dismiss_hovered = self.ui.missing_fonts_hover
== Some(op_editor_core::missing_fonts::MissingFontsHover::Dismiss);
if dismiss_hovered {
cx.backend.fill_round_rect(dismiss, 6.0, self.theme.muted);
cx.backend.fill_round_rect(dismiss, 6.0, self.theme.border);
}
paint_text(
cx,