diff --git a/assets/icons/a-large-small.svg b/assets/icons/a-large-small.svg
new file mode 100644
index 00000000..cfba2deb
--- /dev/null
+++ b/assets/icons/a-large-small.svg
@@ -0,0 +1 @@
+
diff --git a/crates/app/src/story_workspace.rs b/crates/app/src/story_workspace.rs
index 2bd2c383..755a0836 100644
--- a/crates/app/src/story_workspace.rs
+++ b/crates/app/src/story_workspace.rs
@@ -28,7 +28,10 @@ const MAIN_DOCK_AREA: DockAreaTab = DockAreaTab {
#[derive(Clone, PartialEq, Eq, Deserialize)]
struct SelectLocale(SharedString);
-impl_actions!(locale_switcher, [SelectLocale]);
+#[derive(Clone, PartialEq, Eq, Deserialize)]
+struct SelectFont(usize);
+
+impl_actions!(story, [SelectLocale, SelectFont]);
actions!(workspace, [Open, CloseWindow]);
@@ -43,6 +46,7 @@ pub struct StoryWorkspace {
theme_color: Option,
dock_area: View,
locale_selector: View,
+ font_size_selector: View,
theme_color_picker: View,
last_layout_state: Option,
_save_layout_task: Option>,
@@ -95,6 +99,7 @@ impl StoryWorkspace {
.detach();
let locale_selector = cx.new_view(LocaleSelector::new);
+ let font_size_selector = cx.new_view(FontSizeSelector::new);
let theme_color_picker = cx.new_view(|cx| {
let mut picker = ColorPicker::new("theme-color-picker", cx)
@@ -118,6 +123,7 @@ impl StoryWorkspace {
theme_color: None,
dock_area,
locale_selector,
+ font_size_selector,
theme_color_picker,
last_layout_state: None,
_save_layout_task: None,
@@ -325,13 +331,10 @@ impl Render for StoryWorkspace {
let notifications_count = cx.notifications().len();
div()
- .font_family(".SystemUIFont")
.relative()
.size_full()
.flex()
.flex_col()
- .bg(cx.theme().background)
- .text_color(cx.theme().foreground)
.child(
TitleBar::new()
// left side
@@ -358,6 +361,7 @@ impl Render for StoryWorkspace {
.on_click(cx.listener(Self::change_color_mode)),
)
.child(self.locale_selector.clone())
+ .child(self.font_size_selector.clone())
.child(
Button::new("github")
.icon(IconName::GitHub)
@@ -451,3 +455,44 @@ impl Render for LocaleSelector {
)
}
}
+
+struct FontSizeSelector {
+ focus_handle: FocusHandle,
+}
+
+impl FontSizeSelector {
+ pub fn new(cx: &mut ViewContext) -> Self {
+ Self {
+ focus_handle: cx.focus_handle(),
+ }
+ }
+
+ fn on_select(&mut self, font_size: &SelectFont, cx: &mut ViewContext) {
+ Theme::global_mut(cx).font_size = font_size.0 as f32;
+ cx.refresh();
+ }
+}
+
+impl Render for FontSizeSelector {
+ fn render(&mut self, cx: &mut ViewContext) -> impl IntoElement {
+ let focus_handle = self.focus_handle.clone();
+ let font_size = cx.theme().font_size as i32;
+
+ div()
+ .id("font-size-selector")
+ .track_focus(&focus_handle)
+ .on_action(cx.listener(Self::on_select))
+ .child(
+ Button::new("btn")
+ .small()
+ .ghost()
+ .icon(IconName::ALargeSmall)
+ .popup_menu(move |this, _| {
+ this.menu_with_check("Large", font_size == 18, Box::new(SelectFont(18)))
+ .menu_with_check("Default", font_size == 16, Box::new(SelectFont(16)))
+ .menu_with_check("Small", font_size == 14, Box::new(SelectFont(14)))
+ })
+ .anchor(AnchorCorner::TopRight),
+ )
+ }
+}
diff --git a/crates/ui/src/icon.rs b/crates/ui/src/icon.rs
index 96d9cb4b..36975b31 100644
--- a/crates/ui/src/icon.rs
+++ b/crates/ui/src/icon.rs
@@ -6,6 +6,7 @@ use gpui::{
#[derive(IntoElement, Clone)]
pub enum IconName {
+ ALargeSmall,
ArrowDown,
ArrowLeft,
ArrowRight,
@@ -68,6 +69,7 @@ pub enum IconName {
impl IconName {
pub fn path(self) -> SharedString {
match self {
+ IconName::ALargeSmall => "icons/a-large-small.svg",
IconName::ArrowDown => "icons/arrow-down.svg",
IconName::ArrowLeft => "icons/arrow-left.svg",
IconName::ArrowRight => "icons/arrow-right.svg",
diff --git a/crates/ui/src/root.rs b/crates/ui/src/root.rs
index 06786825..8f58eb7d 100644
--- a/crates/ui/src/root.rs
+++ b/crates/ui/src/root.rs
@@ -341,9 +341,14 @@ impl Root {
impl Render for Root {
fn render(&mut self, cx: &mut gpui::ViewContext) -> impl IntoElement {
+ let base_font_size = cx.theme().font_size;
+ cx.set_rem_size(base_font_size);
+
div()
.id("root")
.size_full()
+ .font_family(".SystemUIFont")
+ .bg(cx.theme().background)
.text_color(cx.theme().foreground)
.child(self.view.clone())
}
diff --git a/crates/ui/src/theme.rs b/crates/ui/src/theme.rs
index 5a8c6907..03985fa5 100644
--- a/crates/ui/src/theme.rs
+++ b/crates/ui/src/theme.rs
@@ -493,7 +493,7 @@ impl From for Theme {
Theme {
mode: ThemeMode::default(),
transparent: Hsla::transparent_black(),
- font_size: 14.0,
+ font_size: 16.0,
font_family: if cfg!(target_os = "macos") {
".SystemUIFont".into()
} else if cfg!(target_os = "windows") {
@@ -607,4 +607,14 @@ impl Theme {
cx.set_global(theme);
cx.refresh();
}
+
+ /// Returns the global theme reference
+ pub fn global(cx: &AppContext) -> &Theme {
+ cx.global::()
+ }
+
+ /// Returns the global theme mutable reference
+ pub fn global_mut(cx: &mut AppContext) -> &mut Theme {
+ cx.global_mut::()
+ }
}