Add border to button

crates/ui/src/button.rs

@@ -116,7 +116,6 @@ impl Clickable for Button {
 
 impl RenderOnce for Button {
     fn render(self, cx: &mut WindowContext) -> impl IntoElement {
-        let theme = cx.global::<Theme>();
         let style: ButtonStyle = self.style;
         let normal_style = style.normal(cx);
 
@@ -164,6 +163,7 @@ impl RenderOnce for Button {
             .border_1()
             .border_color(normal_style.border)
             .bg(normal_style.bg)
+            .shadow_sm()
             .child({
                 let text_color = if self.disabled {
                     normal_style.fg.opacity(0.6)
@@ -215,6 +215,7 @@ impl ButtonStyle {
             ButtonStyle::Secondary => theme.secondary,
             ButtonStyle::Danger => theme.destructive,
         }
+        .darken(0.05)
     }
 
     fn normal(&self, cx: &WindowContext) -> ButtonStyles {
@@ -235,9 +236,9 @@ impl ButtonStyle {
     }
 
     fn active(&self, cx: &WindowContext) -> ButtonStyles {
-        let bg = self.bg_color(cx);
-        let border = self.border_color(cx);
-        let fg = self.text_color(cx);
+        let bg = self.bg_color(cx).darken(0.05);
+        let border = self.border_color(cx).darken(0.05);
+        let fg = self.text_color(cx).darken(0.05);
 
         ButtonStyles { bg, border, fg }
     }

crates/ui/src/text_field/mod.rs

@@ -235,7 +235,7 @@ impl RenderOnce for TextField {
             .bg(if disabled {
                 theme.muted
             } else {
-                theme.transparent
+                theme.background
             })
             .child(view)
     }

crates/ui/src/text_field/text_view.rs

@@ -313,15 +313,19 @@ impl Render for TextView {
             text = "•".repeat(text.len());
         }
 
-        let mut selection_style = HighlightStyle::default();
-        selection_style.background_color = Some(theme.ring);
-        selection_style.color = Some(theme.ring.invert());
+        let selection_style = HighlightStyle {
+            background_color: Some(theme.ring),
+            color: Some(theme.ring.invert()),
+            ..Default::default()
+        };
 
         let mut highlights = vec![(self.char_range_to_text_range(&text), selection_style)];
 
         if text.is_empty() {
             text = self.placeholder.to_string();
             style.color = theme.muted_foreground;
+        } else {
+            style.color = theme.foreground;
         }
 
         if !self.focused {

crates/ui/src/theme.rs

@@ -1,3 +1,5 @@
+use std::cmp::min;
+
 use gpui::{AppContext, Global, Hsla, Rgba};
 use serde_json::json;
 
@@ -14,6 +16,8 @@ pub trait Colorize {
     fn opacity(&self, opacity: f32) -> Hsla;
     fn divide(&self, divisor: f32) -> Hsla;
     fn invert(&self) -> Hsla;
+    fn lighten(&self, amount: f32) -> Hsla;
+    fn darken(&self, amount: f32) -> Hsla;
 }
 
 impl Colorize for Hsla {
@@ -46,6 +50,18 @@ impl Colorize for Hsla {
             a: self.a,
         }
     }
+
+    fn lighten(&self, amount: f32) -> Hsla {
+        let l = (self.l + amount).min(1.0);
+
+        Hsla { l, ..*self }
+    }
+
+    fn darken(&self, amount: f32) -> Hsla {
+        let l = (self.l - amount).max(0.0);
+
+        Hsla { l, ..*self }
+    }
 }
 
 // @layer base {