ElnuDev/dyesub-tool
1
0
Fork 0
generated from ElnuDev/rust-project
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add close button to result component

Browse source
This commit is contained in:
Elnu 2023-08-21 15:05:21 -07:00
parent 77e31d9fff
commit e58fca9fa6
2 changed files with 17 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
dyesub-tool/index.html
View file

@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>dyesub-tool</title>
<link data-trunk rel="css" href="missing.min.css"> <!-- 1.0.9 -->
<style>:root { cursor: inherit } button, input[type="submit"] { cursor: pointer }</style>
</head>
<body>
<main>

22
dyesub-tool/src/main.rs
View file

@ -35,12 +35,22 @@ enum Colorway {
#[component]
fn ResultMessage(cx: Scope, message: ReadSignal<Option<ResultMessageData>>) -> impl IntoView {
move || message().map(|ResultMessageData { title, message, colorway }| view! { cx,
<div class=class_list!["box", <Colorway as Into<&str>>::into(colorway)]>
<h3>{title}</h3>
<p>{message}</p>
</div>
})
let (open, set_open) = create_signal(cx, true);
create_effect(cx, move |_| {
message.track();
set_open(true);
});
move || view! { cx,
<Show when=move || open() fallback=|_| ()>
{move || message().map(|ResultMessageData { title, message, colorway }| view! { cx,
<div class=class_list!["box", <Colorway as Into<&str>>::into(colorway)] style="position: relative">
<strong class="block titlebar">{title}</strong>
<button class="iconbutton" on:click=move |_| set_open(false) style="position: absolute; bottom: 0.5em; right: 0.5em">"×"</button>
<p>{message}</p>
</div>
})}
</Show>
}
}
#[derive(From, IntoStaticStr)]