diff --git a/assets/icons/broadcast-24.svg b/assets/icons/broadcast-24.svg
deleted file mode 100644
index 391528cdc7..0000000000
--- a/assets/icons/broadcast-24.svg
+++ /dev/null
@@ -1,6 +0,0 @@
-
diff --git a/assets/icons/share.svg b/assets/icons/share.svg
new file mode 100644
index 0000000000..ee8ddfffc9
--- /dev/null
+++ b/assets/icons/share.svg
@@ -0,0 +1,3 @@
+
diff --git a/assets/themes/cave-dark.json b/assets/themes/cave-dark.json
index e9cc43c60e..f0cb374632 100644
--- a/assets/themes/cave-dark.json
+++ b/assets/themes/cave-dark.json
@@ -258,8 +258,9 @@
"avatar_width": 18,
"height": 32,
"background": "#26232a",
- "share_icon_color": "#8b8792",
- "share_icon_active_color": "#576ddb",
+ "padding": {
+ "left": 80
+ },
"title": {
"family": "Zed Sans",
"color": "#e2dfe7",
@@ -324,10 +325,48 @@
"right": 4
}
},
+ "share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "color": "#8b8792"
+ },
+ "hovered_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#58526052",
+ "color": "#8b8792"
+ },
+ "hovered_active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#58526052",
+ "color": "#efecf4"
+ },
+ "active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#5852607a",
+ "color": "#efecf4"
+ },
"outdated_warning": {
"family": "Zed Sans",
"color": "#a06e3b",
- "size": 13
+ "size": 13,
+ "margin": {
+ "right": 6
+ }
}
},
"toolbar": {
diff --git a/assets/themes/cave-light.json b/assets/themes/cave-light.json
index be85aea689..aa062d4786 100644
--- a/assets/themes/cave-light.json
+++ b/assets/themes/cave-light.json
@@ -258,8 +258,9 @@
"avatar_width": 18,
"height": 32,
"background": "#e2dfe7",
- "share_icon_color": "#585260",
- "share_icon_active_color": "#576ddb",
+ "padding": {
+ "left": 80
+ },
"title": {
"family": "Zed Sans",
"color": "#26232a",
@@ -324,10 +325,48 @@
"right": 4
}
},
+ "share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "color": "#585260"
+ },
+ "hovered_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#8b87921f",
+ "color": "#585260"
+ },
+ "hovered_active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#8b87921f",
+ "color": "#19171c"
+ },
+ "active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#8b87922e",
+ "color": "#19171c"
+ },
"outdated_warning": {
"family": "Zed Sans",
"color": "#a06e3b",
- "size": 13
+ "size": 13,
+ "margin": {
+ "right": 6
+ }
}
},
"toolbar": {
diff --git a/assets/themes/dark.json b/assets/themes/dark.json
index f27c3d90fb..2a371680f5 100644
--- a/assets/themes/dark.json
+++ b/assets/themes/dark.json
@@ -258,8 +258,9 @@
"avatar_width": 18,
"height": 32,
"background": "#2b2b2b",
- "share_icon_color": "#9c9c9c",
- "share_icon_active_color": "#2472f2",
+ "padding": {
+ "left": 80
+ },
"title": {
"family": "Zed Sans",
"color": "#f1f1f1",
@@ -324,10 +325,48 @@
"right": 4
}
},
+ "share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "color": "#9c9c9c"
+ },
+ "hovered_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#323232",
+ "color": "#9c9c9c"
+ },
+ "hovered_active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#323232",
+ "color": "#ffffff"
+ },
+ "active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#1c1c1c",
+ "color": "#ffffff"
+ },
"outdated_warning": {
"family": "Zed Sans",
"color": "#f7bb57",
- "size": 13
+ "size": 13,
+ "margin": {
+ "right": 6
+ }
}
},
"toolbar": {
diff --git a/assets/themes/light.json b/assets/themes/light.json
index d5b21209a5..8d56526e20 100644
--- a/assets/themes/light.json
+++ b/assets/themes/light.json
@@ -258,8 +258,9 @@
"avatar_width": 18,
"height": 32,
"background": "#eaeaea",
- "share_icon_color": "#717171",
- "share_icon_active_color": "#484bed",
+ "padding": {
+ "left": 80
+ },
"title": {
"family": "Zed Sans",
"color": "#2b2b2b",
@@ -324,10 +325,48 @@
"right": 4
}
},
+ "share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "color": "#717171"
+ },
+ "hovered_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#e3e3e3",
+ "color": "#717171"
+ },
+ "hovered_active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#e3e3e3",
+ "color": "#000000"
+ },
+ "active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#d5d5d5",
+ "color": "#000000"
+ },
"outdated_warning": {
"family": "Zed Sans",
"color": "#d3a20b",
- "size": 13
+ "size": 13,
+ "margin": {
+ "right": 6
+ }
}
},
"toolbar": {
diff --git a/assets/themes/solarized-dark.json b/assets/themes/solarized-dark.json
index 8c90d26574..bd73ab934e 100644
--- a/assets/themes/solarized-dark.json
+++ b/assets/themes/solarized-dark.json
@@ -258,8 +258,9 @@
"avatar_width": 18,
"height": 32,
"background": "#073642",
- "share_icon_color": "#93a1a1",
- "share_icon_active_color": "#268bd2",
+ "padding": {
+ "left": 80
+ },
"title": {
"family": "Zed Sans",
"color": "#eee8d5",
@@ -324,10 +325,48 @@
"right": 4
}
},
+ "share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "color": "#93a1a1"
+ },
+ "hovered_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#586e7552",
+ "color": "#93a1a1"
+ },
+ "hovered_active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#586e7552",
+ "color": "#fdf6e3"
+ },
+ "active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#586e757a",
+ "color": "#fdf6e3"
+ },
"outdated_warning": {
"family": "Zed Sans",
"color": "#b58900",
- "size": 13
+ "size": 13,
+ "margin": {
+ "right": 6
+ }
}
},
"toolbar": {
diff --git a/assets/themes/solarized-light.json b/assets/themes/solarized-light.json
index 772c3e5870..35de751a2b 100644
--- a/assets/themes/solarized-light.json
+++ b/assets/themes/solarized-light.json
@@ -258,8 +258,9 @@
"avatar_width": 18,
"height": 32,
"background": "#eee8d5",
- "share_icon_color": "#586e75",
- "share_icon_active_color": "#268bd2",
+ "padding": {
+ "left": 80
+ },
"title": {
"family": "Zed Sans",
"color": "#073642",
@@ -324,10 +325,48 @@
"right": 4
}
},
+ "share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "color": "#586e75"
+ },
+ "hovered_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#93a1a11f",
+ "color": "#586e75"
+ },
+ "hovered_active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#93a1a11f",
+ "color": "#002b36"
+ },
+ "active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#93a1a12e",
+ "color": "#002b36"
+ },
"outdated_warning": {
"family": "Zed Sans",
"color": "#b58900",
- "size": 13
+ "size": 13,
+ "margin": {
+ "right": 6
+ }
}
},
"toolbar": {
diff --git a/assets/themes/sulphurpool-dark.json b/assets/themes/sulphurpool-dark.json
index b96ca48b98..20123449bb 100644
--- a/assets/themes/sulphurpool-dark.json
+++ b/assets/themes/sulphurpool-dark.json
@@ -258,8 +258,9 @@
"avatar_width": 18,
"height": 32,
"background": "#293256",
- "share_icon_color": "#979db4",
- "share_icon_active_color": "#3d8fd1",
+ "padding": {
+ "left": 80
+ },
"title": {
"family": "Zed Sans",
"color": "#dfe2f1",
@@ -324,10 +325,48 @@
"right": 4
}
},
+ "share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "color": "#979db4"
+ },
+ "hovered_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#5e668752",
+ "color": "#979db4"
+ },
+ "hovered_active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#5e668752",
+ "color": "#f5f7ff"
+ },
+ "active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#5e66877a",
+ "color": "#f5f7ff"
+ },
"outdated_warning": {
"family": "Zed Sans",
"color": "#c08b30",
- "size": 13
+ "size": 13,
+ "margin": {
+ "right": 6
+ }
}
},
"toolbar": {
diff --git a/assets/themes/sulphurpool-light.json b/assets/themes/sulphurpool-light.json
index dfc8c6b67b..9bebd82036 100644
--- a/assets/themes/sulphurpool-light.json
+++ b/assets/themes/sulphurpool-light.json
@@ -258,8 +258,9 @@
"avatar_width": 18,
"height": 32,
"background": "#dfe2f1",
- "share_icon_color": "#5e6687",
- "share_icon_active_color": "#3d8fd1",
+ "padding": {
+ "left": 80
+ },
"title": {
"family": "Zed Sans",
"color": "#293256",
@@ -324,10 +325,48 @@
"right": 4
}
},
+ "share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "color": "#5e6687"
+ },
+ "hovered_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#979db41f",
+ "color": "#5e6687"
+ },
+ "hovered_active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#979db41f",
+ "color": "#202746"
+ },
+ "active_share_icon": {
+ "margin": {
+ "top": 3,
+ "bottom": 2
+ },
+ "corner_radius": 6,
+ "background": "#979db42e",
+ "color": "#202746"
+ },
"outdated_warning": {
"family": "Zed Sans",
"color": "#c08b30",
- "size": 13
+ "size": 13,
+ "margin": {
+ "right": 6
+ }
}
},
"toolbar": {
diff --git a/crates/project/src/project.rs b/crates/project/src/project.rs
index 9085490fca..5243afe91c 100644
--- a/crates/project/src/project.rs
+++ b/crates/project/src/project.rs
@@ -669,6 +669,10 @@ impl Project {
.map(|worktree| worktree.read(cx).id())
}
+ pub fn can_share(&self, cx: &AppContext) -> bool {
+ self.is_local() && self.visible_worktrees(cx).next().is_some()
+ }
+
pub fn share(&self, cx: &mut ModelContext) -> Task> {
let rpc = self.client.clone();
cx.spawn(|this, mut cx| async move {
diff --git a/crates/theme/src/theme.rs b/crates/theme/src/theme.rs
index 1299ed7fc4..b4533298ac 100644
--- a/crates/theme/src/theme.rs
+++ b/crates/theme/src/theme.rs
@@ -55,8 +55,10 @@ pub struct Titlebar {
pub avatar_width: f32,
pub avatar_ribbon: AvatarRibbon,
pub offline_icon: OfflineIcon,
- pub share_icon_color: Color,
- pub share_icon_active_color: Color,
+ pub share_icon: ShareIcon,
+ pub hovered_share_icon: ShareIcon,
+ pub active_share_icon: ShareIcon,
+ pub hovered_active_share_icon: ShareIcon,
pub avatar: ImageStyle,
pub sign_in_prompt: ContainedText,
pub hovered_sign_in_prompt: ContainedText,
@@ -79,6 +81,13 @@ pub struct OfflineIcon {
pub color: Color,
}
+#[derive(Clone, Deserialize, Default)]
+pub struct ShareIcon {
+ #[serde(flatten)]
+ pub container: ContainerStyle,
+ pub color: Color,
+}
+
#[derive(Clone, Deserialize, Default)]
pub struct Tab {
pub height: f32,
diff --git a/crates/workspace/src/workspace.rs b/crates/workspace/src/workspace.rs
index 19043ec145..1c0a92823c 100644
--- a/crates/workspace/src/workspace.rs
+++ b/crates/workspace/src/workspace.rs
@@ -1297,7 +1297,7 @@ impl Workspace {
if project.is_local() {
if project.is_shared() {
project.unshare(cx);
- } else {
+ } else if project.can_share(cx) {
project.share(cx).detach();
}
}
@@ -1493,22 +1493,20 @@ impl Workspace {
Label::new(worktree_root_names, theme.workspace.titlebar.title.clone())
.aligned()
.left()
- .contained()
- .with_margin_left(80.)
.boxed(),
)
.with_child(
Align::new(
Flex::row()
- .with_children(self.render_share_icon(theme, cx))
.with_children(self.render_collaborators(theme, cx))
- .with_child(self.render_current_user(
+ .with_children(self.render_current_user(
self.user_store.read(cx).current_user().as_ref(),
self.project.read(cx).replica_id(),
theme,
cx,
))
.with_children(self.render_connection_status(cx))
+ .with_children(self.render_share_icon(theme, cx))
.boxed(),
)
.right()
@@ -1552,25 +1550,30 @@ impl Workspace {
replica_id: ReplicaId,
theme: &Theme,
cx: &mut RenderContext,
- ) -> ElementBox {
+ ) -> Option {
+ let status = *self.client.status().borrow();
if let Some(avatar) = user.and_then(|user| user.avatar.clone()) {
- self.render_avatar(avatar, replica_id, None, theme, cx)
+ Some(self.render_avatar(avatar, replica_id, None, theme, cx))
+ } else if matches!(status, client::Status::UpgradeRequired) {
+ None
} else {
- MouseEventHandler::new::(0, cx, |state, _| {
- let style = if state.hovered {
- &theme.workspace.titlebar.hovered_sign_in_prompt
- } else {
- &theme.workspace.titlebar.sign_in_prompt
- };
- Label::new("Sign in".to_string(), style.text.clone())
- .contained()
- .with_style(style.container)
- .boxed()
- })
- .on_click(|cx| cx.dispatch_action(Authenticate))
- .with_cursor_style(CursorStyle::PointingHand)
- .aligned()
- .boxed()
+ Some(
+ MouseEventHandler::new::(0, cx, |state, _| {
+ let style = if state.hovered {
+ &theme.workspace.titlebar.hovered_sign_in_prompt
+ } else {
+ &theme.workspace.titlebar.sign_in_prompt
+ };
+ Label::new("Sign in".to_string(), style.text.clone())
+ .contained()
+ .with_style(style.container)
+ .boxed()
+ })
+ .on_click(|cx| cx.dispatch_action(Authenticate))
+ .with_cursor_style(CursorStyle::PointingHand)
+ .aligned()
+ .boxed(),
+ )
}
}
@@ -1610,6 +1613,8 @@ impl Workspace {
)
.constrained()
.with_width(theme.workspace.right_sidebar.width)
+ .contained()
+ .with_margin_left(2.)
.boxed();
if let Some(peer_id) = peer_id {
@@ -1623,22 +1628,39 @@ impl Workspace {
}
fn render_share_icon(&self, theme: &Theme, cx: &mut RenderContext) -> Option {
- if self.project().read(cx).is_local() && self.client.user_id().is_some() {
- let color = if self.project().read(cx).is_shared() {
- theme.workspace.titlebar.share_icon_active_color
- } else {
- theme.workspace.titlebar.share_icon_color
- };
+ if self.project().read(cx).is_local()
+ && self.client.user_id().is_some()
+ && self.project().read(cx).can_share(cx)
+ {
Some(
- MouseEventHandler::new::(0, cx, |_, _| {
- Align::new(
- Svg::new("icons/broadcast-24.svg")
- .with_color(color)
- .constrained()
- .with_width(24.)
- .boxed(),
- )
- .boxed()
+ MouseEventHandler::new::(0, cx, |state, cx| {
+ let style = if self.project().read(cx).is_shared() {
+ if state.hovered {
+ &theme.workspace.titlebar.hovered_active_share_icon
+ } else {
+ &theme.workspace.titlebar.active_share_icon
+ }
+ } else {
+ if state.hovered {
+ &theme.workspace.titlebar.hovered_share_icon
+ } else {
+ &theme.workspace.titlebar.share_icon
+ }
+ };
+ Svg::new("icons/share.svg")
+ .with_color(style.color)
+ .constrained()
+ .with_height(14.)
+ .aligned()
+ .contained()
+ .with_style(style.container)
+ .constrained()
+ .with_width(24.)
+ .aligned()
+ .constrained()
+ .with_width(theme.workspace.right_sidebar.width)
+ .aligned()
+ .boxed()
})
.with_cursor_style(CursorStyle::PointingHand)
.on_click(|cx| cx.dispatch_action(ToggleShare))
diff --git a/styles/dist/tokens.json b/styles/dist/tokens.json
index cb0c0744af..2d52abc280 100644
--- a/styles/dist/tokens.json
+++ b/styles/dist/tokens.json
@@ -2515,1139 +2515,5 @@
"value": 0.12,
"type": "number"
}
- },
- "solarized-dark": {
- "meta": {
- "themeName": "solarized-dark"
- },
- "text": {
- "primary": {
- "value": "#eee8d5",
- "type": "color"
- },
- "secondary": {
- "value": "#93a1a1",
- "type": "color"
- },
- "muted": {
- "value": "#93a1a1",
- "type": "color"
- },
- "placeholder": {
- "value": "#839496",
- "type": "color"
- },
- "active": {
- "value": "#fdf6e3",
- "type": "color"
- },
- "feature": {
- "value": "#268bd2",
- "type": "color"
- },
- "ok": {
- "value": "#859900",
- "type": "color"
- },
- "error": {
- "value": "#dc322f",
- "type": "color"
- },
- "warning": {
- "value": "#b58900",
- "type": "color"
- },
- "info": {
- "value": "#268bd2",
- "type": "color"
- }
- },
- "icon": {
- "primary": {
- "value": "#eee8d5",
- "type": "color"
- },
- "secondary": {
- "value": "#93a1a1",
- "type": "color"
- },
- "muted": {
- "value": "#93a1a1",
- "type": "color"
- },
- "placeholder": {
- "value": "#839496",
- "type": "color"
- },
- "active": {
- "value": "#fdf6e3",
- "type": "color"
- },
- "feature": {
- "value": "#268bd2",
- "type": "color"
- },
- "ok": {
- "value": "#859900",
- "type": "color"
- },
- "error": {
- "value": "#dc322f",
- "type": "color"
- },
- "warning": {
- "value": "#b58900",
- "type": "color"
- },
- "info": {
- "value": "#268bd2",
- "type": "color"
- }
- },
- "background": {
- "100": {
- "base": {
- "value": "#073642",
- "type": "color"
- },
- "hovered": {
- "value": "#586e75",
- "type": "color"
- },
- "active": {
- "value": "#586e75",
- "type": "color"
- },
- "focused": {
- "value": "#586e75",
- "type": "color"
- }
- },
- "300": {
- "base": {
- "value": "#073642",
- "type": "color"
- },
- "hovered": {
- "value": "#586e75",
- "type": "color"
- },
- "active": {
- "value": "#586e75",
- "type": "color"
- },
- "focused": {
- "value": "#586e75",
- "type": "color"
- }
- },
- "500": {
- "base": {
- "value": "#002b36",
- "type": "color"
- },
- "hovered": {
- "value": "#073642",
- "type": "color"
- },
- "active": {
- "value": "#073642",
- "type": "color"
- },
- "focused": {
- "value": "#073642",
- "type": "color"
- }
- },
- "on300": {
- "base": {
- "value": "#002b36",
- "type": "color"
- },
- "hovered": {
- "value": "#073642",
- "type": "color"
- },
- "active": {
- "value": "#073642",
- "type": "color"
- },
- "focused": {
- "value": "#073642",
- "type": "color"
- }
- },
- "on500": {
- "base": {
- "value": "#073642",
- "type": "color"
- },
- "hovered": {
- "value": "#586e75",
- "type": "color"
- },
- "active": {
- "value": "#586e75",
- "type": "color"
- },
- "focused": {
- "value": "#586e75",
- "type": "color"
- }
- },
- "ok": {
- "base": {
- "value": "#859900",
- "type": "color"
- },
- "hovered": {
- "value": "#859900",
- "type": "color"
- },
- "active": {
- "value": "#859900",
- "type": "color"
- },
- "focused": {
- "value": "#859900",
- "type": "color"
- }
- },
- "error": {
- "base": {
- "value": "#dc322f",
- "type": "color"
- },
- "hovered": {
- "value": "#dc322f",
- "type": "color"
- },
- "active": {
- "value": "#dc322f",
- "type": "color"
- },
- "focused": {
- "value": "#dc322f",
- "type": "color"
- }
- },
- "warning": {
- "base": {
- "value": "#b58900",
- "type": "color"
- },
- "hovered": {
- "value": "#b58900",
- "type": "color"
- },
- "active": {
- "value": "#b58900",
- "type": "color"
- },
- "focused": {
- "value": "#b58900",
- "type": "color"
- }
- },
- "info": {
- "base": {
- "value": "#268bd2",
- "type": "color"
- },
- "hovered": {
- "value": "#268bd2",
- "type": "color"
- },
- "active": {
- "value": "#268bd2",
- "type": "color"
- },
- "focused": {
- "value": "#268bd2",
- "type": "color"
- }
- }
- },
- "border": {
- "primary": {
- "value": "#002b36",
- "type": "color"
- },
- "secondary": {
- "value": "#073642",
- "type": "color"
- },
- "muted": {
- "value": "#586e75",
- "type": "color"
- },
- "focused": {
- "value": "#586e75",
- "type": "color"
- },
- "active": {
- "value": "#586e75",
- "type": "color"
- },
- "ok": {
- "value": "#859900",
- "type": "color"
- },
- "error": {
- "value": "#dc322f",
- "type": "color"
- },
- "warning": {
- "value": "#b58900",
- "type": "color"
- },
- "info": {
- "value": "#268bd2",
- "type": "color"
- }
- },
- "editor": {
- "background": {
- "value": "#002b36",
- "type": "color"
- },
- "indent_guide": {
- "value": "#586e75",
- "type": "color"
- },
- "indent_guide_active": {
- "value": "#073642",
- "type": "color"
- },
- "line": {
- "active": {
- "value": "#fdf6e312",
- "type": "color"
- },
- "highlighted": {
- "value": "#fdf6e31f",
- "type": "color"
- },
- "inserted": {
- "value": "#859900",
- "type": "color"
- },
- "deleted": {
- "value": "#dc322f",
- "type": "color"
- },
- "modified": {
- "value": "#268bd2",
- "type": "color"
- }
- },
- "highlight": {
- "selection": {
- "value": "#268bd23d",
- "type": "color"
- },
- "occurrence": {
- "value": "#657b831f",
- "type": "color"
- },
- "activeOccurrence": {
- "value": "#657b8329",
- "type": "color"
- },
- "matchingBracket": {
- "value": "#073642",
- "type": "color"
- },
- "match": {
- "value": "#6c71c480",
- "type": "color"
- },
- "activeMatch": {
- "value": "#6c71c4b3",
- "type": "color"
- },
- "related": {
- "value": "#073642",
- "type": "color"
- }
- },
- "gutter": {
- "primary": {
- "value": "#839496",
- "type": "color"
- },
- "active": {
- "value": "#fdf6e3",
- "type": "color"
- }
- }
- },
- "syntax": {
- "primary": {
- "value": "#fdf6e3",
- "type": "color"
- },
- "comment": {
- "value": "#eee8d5",
- "type": "color"
- },
- "keyword": {
- "value": "#268bd2",
- "type": "color"
- },
- "function": {
- "value": "#b58900",
- "type": "color"
- },
- "type": {
- "value": "#2aa198",
- "type": "color"
- },
- "variant": {
- "value": "#268bd2",
- "type": "color"
- },
- "property": {
- "value": "#268bd2",
- "type": "color"
- },
- "enum": {
- "value": "#cb4b16",
- "type": "color"
- },
- "operator": {
- "value": "#cb4b16",
- "type": "color"
- },
- "string": {
- "value": "#cb4b16",
- "type": "color"
- },
- "number": {
- "value": "#859900",
- "type": "color"
- },
- "boolean": {
- "value": "#859900",
- "type": "color"
- }
- },
- "player": {
- "1": {
- "baseColor": {
- "value": "#268bd2",
- "type": "color"
- },
- "cursorColor": {
- "value": "#268bd2",
- "type": "color"
- },
- "selectionColor": {
- "value": "#268bd23d",
- "type": "color"
- },
- "borderColor": {
- "value": "#268bd2cc",
- "type": "color"
- }
- },
- "2": {
- "baseColor": {
- "value": "#859900",
- "type": "color"
- },
- "cursorColor": {
- "value": "#859900",
- "type": "color"
- },
- "selectionColor": {
- "value": "#8599003d",
- "type": "color"
- },
- "borderColor": {
- "value": "#859900cc",
- "type": "color"
- }
- },
- "3": {
- "baseColor": {
- "value": "#d33682",
- "type": "color"
- },
- "cursorColor": {
- "value": "#d33682",
- "type": "color"
- },
- "selectionColor": {
- "value": "#d336823d",
- "type": "color"
- },
- "borderColor": {
- "value": "#d33682cc",
- "type": "color"
- }
- },
- "4": {
- "baseColor": {
- "value": "#cb4b16",
- "type": "color"
- },
- "cursorColor": {
- "value": "#cb4b16",
- "type": "color"
- },
- "selectionColor": {
- "value": "#cb4b163d",
- "type": "color"
- },
- "borderColor": {
- "value": "#cb4b16cc",
- "type": "color"
- }
- },
- "5": {
- "baseColor": {
- "value": "#6c71c4",
- "type": "color"
- },
- "cursorColor": {
- "value": "#6c71c4",
- "type": "color"
- },
- "selectionColor": {
- "value": "#6c71c43d",
- "type": "color"
- },
- "borderColor": {
- "value": "#6c71c4cc",
- "type": "color"
- }
- },
- "6": {
- "baseColor": {
- "value": "#2aa198",
- "type": "color"
- },
- "cursorColor": {
- "value": "#2aa198",
- "type": "color"
- },
- "selectionColor": {
- "value": "#2aa1983d",
- "type": "color"
- },
- "borderColor": {
- "value": "#2aa198cc",
- "type": "color"
- }
- },
- "7": {
- "baseColor": {
- "value": "#dc322f",
- "type": "color"
- },
- "cursorColor": {
- "value": "#dc322f",
- "type": "color"
- },
- "selectionColor": {
- "value": "#dc322f3d",
- "type": "color"
- },
- "borderColor": {
- "value": "#dc322fcc",
- "type": "color"
- }
- },
- "8": {
- "baseColor": {
- "value": "#b58900",
- "type": "color"
- },
- "cursorColor": {
- "value": "#b58900",
- "type": "color"
- },
- "selectionColor": {
- "value": "#b589003d",
- "type": "color"
- },
- "borderColor": {
- "value": "#b58900cc",
- "type": "color"
- }
- }
- },
- "shadowAlpha": {
- "value": 0.32,
- "type": "number"
- }
- },
- "solarized-light": {
- "meta": {
- "themeName": "solarized-light"
- },
- "text": {
- "primary": {
- "value": "#073642",
- "type": "color"
- },
- "secondary": {
- "value": "#586e75",
- "type": "color"
- },
- "muted": {
- "value": "#586e75",
- "type": "color"
- },
- "placeholder": {
- "value": "#657b83",
- "type": "color"
- },
- "active": {
- "value": "#002b36",
- "type": "color"
- },
- "feature": {
- "value": "#268bd2",
- "type": "color"
- },
- "ok": {
- "value": "#859900",
- "type": "color"
- },
- "error": {
- "value": "#dc322f",
- "type": "color"
- },
- "warning": {
- "value": "#b58900",
- "type": "color"
- },
- "info": {
- "value": "#268bd2",
- "type": "color"
- }
- },
- "icon": {
- "primary": {
- "value": "#073642",
- "type": "color"
- },
- "secondary": {
- "value": "#586e75",
- "type": "color"
- },
- "muted": {
- "value": "#586e75",
- "type": "color"
- },
- "placeholder": {
- "value": "#657b83",
- "type": "color"
- },
- "active": {
- "value": "#002b36",
- "type": "color"
- },
- "feature": {
- "value": "#268bd2",
- "type": "color"
- },
- "ok": {
- "value": "#859900",
- "type": "color"
- },
- "error": {
- "value": "#dc322f",
- "type": "color"
- },
- "warning": {
- "value": "#b58900",
- "type": "color"
- },
- "info": {
- "value": "#268bd2",
- "type": "color"
- }
- },
- "background": {
- "100": {
- "base": {
- "value": "#eee8d5",
- "type": "color"
- },
- "hovered": {
- "value": "#93a1a1",
- "type": "color"
- },
- "active": {
- "value": "#93a1a1",
- "type": "color"
- },
- "focused": {
- "value": "#93a1a1",
- "type": "color"
- }
- },
- "300": {
- "base": {
- "value": "#eee8d5",
- "type": "color"
- },
- "hovered": {
- "value": "#93a1a1",
- "type": "color"
- },
- "active": {
- "value": "#93a1a1",
- "type": "color"
- },
- "focused": {
- "value": "#93a1a1",
- "type": "color"
- }
- },
- "500": {
- "base": {
- "value": "#fdf6e3",
- "type": "color"
- },
- "hovered": {
- "value": "#eee8d5",
- "type": "color"
- },
- "active": {
- "value": "#eee8d5",
- "type": "color"
- },
- "focused": {
- "value": "#eee8d5",
- "type": "color"
- }
- },
- "on300": {
- "base": {
- "value": "#fdf6e3",
- "type": "color"
- },
- "hovered": {
- "value": "#eee8d5",
- "type": "color"
- },
- "active": {
- "value": "#eee8d5",
- "type": "color"
- },
- "focused": {
- "value": "#eee8d5",
- "type": "color"
- }
- },
- "on500": {
- "base": {
- "value": "#eee8d5",
- "type": "color"
- },
- "hovered": {
- "value": "#93a1a1",
- "type": "color"
- },
- "active": {
- "value": "#93a1a1",
- "type": "color"
- },
- "focused": {
- "value": "#93a1a1",
- "type": "color"
- }
- },
- "ok": {
- "base": {
- "value": "#859900",
- "type": "color"
- },
- "hovered": {
- "value": "#859900",
- "type": "color"
- },
- "active": {
- "value": "#859900",
- "type": "color"
- },
- "focused": {
- "value": "#859900",
- "type": "color"
- }
- },
- "error": {
- "base": {
- "value": "#dc322f",
- "type": "color"
- },
- "hovered": {
- "value": "#dc322f",
- "type": "color"
- },
- "active": {
- "value": "#dc322f",
- "type": "color"
- },
- "focused": {
- "value": "#dc322f",
- "type": "color"
- }
- },
- "warning": {
- "base": {
- "value": "#b58900",
- "type": "color"
- },
- "hovered": {
- "value": "#b58900",
- "type": "color"
- },
- "active": {
- "value": "#b58900",
- "type": "color"
- },
- "focused": {
- "value": "#b58900",
- "type": "color"
- }
- },
- "info": {
- "base": {
- "value": "#268bd2",
- "type": "color"
- },
- "hovered": {
- "value": "#268bd2",
- "type": "color"
- },
- "active": {
- "value": "#268bd2",
- "type": "color"
- },
- "focused": {
- "value": "#268bd2",
- "type": "color"
- }
- }
- },
- "border": {
- "primary": {
- "value": "#fdf6e3",
- "type": "color"
- },
- "secondary": {
- "value": "#eee8d5",
- "type": "color"
- },
- "muted": {
- "value": "#93a1a1",
- "type": "color"
- },
- "focused": {
- "value": "#93a1a1",
- "type": "color"
- },
- "active": {
- "value": "#93a1a1",
- "type": "color"
- },
- "ok": {
- "value": "#859900",
- "type": "color"
- },
- "error": {
- "value": "#dc322f",
- "type": "color"
- },
- "warning": {
- "value": "#b58900",
- "type": "color"
- },
- "info": {
- "value": "#268bd2",
- "type": "color"
- }
- },
- "editor": {
- "background": {
- "value": "#fdf6e3",
- "type": "color"
- },
- "indent_guide": {
- "value": "#93a1a1",
- "type": "color"
- },
- "indent_guide_active": {
- "value": "#eee8d5",
- "type": "color"
- },
- "line": {
- "active": {
- "value": "#002b3612",
- "type": "color"
- },
- "highlighted": {
- "value": "#002b361f",
- "type": "color"
- },
- "inserted": {
- "value": "#859900",
- "type": "color"
- },
- "deleted": {
- "value": "#dc322f",
- "type": "color"
- },
- "modified": {
- "value": "#268bd2",
- "type": "color"
- }
- },
- "highlight": {
- "selection": {
- "value": "#268bd23d",
- "type": "color"
- },
- "occurrence": {
- "value": "#8394961f",
- "type": "color"
- },
- "activeOccurrence": {
- "value": "#83949629",
- "type": "color"
- },
- "matchingBracket": {
- "value": "#eee8d5",
- "type": "color"
- },
- "match": {
- "value": "#6c71c480",
- "type": "color"
- },
- "activeMatch": {
- "value": "#6c71c4b3",
- "type": "color"
- },
- "related": {
- "value": "#eee8d5",
- "type": "color"
- }
- },
- "gutter": {
- "primary": {
- "value": "#657b83",
- "type": "color"
- },
- "active": {
- "value": "#002b36",
- "type": "color"
- }
- }
- },
- "syntax": {
- "primary": {
- "value": "#002b36",
- "type": "color"
- },
- "comment": {
- "value": "#073642",
- "type": "color"
- },
- "keyword": {
- "value": "#268bd2",
- "type": "color"
- },
- "function": {
- "value": "#b58900",
- "type": "color"
- },
- "type": {
- "value": "#2aa198",
- "type": "color"
- },
- "variant": {
- "value": "#268bd2",
- "type": "color"
- },
- "property": {
- "value": "#268bd2",
- "type": "color"
- },
- "enum": {
- "value": "#cb4b16",
- "type": "color"
- },
- "operator": {
- "value": "#cb4b16",
- "type": "color"
- },
- "string": {
- "value": "#cb4b16",
- "type": "color"
- },
- "number": {
- "value": "#859900",
- "type": "color"
- },
- "boolean": {
- "value": "#859900",
- "type": "color"
- }
- },
- "player": {
- "1": {
- "baseColor": {
- "value": "#268bd2",
- "type": "color"
- },
- "cursorColor": {
- "value": "#268bd2",
- "type": "color"
- },
- "selectionColor": {
- "value": "#268bd23d",
- "type": "color"
- },
- "borderColor": {
- "value": "#268bd2cc",
- "type": "color"
- }
- },
- "2": {
- "baseColor": {
- "value": "#859900",
- "type": "color"
- },
- "cursorColor": {
- "value": "#859900",
- "type": "color"
- },
- "selectionColor": {
- "value": "#8599003d",
- "type": "color"
- },
- "borderColor": {
- "value": "#859900cc",
- "type": "color"
- }
- },
- "3": {
- "baseColor": {
- "value": "#d33682",
- "type": "color"
- },
- "cursorColor": {
- "value": "#d33682",
- "type": "color"
- },
- "selectionColor": {
- "value": "#d336823d",
- "type": "color"
- },
- "borderColor": {
- "value": "#d33682cc",
- "type": "color"
- }
- },
- "4": {
- "baseColor": {
- "value": "#cb4b16",
- "type": "color"
- },
- "cursorColor": {
- "value": "#cb4b16",
- "type": "color"
- },
- "selectionColor": {
- "value": "#cb4b163d",
- "type": "color"
- },
- "borderColor": {
- "value": "#cb4b16cc",
- "type": "color"
- }
- },
- "5": {
- "baseColor": {
- "value": "#6c71c4",
- "type": "color"
- },
- "cursorColor": {
- "value": "#6c71c4",
- "type": "color"
- },
- "selectionColor": {
- "value": "#6c71c43d",
- "type": "color"
- },
- "borderColor": {
- "value": "#6c71c4cc",
- "type": "color"
- }
- },
- "6": {
- "baseColor": {
- "value": "#2aa198",
- "type": "color"
- },
- "cursorColor": {
- "value": "#2aa198",
- "type": "color"
- },
- "selectionColor": {
- "value": "#2aa1983d",
- "type": "color"
- },
- "borderColor": {
- "value": "#2aa198cc",
- "type": "color"
- }
- },
- "7": {
- "baseColor": {
- "value": "#dc322f",
- "type": "color"
- },
- "cursorColor": {
- "value": "#dc322f",
- "type": "color"
- },
- "selectionColor": {
- "value": "#dc322f3d",
- "type": "color"
- },
- "borderColor": {
- "value": "#dc322fcc",
- "type": "color"
- }
- },
- "8": {
- "baseColor": {
- "value": "#b58900",
- "type": "color"
- },
- "cursorColor": {
- "value": "#b58900",
- "type": "color"
- },
- "selectionColor": {
- "value": "#b589003d",
- "type": "color"
- },
- "borderColor": {
- "value": "#b58900cc",
- "type": "color"
- }
- }
- },
- "shadowAlpha": {
- "value": 0.32,
- "type": "number"
- }
}
}
\ No newline at end of file
diff --git a/styles/src/styleTree/workspace.ts b/styles/src/styleTree/workspace.ts
index 3deb18a2fb..609639c467 100644
--- a/styles/src/styleTree/workspace.ts
+++ b/styles/src/styleTree/workspace.ts
@@ -68,6 +68,10 @@ export default function workspace(theme: Theme) {
},
},
};
+ const shareIcon = {
+ margin: { top: 3, bottom: 2 },
+ cornerRadius: 6,
+ };
return {
background: backgroundColor(theme, 300),
@@ -112,8 +116,9 @@ export default function workspace(theme: Theme) {
avatarWidth: 18,
height: 32,
background: backgroundColor(theme, 100),
- shareIconColor: iconColor(theme, "secondary"),
- shareIconActiveColor: iconColor(theme, "feature"),
+ padding: {
+ left: 80,
+ },
title: text(theme, "sans", "primary"),
avatar: {
cornerRadius: 10,
@@ -141,9 +146,29 @@ export default function workspace(theme: Theme) {
right: 4,
},
},
+ shareIcon: {
+ ...shareIcon,
+ color: iconColor(theme, "secondary")
+ },
+ hoveredShareIcon: {
+ ...shareIcon,
+ background: backgroundColor(theme, 100, "hovered"),
+ color: iconColor(theme, "secondary"),
+ },
+ hoveredActiveShareIcon: {
+ ...shareIcon,
+ background: backgroundColor(theme, 100, "hovered"),
+ color: iconColor(theme, "active"),
+ },
+ activeShareIcon: {
+ ...shareIcon,
+ background: backgroundColor(theme, 100, "active"),
+ color: iconColor(theme, "active"),
+ },
outdatedWarning: {
...text(theme, "sans", "warning"),
size: 13,
+ margin: { right: 6 }
},
},
toolbar: {