diff --git a/web/src/view/mod.rs b/web/src/view/mod.rs index 0d8746b..2faa0d5 100644 --- a/web/src/view/mod.rs +++ b/web/src/view/mod.rs @@ -21,6 +21,8 @@ use crate::{ const MAX_RAW_MESSAGE_SIZE: usize = 100_000; mod tw_classes { + use seed::{prelude::*, *}; + pub const TAG: &[&str] = &[ "rounded-md", "px-2", @@ -37,22 +39,30 @@ mod tw_classes { "text-xs", "[text-shadow:_0_1px_0_rgb(0_0_0_/_40%)]", ]; - pub const BUTTON: &[&str] = &[ - "bg-neutral-900", - "rounded-md", - "p-2", - "border", - "border-neutral-700", - "text-center", - "text-sm", - "transition-all", - "shadow-md", - "hover:shadow-lg", - "hover:bg-neutral-700", - "disabled:pointer-events-none", - "disabled:opacity-50", - "disabled:shadow-none", - ]; + + // TODO: should this be a builder pattern? + pub fn button() -> seed::Attrs { + button_with_color("bg-neutral-900", "hover:bg-neutral-700") + } + + pub fn button_with_color(bg: T, hover: T) -> seed::Attrs { + C![ + "rounded-md", + "p-2", + "border", + "border-neutral-700", + "text-center", + "text-sm", + "transition-all", + "shadow-md", + "hover:shadow-lg", + "disabled:pointer-events-none", + "disabled:opacity-50", + "disabled:shadow-none", + bg, + hover, + ] + } pub const CHECKBOX: &[&str] = &[ "w-8", @@ -216,13 +226,13 @@ fn catchup_view( "bg-black", ], button![ - C![&tw_classes::BUTTON], + tw_classes::button(), span![i![C!["far", "fa-envelope"]]], span![C!["pl-2"], "Keep unread"], ev(Ev::Click, move |_| Msg::CatchupKeepUnread) ], button![ - C![&tw_classes::BUTTON, "bg-green-500"], + tw_classes::button_with_color("bg-green-800", "hover:bg-neutral-700"), span![i![C!["far", "fa-envelope-open"]]], span![C!["pl-2"], "Mark as read"], ev(Ev::Click, move |_| Msg::CatchupMarkAsRead) @@ -447,7 +457,7 @@ fn search_toolbar( div![ C!["gap-2", "flex", IF!(show_bulk_edit => "hidden")], div![button![ - C![&tw_classes::BUTTON], + tw_classes::button(), attrs! {At::Title => "Mark as read"}, span![i![C!["far", "fa-eye"]]], span![C!["pl-2", "hidden", "md:inline"], "Catch-up"], @@ -476,14 +486,16 @@ fn search_toolbar( ], div![ button![ - C![&tw_classes::BUTTON, "rounded-r-none"], + tw_classes::button(), + C!["rounded-r-none"], attrs! {At::Title => "Mark as read"}, span![i![C!["far", "fa-envelope-open"]]], span![C!["pl-2", "hidden", "md:inline"], "Read"], ev(Ev::Click, |_| Msg::SelectionMarkAsRead) ], button![ - C![&tw_classes::BUTTON, "rounded-l-none"], + tw_classes::button(), + C!["rounded-l-none"], attrs! {At::Title => "Mark as unread"}, span![i![C!["far", "fa-envelope"]]], span![C!["pl-2", "hidden", "md:inline"], "Unread"], @@ -491,7 +503,8 @@ fn search_toolbar( ] ], div![button![ - C![&tw_classes::BUTTON, "text-red-500"], + tw_classes::button(), + C!["text-red-500"], attrs! {At::Title => "Mark as spam"}, span![i![C!["far", "fa-hand"]]], span![C!["pl-2", "hidden", "md:inline"], "Spam"], @@ -505,13 +518,13 @@ fn search_toolbar( C!["flex", "gap-2", "items-center"], p![format!("{count} results")], button![ - C![&tw_classes::BUTTON], + tw_classes::button(), IF!(!pager.has_previous_page => attrs!{ At::Disabled=>true }), "<", IF!(pager.has_previous_page => ev(Ev::Click, |_| Msg::PreviousPage)), ], button![ - C![&tw_classes::BUTTON], + tw_classes::button(), IF!(!pager.has_next_page => attrs!{ At::Disabled=>true }), ">", IF!(pager.has_next_page => ev(Ev::Click, |_| Msg::NextPage)) @@ -1076,7 +1089,8 @@ fn thread( C!["pt-4", "gap-2", "flex", "justify-around"], div![ button![ - C![&tw_classes::BUTTON, "rounded-r-none"], + tw_classes::button(), + C!["rounded-r-none"], attrs! {At::Title => "Mark as read"}, span![i![C!["far", "fa-envelope-open"]]], span![C!["pl-2"], "Read"], @@ -1086,7 +1100,8 @@ fn thread( ])), ], button![ - C![&tw_classes::BUTTON, "rounded-l-none"], + tw_classes::button(), + C!["rounded-l-none"], attrs! {At::Title => "Mark as unread"}, span![i![C!["far", "fa-envelope"]]], span![C!["pl-2"], "Unread"], @@ -1097,7 +1112,8 @@ fn thread( ], ], div![button![ - C![&tw_classes::BUTTON, "text-red-500"], + tw_classes::button(), + C!["text-red-500"], attrs! {At::Title => "Spam"}, span![i![C!["far", "fa-hand"]]], span![C!["pl-2"], "Spam"], @@ -1163,7 +1179,7 @@ fn view_header( C!["flex", "px-4", "pt-4", "overflow-hidden"], a![ C![IF![is_error => "bg-red-500"], "rounded-r-none"], - C![&tw_classes::BUTTON], + tw_classes::button(), span![i![C![ "fa-solid", "fa-arrow-rotate-right", @@ -1172,7 +1188,7 @@ fn view_header( ev(Ev::Click, |_| Msg::RefreshStart), ], a![ - C![&tw_classes::BUTTON], + tw_classes::button(), C!["px-4", "rounded-none"], attrs! { At::Href => urls::search(unread_query(), 0) @@ -1180,7 +1196,7 @@ fn view_header( "Unread", ], a![ - C![&tw_classes::BUTTON], + tw_classes::button(), C!["px-4", "rounded-none"], attrs! { At::Href => urls::search("", 0) @@ -1367,7 +1383,8 @@ fn news_post(post: &ShowThreadQueryThreadOnNewsPost, content_el: &ElRef "Mark as read"}, span![i![C!["far", "fa-envelope-open"]]], span![C!["pl-2"], "Read"], @@ -1377,7 +1394,8 @@ fn news_post(post: &ShowThreadQueryThreadOnNewsPost, content_el: &ElRef "Mark as unread"}, span![i![C!["far", "fa-envelope"]]], span![C!["pl-2"], "Unread"], @@ -1452,7 +1470,7 @@ fn render_news_post_header(post: &ShowThreadQueryThreadOnNewsPost) -> Node div![ C!["flex", "gap-2", "pt-2", "text-sm"], a![ - C![&tw_classes::BUTTON], + tw_classes::button(), attrs! { At::Href => post.url, At::Target => "_blank", @@ -1461,7 +1479,7 @@ fn render_news_post_header(post: &ShowThreadQueryThreadOnNewsPost) -> Node i![C!["fas", "fa-up-right-from-square"]], ], a![ - C![&tw_classes::BUTTON], + tw_classes::button(), attrs! { At::Href => add_archive_url, At::Target => "_blank", @@ -1470,7 +1488,7 @@ fn render_news_post_header(post: &ShowThreadQueryThreadOnNewsPost) -> Node i![C!["fas", "fa-plus"]], ], a![ - C![&tw_classes::BUTTON], + tw_classes::button(), attrs! { At::Href => view_archive_url, At::Target => "_blank", @@ -1537,7 +1555,8 @@ pub fn view_versions(versions: &Version) -> Node { fn click_to_top() -> Node { button![ - C![&tw_classes::BUTTON, "bg-red-500", "lg:m-0", "m-4"], + tw_classes::button_with_color("bg-red-500", "hover:bg-neutral-700"), + C!["lg:m-0", "m-4"], span!["Top"], span![i![C!["fas", "fa-arrow-turn-up"]]], ev(Ev::Click, |_| Msg::ScrollToTop)