Made the theme picker sort from dark to light

Added a layer into 'ConstrainedBox' to clip it
's children

Made the welcome experience responsive to small and large sizes

crates/gpui/src/elements/constrained_box.rs

@@ -153,7 +153,9 @@ impl Element for ConstrainedBox {
         _: &mut Self::LayoutState,
         cx: &mut PaintContext,
     ) -> Self::PaintState {
-        self.child.paint(bounds.origin(), visible_bounds, cx);
+        cx.paint_layer(Some(visible_bounds), |cx| {
+            self.child.paint(bounds.origin(), visible_bounds, cx);
+        })
     }
 
     fn rect_for_text_range(

crates/picker/src/picker.rs

@@ -102,7 +102,10 @@ impl<D: PickerDelegate> View for Picker<D> {
                                         .read(cx)
                                         .render_match(ix, state, ix == selected_ix, cx)
                                 })
-                                .on_down(MouseButton::Left, move |_, cx| {
+                                // Capture mouse events
+                                .on_down(MouseButton::Left, |_, _| {})
+                                .on_up(MouseButton::Left, |_, _| {})
+                                .on_click(MouseButton::Left, move |_, cx| {
                                     cx.dispatch_action(SelectIndex(ix))
                                 })
                                 .with_cursor_style(CursorStyle::PointingHand)

crates/theme_selector/src/theme_selector.rs

@@ -50,7 +50,6 @@ impl ThemeSelector {
         theme_names.sort_unstable_by(|a, b| {
             a.is_light
                 .cmp(&b.is_light)
-                .reverse()
                 .then(a.name.cmp(&b.name))
         });
         let matches = theme_names

crates/welcome/src/welcome.rs

@@ -84,6 +84,7 @@ impl View for WelcomePage {
                 ])
                 .constrained()
                 .with_max_width(width)
+                .contained().with_uniform_padding(10.)
                 .aligned()
                 .boxed(),
         )
@@ -126,7 +127,7 @@ impl WelcomePage {
                 .contained()
                 .with_style(style.container)
                 .constrained()
-                .with_width(width)
+                .with_max_width(width)
                 .boxed()
         })
         .on_click(MouseButton::Left, move |_, cx| {