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

Add close button to result component

Browse Source
main
Elnu 1 year ago
parent 77e31d9fff
commit e58fca9fa6
2 changed files with 17 additions and 6 deletions
Show Stats Download Patch File Download Diff File

1
dyesub-tool/index.html
Unescape View File

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

22
dyesub-tool/src/main.rs
Unescape View File

@ -35,12 +35,22 @@ enum Colorway {
#[component] #[component]
fn ResultMessage(cx: Scope, message: ReadSignal<Option<ResultMessageData>>) -> impl IntoView { fn ResultMessage(cx: Scope, message: ReadSignal<Option<ResultMessageData>>) -> impl IntoView {
move || message().map(|ResultMessageData { title, message, colorway }| view! { cx, let (open, set_open) = create_signal(cx, true);
<div class=class_list!["box", <Colorway as Into<&str>>::into(colorway)]> create_effect(cx, move |_| {
<h3>{title}</h3> message.track();
<p>{message}</p> set_open(true);
</div> });
}) 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)] #[derive(From, IntoStaticStr)]

Write Preview
Loading…
Cancel
Save