web: successfully rewrite some bits in tailwind

This commit is contained in:
2024-09-29 17:15:28 -07:00
parent 17da489229
commit 4f21814be0
2 changed files with 128 additions and 210 deletions

View File

@@ -433,7 +433,7 @@ fn render_avatar(avatar: Option<String>, from: &str) -> Node<Msg> {
style! {
St::Display => "block",
St::FontFamily => "Poppins",
St::FontSize => pt(32),
St::FontSize => pt(28),
},
g![
rect![attrs! {
@@ -451,7 +451,6 @@ fn render_avatar(avatar: Option<String>, from: &str) -> Node<Msg> {
text![
attrs! {
At::Fill => "white",
At::X => percent(50),
At::Y => percent(50),
At::DominantBaseline => "middle",
@@ -491,168 +490,84 @@ fn render_open_header(msg: &ShowThreadQueryThreadOnEmailThreadMessages) -> Node<
let id = msg.id.clone();
let is_unread = has_unread(&msg.tags);
let img = render_avatar(avatar, &from);
div![
figure![
C!["flex"],
div![C!["w-16", "h-16", "mx-auto", "h-auto"], &img],
div![
C!["px-4"],
&from,
" ",
from_detail.as_ref().map(|text| copy_text_widget(&text)),
IF!(!msg.to.is_empty() =>div![
"To: ",
msg.to.iter().map(|to| {
let ShowThreadQueryThreadOnEmailThreadMessagesTo { name, addr } = to;
span![
C!["text-nowrap"],
&name,
" ",
span![
i![C!["far", "fa-clone"]],
addr.clone().map(|addr| ev(Ev::Click, move |e| {
e.stop_propagation();
Msg::CopyToClipboard(addr)
}))
],
" "
]
})]),
IF!(!msg.cc.is_empty() =>div![
"CC: ",
msg.cc.iter().map(|cc| {
let ShowThreadQueryThreadOnEmailThreadMessagesCc { name, addr } = cc;
span![
C!["text-nowrap"],
&name,
" ",
span![
i![C!["far", "fa-clone"]],
addr.clone().map(|addr| ev(Ev::Click, move |e| {
e.stop_propagation();
Msg::CopyToClipboard(addr)
}))
],
" "
]
})]),
msg.timestamp.map(|ts| span![C!["header"], human_age(ts)]),
div![figure![
C!["flex"],
div![C!["w-16", "h-16", "mx-auto", "h-auto"], &img],
div![
C!["px-4"],
span![C!["font-semibold"], &from],
" ",
from_detail.as_ref().map(|text| copy_text_widget(&text)),
IF!(!msg.to.is_empty() =>div![
C!["text-xs"],
span![
C!["read-status"],
i![C![
"far",
if is_unread {
"fa-envelope"
} else {
"fa-envelope-open"
},
]],
{
// TODO remove clone and code block when removing article![] below
let id = id.clone();
ev(Ev::Click, move |e| {
e.stop_propagation();
Msg::SetUnread(id, !is_unread)
})
}
C!["font-semibold"],
"To: "
],
span![
msg.to.iter().map(|to| {
let ShowThreadQueryThreadOnEmailThreadMessagesTo { name, addr } = to;
span![
&name,
" ",
span![
i![C!["far", "fa-clone"]],
addr.clone().map(|addr| ev(Ev::Click, move |e| {
e.stop_propagation();
Msg::CopyToClipboard(addr)
}))
],
" "
]
})
]
]
],
hr![],
article![
C!["media"],
figure![C!["media-left"], p![C!["image", "is-64x64"], img]],
div![
C!["media-content"],
div![
C!["content"],
p![
//C!["text-nowrap"],
strong![from],
" ",
from_detail.map(|text| copy_text_widget(&text)),
table![
IF!(!msg.to.is_empty() =>
tr![
td![ "To:" ],
//td![ if i==0 { "To" }else { "" } ],
td![
msg.to.iter().map(|to|
small![
" ",
{
let ShowThreadQueryThreadOnEmailThreadMessagesTo{name, addr} = to;
span![
//C!["text-nowrap"],
&name, " ",
span![
i![C!["far", "fa-clone"]],
addr.clone().map(|addr| ev(Ev::Click,
move |e| {
e.stop_propagation();
Msg::CopyToClipboard(addr)
}
))
]
]
}
])
]
]),
IF!(!msg.cc.is_empty() =>
tr![
td![ "CC:" ],
td![
msg.cc.iter().map(|cc|
small![
" ",
{
let ShowThreadQueryThreadOnEmailThreadMessagesCc{name, addr} = cc;
span![
//C!["text-nowrap"],
&name, " ",
span![
i![C!["far", "fa-clone"]],
addr.clone().map(|addr| ev(Ev::Click,
move |e| {
e.stop_propagation();
Msg::CopyToClipboard(addr)
}
))
]
]
}
])
]
]),
tr![td![
attrs! {At::ColSpan=>2},
msg.timestamp.map(|ts| span![C!["header"], human_age(ts)])
]]
],
],
],
],
div![
C!["media-right"],
]),
IF!(!msg.cc.is_empty() =>div![
C!["text-xs"],
span![
C!["read-status"],
i![C![
"far",
if is_unread {
"fa-envelope"
} else {
"fa-envelope-open"
},
]]
C!["font-semibold"],
"CC: "
],
span![
msg.cc.iter().map(|cc| {
let ShowThreadQueryThreadOnEmailThreadMessagesCc { name, addr } = cc;
span![
&name,
" ",
span![
i![C!["far", "fa-clone"]],
addr.clone().map(|addr| ev(Ev::Click, move |e| {
e.stop_propagation();
Msg::CopyToClipboard(addr)
}))
],
" "
]
})
]
]),
msg.timestamp.map(|ts| span![C!["header"], human_age(ts)]),
],
span![
C!["m-4", "read-status"],
i![C![
"far",
if is_unread {
"fa-envelope"
} else {
"fa-envelope-open"
},
]],
{
// TODO remove clone and code block when removing article![] below
let id = id.clone();
ev(Ev::Click, move |e| {
e.stop_propagation();
Msg::SetUnread(id, !is_unread)
})
]
}
]
]
],]
}
fn render_closed_header(msg: &ShowThreadQueryThreadOnEmailThreadMessages) -> Node<Msg> {
@@ -671,62 +586,69 @@ fn render_closed_header(msg: &ShowThreadQueryThreadOnEmailThreadMessages) -> Nod
let id = msg.id.clone();
let is_unread = has_unread(&msg.tags);
let img = render_avatar(avatar, &from);
article![
C!["media"],
figure![C!["media-left"], p![C!["image", "is-64x64"], img]],
div![figure![
C!["flex"],
div![C!["w-16", "h-16", "mx-auto", "h-auto"], &img],
div![
C!["media-content"],
div![
C!["content"],
p![
strong![from],
br![],
IF!(!msg.to.is_empty() =>
nodes![
small![" to "],
msg.to.iter().enumerate().map(|(i, to)| small![
if i > 0 { ", " } else { "" },
to.name()
.as_ref()
.unwrap_or(&to.addr().unwrap_or("(UNKNOWN)"))
]).collect::<Vec<_>>()
]),
IF!(!msg.cc.is_empty() =>
nodes![
small![" cc "],
msg.cc.iter().enumerate().map(|(i, cc)| small![
if i > 0 { ", " } else { "" },
cc.name()
.as_ref()
.unwrap_or(&cc.addr().unwrap_or("(UNKNOWN)"))
]).collect::<Vec<_>>()
]),
br![],
msg.timestamp.map(|ts| span![C!["header"], human_age(ts)]),
C!["px-4"],
span![C!["font-semibold"], &from],
" ",
IF!(!msg.to.is_empty() =>div![
C!["text-xs"],
span![
C!["font-semibold"],
"To: "
],
],
span![
msg.to.iter().enumerate().map(|(i, to)| {
let ShowThreadQueryThreadOnEmailThreadMessagesTo { name, addr } = to;
span![
if i > 0 { ", " } else { "" },
&name,
]
})
]
]),
IF!(!msg.cc.is_empty() =>div![
C!["text-xs"],
span![
C!["font-semibold"],
"CC: "
],
span![
msg.cc.iter().enumerate().map(|(i, cc)| {
let ShowThreadQueryThreadOnEmailThreadMessagesCc { name, addr } = cc;
span![
if i > 0 { ", " } else { "" },
&name,
]
})
]
]),
msg.timestamp.map(|ts| span![C!["header"], human_age(ts)]),
],
div![
C!["media-right"],
span![
C!["read-status"],
i![
C![
"far",
if is_unread {
"fa-envelope"
} else {
"fa-envelope-open"
},
],
div![span![
C!["m-4", "read-status"],
i![
C![
"far",
if is_unread {
"fa-envelope"
} else {
"fa-envelope-open"
},
],
{
// TODO remove clone and code block when removing article![] below
let id = id.clone();
ev(Ev::Click, move |e| {
e.stop_propagation();
Msg::SetUnread(id, !is_unread)
})
]
}
]
]
]
]]
],]
}
fn message_render(msg: &ShowThreadQueryThreadOnEmailThreadMessages, open: bool) -> Node<Msg> {