Use the `editor_background` color for the welcome screen's background (#3910)

Marshall Bowers created

This PR updates the welcome screen to use the same background color as
the editor.

<img width="1136" alt="Screenshot 2024-01-05 at 11 28 19 AM"
src="https://github.com/zed-industries/zed/assets/1486634/30f2bd7b-e25f-4851-9f43-eb187d1d62e6">

Release Notes:

- Updated the background color of the welcome screen to match the editor
background.

Change summary

crates/welcome/src/welcome.rs | 292 ++++++++++++++++++------------------
1 file changed, 149 insertions(+), 143 deletions(-)

Detailed changes

crates/welcome/src/welcome.rs 🔗

@@ -59,153 +59,159 @@ pub struct WelcomePage {
 
 impl Render for WelcomePage {
     fn render(&mut self, cx: &mut gpui::ViewContext<Self>) -> impl IntoElement {
-        h_stack().full().track_focus(&self.focus_handle).child(
-            v_stack()
-                .w_96()
-                .gap_4()
-                .mx_auto()
-                .child(
-                    svg()
-                        .path("icons/logo_96.svg")
-                        .text_color(gpui::white())
-                        .w(px(96.))
-                        .h(px(96.))
-                        .mx_auto(),
-                )
-                .child(
-                    h_stack()
-                        .justify_center()
-                        .child(Label::new("Code at the speed of thought")),
-                )
-                .child(
-                    v_stack()
-                        .gap_2()
-                        .child(
-                            Button::new("choose-theme", "Choose a theme")
-                                .full_width()
-                                .on_click(cx.listener(|this, _, cx| {
-                                    this.workspace
-                                        .update(cx, |workspace, cx| {
-                                            theme_selector::toggle(
-                                                workspace,
-                                                &Default::default(),
-                                                cx,
-                                            )
-                                        })
-                                        .ok();
-                                })),
-                        )
-                        .child(
-                            Button::new("choose-keymap", "Choose a keymap")
-                                .full_width()
-                                .on_click(cx.listener(|this, _, cx| {
-                                    this.workspace
-                                        .update(cx, |workspace, cx| {
-                                            base_keymap_picker::toggle(
-                                                workspace,
-                                                &Default::default(),
-                                                cx,
-                                            )
-                                        })
-                                        .ok();
-                                })),
-                        )
-                        .child(
-                            Button::new("install-cli", "Install the CLI")
-                                .full_width()
-                                .on_click(cx.listener(|_, _, cx| {
-                                    cx.app_mut()
-                                        .spawn(
-                                            |cx| async move { install_cli::install_cli(&cx).await },
+        h_stack()
+            .full()
+            .bg(cx.theme().colors().editor_background)
+            .track_focus(&self.focus_handle)
+            .child(
+                v_stack()
+                    .w_96()
+                    .gap_4()
+                    .mx_auto()
+                    .child(
+                        svg()
+                            .path("icons/logo_96.svg")
+                            .text_color(gpui::white())
+                            .w(px(96.))
+                            .h(px(96.))
+                            .mx_auto(),
+                    )
+                    .child(
+                        h_stack()
+                            .justify_center()
+                            .child(Label::new("Code at the speed of thought")),
+                    )
+                    .child(
+                        v_stack()
+                            .gap_2()
+                            .child(
+                                Button::new("choose-theme", "Choose a theme")
+                                    .full_width()
+                                    .on_click(cx.listener(|this, _, cx| {
+                                        this.workspace
+                                            .update(cx, |workspace, cx| {
+                                                theme_selector::toggle(
+                                                    workspace,
+                                                    &Default::default(),
+                                                    cx,
+                                                )
+                                            })
+                                            .ok();
+                                    })),
+                            )
+                            .child(
+                                Button::new("choose-keymap", "Choose a keymap")
+                                    .full_width()
+                                    .on_click(cx.listener(|this, _, cx| {
+                                        this.workspace
+                                            .update(cx, |workspace, cx| {
+                                                base_keymap_picker::toggle(
+                                                    workspace,
+                                                    &Default::default(),
+                                                    cx,
+                                                )
+                                            })
+                                            .ok();
+                                    })),
+                            )
+                            .child(
+                                Button::new("install-cli", "Install the CLI")
+                                    .full_width()
+                                    .on_click(cx.listener(|_, _, cx| {
+                                        cx.app_mut()
+                                            .spawn(|cx| async move {
+                                                install_cli::install_cli(&cx).await
+                                            })
+                                            .detach_and_log_err(cx);
+                                    })),
+                            ),
+                    )
+                    .child(
+                        v_stack()
+                            .p_3()
+                            .gap_2()
+                            .bg(cx.theme().colors().elevated_surface_background)
+                            .border_1()
+                            .border_color(cx.theme().colors().border)
+                            .rounded_md()
+                            .child(
+                                h_stack()
+                                    .gap_2()
+                                    .child(
+                                        Checkbox::new(
+                                            "enable-vim",
+                                            if VimModeSetting::get_global(cx).0 {
+                                                ui::Selection::Selected
+                                            } else {
+                                                ui::Selection::Unselected
+                                            },
                                         )
-                                        .detach_and_log_err(cx);
-                                })),
-                        ),
-                )
-                .child(
-                    v_stack()
-                        .p_3()
-                        .gap_2()
-                        .bg(cx.theme().colors().elevated_surface_background)
-                        .border_1()
-                        .border_color(cx.theme().colors().border)
-                        .rounded_md()
-                        .child(
-                            h_stack()
-                                .gap_2()
-                                .child(
-                                    Checkbox::new(
-                                        "enable-vim",
-                                        if VimModeSetting::get_global(cx).0 {
-                                            ui::Selection::Selected
-                                        } else {
-                                            ui::Selection::Unselected
-                                        },
+                                        .on_click(
+                                            cx.listener(move |this, selection, cx| {
+                                                this.update_settings::<VimModeSetting>(
+                                                    selection,
+                                                    cx,
+                                                    |setting, value| *setting = Some(value),
+                                                );
+                                            }),
+                                        ),
                                     )
-                                    .on_click(cx.listener(
-                                        move |this, selection, cx| {
-                                            this.update_settings::<VimModeSetting>(
-                                                selection,
-                                                cx,
-                                                |setting, value| *setting = Some(value),
-                                            );
-                                        },
-                                    )),
-                                )
-                                .child(Label::new("Enable vim mode")),
-                        )
-                        .child(
-                            h_stack()
-                                .gap_2()
-                                .child(
-                                    Checkbox::new(
-                                        "enable-telemetry",
-                                        if TelemetrySettings::get_global(cx).metrics {
-                                            ui::Selection::Selected
-                                        } else {
-                                            ui::Selection::Unselected
-                                        },
+                                    .child(Label::new("Enable vim mode")),
+                            )
+                            .child(
+                                h_stack()
+                                    .gap_2()
+                                    .child(
+                                        Checkbox::new(
+                                            "enable-telemetry",
+                                            if TelemetrySettings::get_global(cx).metrics {
+                                                ui::Selection::Selected
+                                            } else {
+                                                ui::Selection::Unselected
+                                            },
+                                        )
+                                        .on_click(
+                                            cx.listener(move |this, selection, cx| {
+                                                this.update_settings::<TelemetrySettings>(
+                                                    selection,
+                                                    cx,
+                                                    |settings, value| {
+                                                        settings.metrics = Some(value)
+                                                    },
+                                                );
+                                            }),
+                                        ),
                                     )
-                                    .on_click(cx.listener(
-                                        move |this, selection, cx| {
-                                            this.update_settings::<TelemetrySettings>(
-                                                selection,
-                                                cx,
-                                                |settings, value| settings.metrics = Some(value),
-                                            );
-                                        },
-                                    )),
-                                )
-                                .child(Label::new("Send anonymous usage data")),
-                        )
-                        .child(
-                            h_stack()
-                                .gap_2()
-                                .child(
-                                    Checkbox::new(
-                                        "enable-crash",
-                                        if TelemetrySettings::get_global(cx).diagnostics {
-                                            ui::Selection::Selected
-                                        } else {
-                                            ui::Selection::Unselected
-                                        },
+                                    .child(Label::new("Send anonymous usage data")),
+                            )
+                            .child(
+                                h_stack()
+                                    .gap_2()
+                                    .child(
+                                        Checkbox::new(
+                                            "enable-crash",
+                                            if TelemetrySettings::get_global(cx).diagnostics {
+                                                ui::Selection::Selected
+                                            } else {
+                                                ui::Selection::Unselected
+                                            },
+                                        )
+                                        .on_click(
+                                            cx.listener(move |this, selection, cx| {
+                                                this.update_settings::<TelemetrySettings>(
+                                                    selection,
+                                                    cx,
+                                                    |settings, value| {
+                                                        settings.diagnostics = Some(value)
+                                                    },
+                                                );
+                                            }),
+                                        ),
                                     )
-                                    .on_click(cx.listener(
-                                        move |this, selection, cx| {
-                                            this.update_settings::<TelemetrySettings>(
-                                                selection,
-                                                cx,
-                                                |settings, value| {
-                                                    settings.diagnostics = Some(value)
-                                                },
-                                            );
-                                        },
-                                    )),
-                                )
-                                .child(Label::new("Send crash reports")),
-                        ),
-                ),
-        )
+                                    .child(Label::new("Send crash reports")),
+                            ),
+                    ),
+            )
     }
 }