context menu: Adjust toggleable entry label alignment (#24549)

Danilo Leal created 1 year ago

Previously, we were passing an `IconSize` that had a default size. Given
the check icon is small by default, when the entry is not toggled, that
caused a slight misalignment between the toggled and not-toggled items.
I'm passing now the same icon element but inside an opacity 0 div. Open
to other suggestions if this feels clunky.

| Before | After |
|--------|--------|
| <img width="946" alt="Screenshot 2025-02-10 at 7 58 28 AM"
src="https://github.com/user-attachments/assets/4d2b3f12-72c5-4c8d-acaf-c16230250560"
/> | <img width="943" alt="Screenshot 2025-02-10 at 7 58 37 AM"
src="https://github.com/user-attachments/assets/2df64752-7273-4bdc-9f6b-5153ed52c889"
/> |

Release Notes:

- N/A

Change summary

crates/ui/src/components/context_menu.rs | 9 +++++----
1 file changed, 5 insertions(+), 4 deletions(-)

Detailed changes

crates/ui/src/components/context_menu.rs

@@ -672,15 +672,16 @@ impl Render for ContextMenu {
                                                             *toggle,
                                                             |list_item, (position, toggled)| {
                                                                 let contents = if toggled {
-                                                                    v_flex().flex_none().child(
+                                                                    div().flex_none().child(
                                                                         Icon::new(IconName::Check)
                                                                             .color(Color::Accent)
                                                                             .size(*icon_size)
                                                                     )
                                                                 } else {
-                                                                    v_flex().flex_none().size(
-                                                                        IconSize::default().rems(),
-                                                                    )
+                                                                    div().flex_none().child(
+                                                                        Icon::new(IconName::Check)
+                                                                            .size(*icon_size)
+                                                                    ).opacity(0.)
                                                                 };
                                                                 match position {
                                                                     IconPosition::Start => {