yggdrasil/components/skeletons/
friends_skeleton.rs

1//! 与友链页同尺寸的静态占位；由 DelayedSkeleton 统一控制加载提示。
2
3use dioxus::prelude::*;
4
5#[component]
6pub fn FriendsSkeleton(#[props(default = true)] with_header: bool) -> Element {
7    rsx! {
8        div { class: "friends-skeleton", role: "status", aria_label: "正在加载友链",
9            div { aria_hidden: "true",
10                if with_header {
11                    div { class: "friends-intro friends-skeleton-intro",
12                        div { class: "friends-skeleton-line w-40 h-3" }
13                        div { class: "friends-skeleton-line w-32 h-14" }
14                        div { class: "friends-skeleton-line w-64 max-w-full h-5" }
15                    }
16                }
17                div { class: "friends-section-heading",
18                    div { class: "friends-skeleton-line w-28 h-5" }
19                }
20                div { class: "friends-grid",
21                    for i in 0..4 {
22                        div { key: "{i}", class: "friend-card friends-skeleton-card",
23                            div { class: "friends-skeleton-line w-13 h-13 rounded-2xl" }
24                            div { class: "friends-skeleton-line w-36 h-5 mt-5" }
25                            div { class: "friends-skeleton-line w-full h-4 mt-3" }
26                            div { class: "friends-skeleton-line w-2/3 h-4 mt-2" }
27                            div { class: "friends-skeleton-line w-24 h-3 mt-auto" }
28                        }
29                    }
30                }
31            }
32        }
33    }
34}
yggdrasil/components/skeletons/friends_skeleton.rs

yggdrasil/components/skeletons/
friends_skeleton.rs
