From 59c76fefa864dc5e8959df8d700b7e79ccfa6a13 Mon Sep 17 00:00:00 2001
From: Max Brunsfeld <maxbrunsfeld@gmail.com>
Date: Thu, 7 Sep 2023 13:12:26 -0700
Subject: [PATCH] Make toolbar horizontal padding more consistent (#2944)

* increase horizontal padding of toolbar itself, remove padding that was
added to individual toolbar items like feedback button.
* make feedback info text and breadcrumbs have the same additional
padding as quick action buttons.

Release Notes:

- Fixed some inconsistencies in the layout of toolbars.
---
 crates/feedback/src/feedback_info_text.rs |  8 +++++---
 styles/src/style_tree/feedback.ts         | 15 +++++++++------
 styles/src/style_tree/toolbar.ts          |  8 ++++----
 3 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/crates/feedback/src/feedback_info_text.rs b/crates/feedback/src/feedback_info_text.rs
index 91ff22e90451f6af752cbc59642993e618b60a0e..bc0ee9ea36709fc5fb26278428cfdb0741ae3d84 100644
--- a/crates/feedback/src/feedback_info_text.rs
+++ b/crates/feedback/src/feedback_info_text.rs
@@ -42,14 +42,14 @@ impl View for FeedbackInfoText {
             )
             .with_child(
                 MouseEventHandler::new::<OpenZedCommunityRepo, _>(0, cx, |state, _| {
-                    let contained_text = if state.hovered() {
+                    let style = if state.hovered() {
                         &theme.feedback.link_text_hover
                     } else {
                         &theme.feedback.link_text_default
                     };
-
-                    Label::new("community repo", contained_text.text.clone())
+                    Label::new("community repo", style.text.clone())
                         .contained()
+                        .with_style(style.container)
                         .aligned()
                         .left()
                         .clipped()
@@ -64,6 +64,8 @@ impl View for FeedbackInfoText {
                     .with_soft_wrap(false)
                     .aligned(),
             )
+            .contained()
+            .with_style(theme.feedback.info_text_default.container)
             .aligned()
             .left()
             .clipped()
diff --git a/styles/src/style_tree/feedback.ts b/styles/src/style_tree/feedback.ts
index 0349359533041d4425df3d0c72d120ed18499a30..4226db9753ad0429d4119293c80bace9928b61be 100644
--- a/styles/src/style_tree/feedback.ts
+++ b/styles/src/style_tree/feedback.ts
@@ -12,9 +12,6 @@ export default function feedback(): any {
                 background: background(theme.highest, "on"),
                 corner_radius: 6,
                 border: border(theme.highest, "on"),
-                margin: {
-                    right: 4,
-                },
                 padding: {
                     bottom: 2,
                     left: 10,
@@ -41,9 +38,15 @@ export default function feedback(): any {
             },
         }),
         button_margin: 8,
-        info_text_default: text(theme.highest, "sans", "default", {
-            size: "xs",
-        }),
+        info_text_default: {
+            padding: {
+                left: 4,
+                right: 4,
+            },
+            ...text(theme.highest, "sans", "default", {
+                size: "xs",
+            })
+        },
         link_text_default: text(theme.highest, "sans", "default", {
             size: "xs",
             underline: true,
diff --git a/styles/src/style_tree/toolbar.ts b/styles/src/style_tree/toolbar.ts
index 2d96293e309e059de14f29a9fb58ffb555020fff..8dbf639d61d0296659d9dd8a49ad19f3da7d0fe7 100644
--- a/styles/src/style_tree/toolbar.ts
+++ b/styles/src/style_tree/toolbar.ts
@@ -8,7 +8,7 @@ export const toolbar = () => {
 
     return {
         height: 42,
-        padding: { left: 4, right: 4 },
+        padding: { left: 8, right: 8 },
         background: background(theme.highest),
         border: border(theme.highest, { bottom: true }),
         item_spacing: 4,
@@ -23,9 +23,9 @@ export const toolbar = () => {
                 ...text(theme.highest, "sans", "variant"),
                 corner_radius: 6,
                 padding: {
-                    left: 6,
-                    right: 6,
-                },
+                    left: 4,
+                    right: 4,
+                }
             },
             state: {
                 hovered: {