ui: Center Checkbox within its container (#9201)

This PR fixes an issue with the `Checkbox` component where the checkbox
wasn't being centered within its container element.

The problem can be seen when applying a background color to the
container element:

#### Before

<img width="439" alt="Screenshot 2024-03-11 at 5 44 10 PM"
src="https://github.com/zed-industries/zed/assets/1486634/11704b1a-3c3e-4250-99c3-973fb442287a">

#### After

<img width="447" alt="Screenshot 2024-03-11 at 5 45 59 PM"
src="https://github.com/zed-industries/zed/assets/1486634/569a850b-4bd7-4711-8327-bf426fa5d265">

This resulted in issues where, under certain conditions, the checkbox
could get cut off, as seen in #8868.

Centering the checkbox fixes this issue:

<img width="305" alt="Screenshot 2024-03-11 at 5 51 00 PM"
src="https://github.com/zed-industries/zed/assets/1486634/14e5642f-59ad-4288-bc25-ea7da2a008a7">

Fixes #8868.

Release Notes:

- Fixed a positioning issue with checkboxes
([#8868](https://github.com/zed-industries/zed/issues/8868)).

crates/ui/src/components/checkbox/checkbox.rs

@@ -100,6 +100,8 @@ impl RenderOnce for Checkbox {
 
         h_flex()
             .id(self.id)
+            .justify_center()
+            .items_center()
             // Rather than adding `px_1()` to add some space around the checkbox,
             // we use a larger parent element to create a slightly larger
             // click area for the checkbox.