web: don't show text on action icons on tablet/mobile

web/src/view/desktop.rs

@@ -9,20 +9,28 @@ use crate::{
 
 #[topo::nested]
 pub(super) fn view(model: &Model) -> Node<Msg> {
+    let show_icon_text = true;
     // Do two queries, one without `unread` so it loads fast, then a second with unread.
     let content = match &model.context {
         Context::None => div![h1!["Loading"]],
         Context::ThreadResult {
             thread,
             open_messages,
-        } => view::thread(thread, open_messages),
+        } => view::thread(thread, open_messages, show_icon_text),
         Context::SearchResult {
             query,
             results,
             count,
             pager,
             selected_threads,
-        } => view_search_results(&query, results.as_slice(), *count, pager, selected_threads),
+        } => view_search_results(
+            &query,
+            results.as_slice(),
+            *count,
+            pager,
+            selected_threads,
+            show_icon_text,
+        ),
     };
     fn view_tag_li(display_name: &str, indent: usize, t: &Tag, search_unread: bool) -> Node<Msg> {
         let href = if search_unread {

web/src/view/mobile.rs

@@ -10,19 +10,27 @@ use crate::{
 };
 
 pub(super) fn view(model: &Model) -> Node<Msg> {
+    let show_icon_text = false;
     let content = match &model.context {
         Context::None => div![h1!["Loading"]],
         Context::ThreadResult {
             thread,
             open_messages,
-        } => view::thread(thread, open_messages),
+        } => view::thread(thread, open_messages, show_icon_text),
         Context::SearchResult {
             query,
             results,
             count,
             pager,
             selected_threads,
-        } => search_results(&query, results.as_slice(), *count, pager, selected_threads),
+        } => search_results(
+            &query,
+            results.as_slice(),
+            *count,
+            pager,
+            selected_threads,
+            show_icon_text,
+        ),
     };
     div![
         view_header(&model.query, &model.refreshing_state),
@@ -37,6 +45,7 @@ fn search_results(
     count: usize,
     pager: &FrontPageQuerySearchPageInfo,
     selected_threads: &HashSet<String>,
+    show_icon_text: bool,
 ) -> Node<Msg> {
     if query.is_empty() {
         set_title("all mail");
@@ -96,8 +105,8 @@ fn search_results(
     let show_bulk_edit = !selected_threads.is_empty();
     div![
         C!["search-results"],
-        search_toolbar(count, pager, show_bulk_edit),
+        search_toolbar(count, pager, show_bulk_edit, show_icon_text),
         div![C!["index"], rows],
-        search_toolbar(count, pager, show_bulk_edit),
+        search_toolbar(count, pager, show_bulk_edit, show_icon_text),
     ]
 }

web/src/view/mod.rs

@@ -116,6 +116,7 @@ fn view_search_results(
     count: usize,
     pager: &FrontPageQuerySearchPageInfo,
     selected_threads: &HashSet<String>,
+    show_icon_text: bool,
 ) -> Node<Msg> {
     if query.is_empty() {
         set_title("all mail");
@@ -203,7 +204,7 @@ fn view_search_results(
 
     div![
         C!["search-results"],
-        search_toolbar(count, pager, show_bulk_edit),
+        search_toolbar(count, pager, show_bulk_edit, show_icon_text),
         table![
             C![
                 "table",
@@ -239,7 +240,7 @@ fn view_search_results(
             ]],
             tbody![rows]
         ],
-        search_toolbar(count, pager, show_bulk_edit)
+        search_toolbar(count, pager, show_bulk_edit, show_icon_text)
     ]
 }
 
@@ -247,6 +248,7 @@ fn search_toolbar(
     count: usize,
     pager: &FrontPageQuerySearchPageInfo,
     show_bulk_edit: bool,
+    show_icon_text: bool,
 ) -> Node<Msg> {
     let start = pager
         .start_cursor
@@ -254,7 +256,7 @@ fn search_toolbar(
         .map(|i| i.parse().unwrap_or(0))
         .unwrap_or(0);
     nav![
-        C!["level"],
+        C!["level", "is-mobile"],
         IF!(show_bulk_edit =>
             div![
                 C!["level-left"],
@@ -262,10 +264,10 @@ fn search_toolbar(
                     C!["level-item"],
                     div![C!["buttons", "has-addons"],
                     button![
-                        C!["button","spam"],
+                        C!["button", "spam"],
                         attrs!{At::Title => "Mark as spam"},
                         span![C!["icon", "is-small"], i![C!["far", "fa-hand"]]],
-                        span!["Spam"],
+                        IF!(show_icon_text=>span!["Spam"]),
                         ev(Ev::Click, |_| Msg::SelectionAddTag("Spam".to_string()))
                     ],
                     ],
@@ -274,17 +276,17 @@ fn search_toolbar(
                     C!["level-item"],
                     div![C!["buttons", "has-addons"],
                     button![
-                        C!["button","mark-read"],
+                        C!["button", "mark-read"],
                         attrs!{At::Title => "Mark as read"},
                         span![C!["icon", "is-small"], i![C!["far", "fa-envelope-open"]]],
-                        span!["Read"],
+                        IF!(show_icon_text=>span!["Read"]),
                         ev(Ev::Click, |_| Msg::SelectionMarkAsRead)
                     ],
                     button![
-                        C!["button","mark-unread"],
+                        C!["button", "mark-unread"],
                         attrs!{At::Title => "Mark as unread"},
                         span![C!["icon", "is-small"], i![C!["far", "fa-envelope"]]],
-                        span!["Unread"],
+                        IF!(show_icon_text=>span!["Unread"]),
                         ev(Ev::Click, |_| Msg::SelectionMarkAsUnread)
                     ]
                 ]
@@ -710,7 +712,11 @@ fn message_render(msg: &ShowThreadQueryThreadMessages, open: bool) -> Node<Msg>
 }
 
 #[topo::nested]
-fn thread(thread: &ShowThreadQueryThread, open_messages: &HashSet<String>) -> Node<Msg> {
+fn thread(
+    thread: &ShowThreadQueryThread,
+    open_messages: &HashSet<String>,
+    show_icon_text: bool,
+) -> Node<Msg> {
     // TODO(wathiede): show per-message subject if it changes significantly from top-level subject
     let subject = if thread.subject.is_empty() {
         "(no subject)"
@@ -740,7 +746,7 @@ fn thread(thread: &ShowThreadQueryThread, open_messages: &HashSet<String>) -> No
         h3![C!["is-size-5"], subject],
         span![C!["tags"], tags_chiclet(&tags, false)],
         div![
-            C!["level"],
+            C!["level", "is-mobile"],
             div![
                 C!["level-item"],
                 div![
@@ -749,7 +755,7 @@ fn thread(thread: &ShowThreadQueryThread, open_messages: &HashSet<String>) -> No
                         C!["button", "spam"],
                         attrs! {At::Title => "Spam"},
                         span![C!["icon", "is-small"], i![C!["far", "fa-hand"]]],
-                        span!["Spam"],
+                        IF!(show_icon_text=>span!["Spam"]),
                         ev(Ev::Click, move |_| Msg::AddTag(
                             format!("thread:{spam_thread_id}"),
                             "Spam".to_string()
@@ -765,7 +771,7 @@ fn thread(thread: &ShowThreadQueryThread, open_messages: &HashSet<String>) -> No
                         C!["button", "mark-read"],
                         attrs! {At::Title => "Mark as read"},
                         span![C!["icon", "is-small"], i![C!["far", "fa-envelope-open"]]],
-                        span!["Read"],
+                        IF!(show_icon_text=>span!["Read"]),
                         ev(Ev::Click, move |_| Msg::SetUnread(
                             format!("thread:{read_thread_id}"),
                             false
@@ -775,7 +781,7 @@ fn thread(thread: &ShowThreadQueryThread, open_messages: &HashSet<String>) -> No
                         C!["button", "mark-unread"],
                         attrs! {At::Title => "Mark as unread"},
                         span![C!["icon", "is-small"], i![C!["far", "fa-envelope"]]],
-                        span!["Unread"],
+                        IF!(show_icon_text=>span!["Unread"]),
                         ev(Ev::Click, move |_| Msg::SetUnread(
                             format!("thread:{unread_thread_id}"),
                             true

web/src/view/tablet.rs

@@ -6,20 +6,28 @@ use crate::{
 };
 
 pub(super) fn view(model: &Model) -> Node<Msg> {
+    let show_icon_text = false;
     // Do two queries, one without `unread` so it loads fast, then a second with unread.
     let content = match &model.context {
         Context::None => div![h1!["Loading"]],
         Context::ThreadResult {
             thread,
             open_messages,
-        } => view::thread(thread, open_messages),
+        } => view::thread(thread, open_messages, show_icon_text),
         Context::SearchResult {
             query,
             results,
             count,
             pager,
             selected_threads,
-        } => view_search_results(&query, results.as_slice(), *count, pager, selected_threads),
+        } => view_search_results(
+            &query,
+            results.as_slice(),
+            *count,
+            pager,
+            selected_threads,
+            show_icon_text,
+        ),
     };
     div![
         C!["main-content"],