ui crate docs & spring cleaning (#18768)

Similar to https://github.com/zed-industries/zed/pull/18690 &
https://github.com/zed-industries/zed/pull/18695, this PR enables
required docs for `ui` and does some cleanup.

Changes:
- Enables the `deny(missing_docs)` crate-wide.
- Adds `allow(missing_docs)` on many modules until folks pick them up to
document them
- Documents some modules (all in `ui/src/styles`)
- Crate root-level organization: Traits move to `traits`, other misc
organization
- Cleaned out a bunch of unused code.

Note: I'd like to remove `utils/format_distance` but the assistant panel
uses it. To move it over to use the `time_format` crate we may need to
update it to use `time` instead of `chrono`. Needs more investigation.

Release Notes:

- N/A

crates/ui/src/traits/styled_ext.rs

@@ -0,0 +1,129 @@
+use gpui::{hsla, Styled, WindowContext};
+
+use crate::prelude::*;
+use crate::ElevationIndex;
+
+fn elevated<E: Styled>(this: E, cx: &mut WindowContext, index: ElevationIndex) -> E {
+    this.bg(cx.theme().colors().elevated_surface_background)
+        .rounded_lg()
+        .border_1()
+        .border_color(cx.theme().colors().border_variant)
+        .shadow(index.shadow())
+}
+
+fn elevated_borderless<E: Styled>(this: E, cx: &mut WindowContext, index: ElevationIndex) -> E {
+    this.bg(cx.theme().colors().elevated_surface_background)
+        .rounded_lg()
+        .shadow(index.shadow())
+}
+
+/// Extends [`gpui::Styled`] with Zed-specific styling methods.
+pub trait StyledExt: Styled + Sized {
+    /// Horizontally stacks elements.
+    ///
+    /// Sets `flex()`, `flex_row()`, `items_center()`
+    fn h_flex(self) -> Self {
+        self.flex().flex_row().items_center()
+    }
+
+    /// Vertically stacks elements.
+    ///
+    /// Sets `flex()`, `flex_col()`
+    fn v_flex(self) -> Self {
+        self.flex().flex_col()
+    }
+
+    /// The [`Surface`](ElevationIndex::Surface) elevation level, located above the app background, is the standard level for all elements
+    ///
+    /// Sets `bg()`, `rounded_lg()`, `border()`, `border_color()`, `shadow()`
+    ///
+    /// Example Elements: Title Bar, Panel, Tab Bar, Editor
+    fn elevation_1(self, cx: &mut WindowContext) -> Self {
+        elevated(self, cx, ElevationIndex::Surface)
+    }
+
+    /// See [`elevation_1`].
+    ///
+    /// Renders a borderless version [`elevation_1`].
+    fn elevation_1_borderless(self, cx: &mut WindowContext) -> Self {
+        elevated_borderless(self, cx, ElevationIndex::Surface)
+    }
+
+    /// Non-Modal Elevated Surfaces appear above the [`Surface`](ElevationIndex::Surface) layer and is used for things that should appear above most UI elements like an editor or panel, but not elements like popovers, context menus, modals, etc.
+    ///
+    /// Sets `bg()`, `rounded_lg()`, `border()`, `border_color()`, `shadow()`
+    ///
+    /// Examples: Notifications, Palettes, Detached/Floating Windows, Detached/Floating Panels
+    fn elevation_2(self, cx: &mut WindowContext) -> Self {
+        elevated(self, cx, ElevationIndex::ElevatedSurface)
+    }
+
+    /// See [`elevation_2`].
+    ///
+    /// Renders a borderless version [`elevation_2`].
+    fn elevation_2_borderless(self, cx: &mut WindowContext) -> Self {
+        elevated_borderless(self, cx, ElevationIndex::ElevatedSurface)
+    }
+
+    /// Modal Surfaces are used for elements that should appear above all other UI elements and are located above the wash layer. This is the maximum elevation at which UI elements can be rendered in their default state.
+    ///
+    /// Elements rendered at this layer should have an enforced behavior: Any interaction outside of the modal will either dismiss the modal or prompt an action (Save your progress, etc) then dismiss the modal.
+    ///
+    /// If the element does not have this behavior, it should be rendered at the [`Elevated Surface`](ElevationIndex::ElevatedSurface) layer.
+    ///
+    /// Sets `bg()`, `rounded_lg()`, `border()`, `border_color()`, `shadow()`
+    ///
+    /// Examples: Settings Modal, Channel Management, Wizards/Setup UI, Dialogs
+    fn elevation_3(self, cx: &mut WindowContext) -> Self {
+        elevated(self, cx, ElevationIndex::ModalSurface)
+    }
+
+    /// See [`elevation_3`].
+    ///
+    /// Renders a borderless version [`elevation_3`].
+    fn elevation_3_borderless(self, cx: &mut WindowContext) -> Self {
+        elevated_borderless(self, cx, ElevationIndex::ModalSurface)
+    }
+
+    /// The theme's primary border color.
+    fn border_primary(self, cx: &mut WindowContext) -> Self {
+        self.border_color(cx.theme().colors().border)
+    }
+
+    /// The theme's secondary or muted border color.
+    fn border_muted(self, cx: &mut WindowContext) -> Self {
+        self.border_color(cx.theme().colors().border_variant)
+    }
+
+    /// Sets the background color to red for debugging when building UI.
+    fn debug_bg_red(self) -> Self {
+        self.bg(hsla(0. / 360., 1., 0.5, 1.))
+    }
+
+    /// Sets the background color to green for debugging when building UI.
+    fn debug_bg_green(self) -> Self {
+        self.bg(hsla(120. / 360., 1., 0.5, 1.))
+    }
+
+    /// Sets the background color to blue for debugging when building UI.
+    fn debug_bg_blue(self) -> Self {
+        self.bg(hsla(240. / 360., 1., 0.5, 1.))
+    }
+
+    /// Sets the background color to yellow for debugging when building UI.
+    fn debug_bg_yellow(self) -> Self {
+        self.bg(hsla(60. / 360., 1., 0.5, 1.))
+    }
+
+    /// Sets the background color to cyan for debugging when building UI.
+    fn debug_bg_cyan(self) -> Self {
+        self.bg(hsla(160. / 360., 1., 0.5, 1.))
+    }
+
+    /// Sets the background color to magenta for debugging when building UI.
+    fn debug_bg_magenta(self) -> Self {
+        self.bg(hsla(300. / 360., 1., 0.5, 1.))
+    }
+}
+
+impl<E: Styled> StyledExt for E {}