From 75605426591977ce783d73c5433acefd10d1057f Mon Sep 17 00:00:00 2001
From: Floyd Wang <gassnake999@gmail.com>
Date: Tue, 3 Dec 2024 19:06:10 +0800
Subject: [PATCH] divider: Support custom colors (#459)

<img width="850" alt="image"
src="https://github.com/user-attachments/assets/0161b14d-88ae-4bdf-a515-34df9aefb845">
---
 crates/story/src/progress_story.rs |  7 ++++++-
 crates/ui/src/divider.rs           | 14 +++++++++++---
 2 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/crates/story/src/progress_story.rs b/crates/story/src/progress_story.rs
index cb9e64d6..38834fea 100644
--- a/crates/story/src/progress_story.rs
+++ b/crates/story/src/progress_story.rs
@@ -145,7 +145,12 @@ impl Render for ProgressStory {
                     )
                     .child(Indicator::new().with_size(px(64.))),
             )
-            .child(Divider::horizontal().mt_10().label("Slider"))
+            .child(
+                Divider::horizontal()
+                    .mt_10()
+                    .label("Slider")
+                    .color(ui::gray_300()),
+            )
             .child(self.slider1.clone())
             .child(format!("Slider 1: {}", self.slider1_value))
             .child(
diff --git a/crates/ui/src/divider.rs b/crates/ui/src/divider.rs
index 15056166..a665c4d7 100644
--- a/crates/ui/src/divider.rs
+++ b/crates/ui/src/divider.rs
@@ -1,5 +1,5 @@
 use gpui::{
-    div, prelude::FluentBuilder as _, px, Axis, Div, IntoElement, ParentElement, RenderOnce,
+    div, prelude::FluentBuilder as _, px, Axis, Div, Hsla, IntoElement, ParentElement, RenderOnce,
     SharedString, Styled,
 };
 
@@ -11,6 +11,7 @@ pub struct Divider {
     base: Div,
     label: Option<SharedString>,
     axis: Axis,
+    color: Option<Hsla>,
 }
 
 impl Divider {
@@ -19,6 +20,7 @@ impl Divider {
             base: div().h_full(),
             axis: Axis::Vertical,
             label: None,
+            color: None,
         }
     }
 
@@ -27,6 +29,7 @@ impl Divider {
             base: div().w_full(),
             axis: Axis::Horizontal,
             label: None,
+            color: None,
         }
     }
 
@@ -34,6 +37,11 @@ impl Divider {
         self.label = Some(label.into());
         self
     }
+
+    pub fn color(mut self, color: impl Into<Hsla>) -> Self {
+        self.color = Some(color.into());
+        self
+    }
 }
 
 impl Styled for Divider {
@@ -43,7 +51,7 @@ impl Styled for Divider {
 }
 
 impl RenderOnce for Divider {
-    fn render(self, cx: &mut gpui::WindowContext) -> impl gpui::IntoElement {
+    fn render(self, cx: &mut gpui::WindowContext) -> impl IntoElement {
         let theme = cx.theme();
 
         self.base
@@ -58,7 +66,7 @@ impl RenderOnce for Divider {
                         Axis::Vertical => this.w(px(1.)).h_full(),
                         Axis::Horizontal => this.h(px(1.)).w_full(),
                     })
-                    .bg(cx.theme().border),
+                    .bg(self.color.unwrap_or(cx.theme().border)),
             )
             .when_some(self.label, |this, label| {
                 this.child(