fix(ui): keep wrapped colour picker swatches inside the picker (#180) (#237)

add_space(16) only indented the first row of a horizontal_wrapped, so with
many colours on a page the later rows started at the picker's edge and ran
past its right side. The swatch rows now sit in a frame inset 16 points on
both sides.

Co-authored-by: Justin John <babyjjbabyjj549@gmail.com>
Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Justin John 2026-10-14 09:01:46 +05:30 committed by GitHub
parent 8e12e5eeda
commit ce84d1f27f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 8 additions and 4 deletions

View File

@ -782,8 +782,8 @@ pub fn show(app: &mut FigApp, ctx: &egui::Context) {
ui.add_space(16.0);
widgets::label(ui, tr("On this page"), t.text_secondary);
});
ui.horizontal_wrapped(|ui| {
ui.add_space(16.0);
// Inset on both sides: `add_space` would only indent the first row of a wrap.
inset(ui, |ui| {
for c in &doc_colors {
if widgets::swatch(ui, &Paint::solid(*c), 14.0).on_hover_text(c.to_hex()).clicked() {
set_color(app, &target, &mut paint, *c, sel_stop_id, ui);
@ -798,8 +798,7 @@ pub fn show(app: &mut FigApp, ctx: &egui::Context) {
ui.add_space(16.0);
widgets::label(ui, tr("Recent"), t.text_secondary);
});
ui.horizontal_wrapped(|ui| {
ui.add_space(16.0);
inset(ui, |ui| {
for c in recent.iter().take(14) {
if widgets::swatch(ui, &Paint::solid(*c), 14.0).clicked() {
set_color(app, &target, &mut paint, *c, sel_stop_id, ui);
@ -816,6 +815,11 @@ pub fn show(app: &mut FigApp, ctx: &egui::Context) {
let _ = Pos2::ZERO;
}
/// Swatches wrapped in rows inset 16 points from both sides of the picker.
fn inset(ui: &mut Ui, add: impl FnOnce(&mut Ui)) {
egui::Frame::NONE.inner_margin(egui::Margin::symmetric(16, 0)).show(ui, |ui| ui.horizontal_wrapped(add));
}
/// The colour picker's note under the fields for a colour outside sRGB.
fn gamut_warning(ui: &mut Ui, t: &Tokens) {
use crate::a11y::Tip;