admin/vibetorrent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 6 Wiki Activity

fix(toast): use proper DaisyUI alert structure with SVG icons

Browse Source
This commit is contained in:
spinline
2026-02-05 21:26:28 +03:00
parent 579be70a5a
commit 88b2dddba0
1 changed files with 29 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
frontend/src/components/toast.rs
View File

@@ -8,10 +8,10 @@ use shared::NotificationLevel;
/// Returns the DaisyUI alert class for the notification level /// Returns the DaisyUI alert class for the notification level
fn get_alert_class(level: &NotificationLevel) -> &'static str { fn get_alert_class(level: &NotificationLevel) -> &'static str {
match level { match level {
NotificationLevel::Info => "alert-info", NotificationLevel::Info => "alert alert-info",
NotificationLevel::Success => "alert-success", NotificationLevel::Success => "alert alert-success",
NotificationLevel::Warning => "alert-warning", NotificationLevel::Warning => "alert alert-warning",
NotificationLevel::Error => "alert-error", NotificationLevel::Error => "alert alert-error",
} }
} }
@@ -23,20 +23,34 @@ fn ToastItem(
) -> impl IntoView { ) -> impl IntoView {
let alert_class = get_alert_class(&level); let alert_class = get_alert_class(&level);
let icon = match level { // DaisyUI SVG icons
NotificationLevel::Info => "ℹ️", let icon_svg = match level {
NotificationLevel::Success => "✓", NotificationLevel::Info => view! {
NotificationLevel::Warning => "⚠️", <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="stroke-current shrink-0 w-6 h-6">
NotificationLevel::Error => "✕", <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
}.into_view(),
NotificationLevel::Success => view! {
<svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
}.into_view(),
NotificationLevel::Warning => view! {
<svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path>
</svg>
}.into_view(),
NotificationLevel::Error => view! {
<svg xmlns="http://www.w3.org/2000/svg" class="stroke-current shrink-0 h-6 w-6" fill="none" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
}.into_view(),
}; };
view! { view! {
<div <div class=alert_class>
class={format!("alert {} shadow-xl", alert_class)} {icon_svg}
style="min-width: 200px; max-width: calc(100vw - 40px); padding: 12px 16px;" <span>{message}</span>
>
<span style="font-size: 18px;">{icon}</span>
<span style="font-size: 14px; font-weight: 500;">{message}</span>
</div> </div>
} }
} }