Use new icons in channel panel

Nate Butler created

Change summary

assets/icons/hash.svg                 |  6 ++++++
assets/icons/html.svg                 |  5 +++++
assets/icons/lock.svg                 |  6 ++++++
crates/collab_ui/src/collab_panel.rs  | 26 +++++++++++++-------------
styles/src/style_tree/collab_panel.ts |  2 +-
5 files changed, 31 insertions(+), 14 deletions(-)

Detailed changes

assets/icons/hash.svg 🔗 

@@ -0,0 +1,6 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<line x1="10.2795" y1="2.63847" x2="7.74786" y2="11.0142" stroke="black" stroke-width="1.25" stroke-linecap="round"/>
+<line x1="6.26625" y1="2.99597" x2="3.73461" y2="11.3717" stroke="black" stroke-width="1.25" stroke-linecap="round"/>
+<line x1="3.15979" y1="5.3799" x2="11.9098" y2="5.3799" stroke="black" stroke-width="1.25" stroke-linecap="round"/>
+<line x1="2.09833" y1="8.62407" x2="10.8483" y2="8.62407" stroke="black" stroke-width="1.25" stroke-linecap="round"/>
+</svg>

assets/icons/html.svg 🔗 

@@ -0,0 +1,5 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.15735 3.17108L5.84271 10.8289" stroke="black" stroke-width="1.25" stroke-linecap="round"/>
+<path d="M4 5L2 7L4 9" stroke="black" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M10 9L12 7L10 5" stroke="black" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

assets/icons/lock.svg 🔗 

@@ -0,0 +1,6 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="3" y="5" width="8" height="7" rx="0.5" stroke="black" stroke-width="1.25"/>
+<path d="M4 4C4 2.89543 4.89543 2 6 2H8C9.10457 2 10 2.89543 10 4V5H4V4Z" stroke="black" stroke-opacity="0.75" stroke-width="1.25"/>
+<circle cx="7" cy="8" r="1" fill="black"/>
+<path d="M7 8V9.375" stroke="black" stroke-width="1.25" stroke-linecap="round"/>
+</svg>

crates/collab_ui/src/collab_panel.rs 🔗 

@@ -1189,7 +1189,7 @@ impl CollabPanel {
                             .collab_panel
                             .leave_call_button
                             .style_for(is_selected, state),
-                        "icons/radix/exit.svg",
+                        "icons/exit.svg",
                     )
                 })
                 .with_cursor_style(CursorStyle::PointingHand)
@@ -1233,7 +1233,7 @@ impl CollabPanel {
                             .collab_panel
                             .add_contact_button
                             .style_for(is_selected, state),
-                        "icons/plus_16.svg",
+                        "icons/plus.svg",
                     )
                 })
                 .with_cursor_style(CursorStyle::PointingHand)
@@ -1266,9 +1266,9 @@ impl CollabPanel {
                 .with_children(if can_collapse {
                     Some(
                         Svg::new(if is_collapsed {
-                            "icons/chevron_right_8.svg"
+                            "icons/chevron_right.svg"
                         } else {
-                            "icons/chevron_down_8.svg"
+                            "icons/chevron_down.svg"
                         })
                         .with_color(header_style.text.color)
                         .constrained()
@@ -1364,7 +1364,7 @@ impl CollabPanel {
                             cx,
                             |mouse_state, _| {
                                 let button_style = theme.contact_button.style_for(mouse_state);
-                                render_icon_button(button_style, "icons/x_mark_8.svg")
+                                render_icon_button(button_style, "icons/x.svg")
                                     .aligned()
                                     .flex_float()
                             },
@@ -1415,7 +1415,7 @@ impl CollabPanel {
             let style = theme.list_empty_state.style_for(is_selected, state);
             Flex::row()
                 .with_child(
-                    Svg::new("icons/plus_16.svg")
+                    Svg::new("icons/plus.svg")
                         .with_color(theme.list_empty_icon.color)
                         .constrained()
                         .with_width(theme.list_empty_icon.width)
@@ -1446,7 +1446,7 @@ impl CollabPanel {
     ) -> AnyElement<Self> {
         Flex::row()
             .with_child(
-                Svg::new("icons/channel_hash.svg")
+                Svg::new("icons/hash.svg")
                     .with_color(theme.collab_panel.channel_hash.color)
                     .constrained()
                     .with_width(theme.collab_panel.channel_hash.width)
@@ -1506,7 +1506,7 @@ impl CollabPanel {
         MouseEventHandler::<Channel, Self>::new(channel.id as usize, cx, |state, cx| {
             Flex::row()
                 .with_child(
-                    Svg::new("icons/channel_hash.svg")
+                    Svg::new("icons/hash.svg")
                         .with_color(theme.channel_hash.color)
                         .constrained()
                         .with_width(theme.channel_hash.width)
@@ -1572,7 +1572,7 @@ impl CollabPanel {
 
         Flex::row()
             .with_child(
-                Svg::new("icons/channel_hash.svg")
+                Svg::new("icons/hash.svg")
                     .with_color(theme.channel_hash.color)
                     .constrained()
                     .with_width(theme.channel_hash.width)
@@ -1597,7 +1597,7 @@ impl CollabPanel {
                         } else {
                             theme.contact_button.style_for(mouse_state)
                         };
-                        render_icon_button(button_style, "icons/x_mark_8.svg").aligned()
+                        render_icon_button(button_style, "icons/x.svg").aligned()
                     },
                 )
                 .with_cursor_style(CursorStyle::PointingHand)
@@ -1686,7 +1686,7 @@ impl CollabPanel {
                     } else {
                         theme.contact_button.style_for(mouse_state)
                     };
-                    render_icon_button(button_style, "icons/x_mark_8.svg").aligned()
+                    render_icon_button(button_style, "icons/x.svg").aligned()
                 })
                 .with_cursor_style(CursorStyle::PointingHand)
                 .on_click(MouseButton::Left, move |_, this, cx| {
@@ -1720,7 +1720,7 @@ impl CollabPanel {
                     } else {
                         theme.contact_button.style_for(mouse_state)
                     };
-                    render_icon_button(button_style, "icons/x_mark_8.svg")
+                    render_icon_button(button_style, "icons/x.svg")
                         .aligned()
                         .flex_float()
                 })
@@ -2340,7 +2340,7 @@ impl Panel for CollabPanel {
     fn icon_path(&self, cx: &gpui::WindowContext) -> Option<&'static str> {
         settings::get::<CollaborationPanelSettings>(cx)
             .button
-            .then(|| "icons/speech_bubble_12.svg")
+            .then(|| "icons/conversations.svg")
     }
 
     fn icon_tooltip(&self) -> (String, Option<Box<dyn gpui::Action>>) {

styles/src/style_tree/collab_panel.ts 🔗 

@@ -132,7 +132,7 @@ export default function contacts_panel(): any {
         leave_call_button: header_icon_button,
         row_height: ITEM_HEIGHT,
         channel_indent: INDENT_SIZE,
-        section_icon_size: 8,
+        section_icon_size: 14,
         header_row: {
             ...text(layer, "ui_sans", { size: "sm", weight: "bold" }),
             margin: { top: SPACING },