diff --git a/src/components/write_skeleton.rs b/src/components/write_skeleton.rs index 9322fa8..641d6de 100644 --- a/src/components/write_skeleton.rs +++ b/src/components/write_skeleton.rs @@ -1,15 +1,15 @@ //! 文章编辑器页骨架屏 //! //! 在写文章/编辑文章页面加载时展示,镜像 Write 页面的左右两栏结构: -//! 左栏(标题+摘要+编辑器) + 右栏(链接/标签/封面) + 底部操作栏。 +//! 左栏(标题+编辑器) + 右栏(链接/标签/摘要/封面) + 底部操作栏。 use crate::components::skeletons::atoms::*; use dioxus::prelude::*; /// 文章编辑器页骨架屏组件。 /// -/// 镜像 Write 页面的左右两栏布局:左栏主写作区(标题、摘要、编辑器), -/// 右栏侧边栏(链接、标签、封面图),底部贴底操作栏。 +/// 镜像 Write 页面的左右两栏布局:左栏主写作区(标题、编辑器), +/// 右栏侧边栏(链接、标签、摘要、封面图),底部贴底操作栏。 #[component] pub fn WriteSkeleton() -> Element { rsx! { @@ -22,8 +22,6 @@ pub fn WriteSkeleton() -> Element { div { class: "flex-1 min-w-0 min-h-0 overflow-y-auto px-6 py-8 flex flex-col", // 标题输入 SkeletonBox { class: "h-10 w-3/4 rounded-lg" } - // 摘要 - SkeletonBox { class: "h-5 w-full rounded mt-6" } // 编辑器区域:flex-1 撑满左栏剩余高度 div { class: "flex-1 min-h-[400px] flex flex-col my-4", @@ -60,6 +58,11 @@ pub fn WriteSkeleton() -> Element { SkeletonBox { class: "h-3 w-10 rounded mb-3" } SkeletonBox { class: "h-8 w-full rounded-xl" } } + // 摘要节 + div { class: "p-6 border-b border-[var(--color-paper-border)]", + SkeletonBox { class: "h-3 w-10 rounded mb-3" } + SkeletonBox { class: "h-16 w-full rounded-xl" } + } // 封面图节 div { class: "p-6", SkeletonBox { class: "h-3 w-12 rounded mb-3" } diff --git a/src/pages/admin/write.rs b/src/pages/admin/write.rs index 8349d1b..7b83816 100644 --- a/src/pages/admin/write.rs +++ b/src/pages/admin/write.rs @@ -430,15 +430,6 @@ fn write_editor(post_id: Option) -> Element { oninput: move |evt| title.set(evt.value()), } - // 摘要 - textarea { - class: "w-full text-base font-normal bg-transparent text-[var(--color-paper-secondary)] placeholder-[var(--color-paper-tertiary)] focus:outline-none resize-none leading-relaxed mb-4 border-b-2 border-transparent focus:border-[var(--color-paper-border)] pb-2 transition-all mt-6", - placeholder: "摘要(选填)...", - rows: "2", - value: "{summary}", - oninput: move |evt| summary.set(evt.value()), - } - // 错误和成功提示 if let Some(err) = load_error() { div { class: "flex-shrink-0 px-4 py-2 bg-red-50 dark:bg-red-900/20 text-red-600 dark:text-red-400 rounded-xl text-sm border border-red-100 dark:border-red-900/30 mb-2", @@ -518,6 +509,17 @@ fn write_editor(post_id: Option) -> Element { oninput: move |evt| tags.set(evt.value()), } } + // 摘要节 + div { class: "p-6 border-b border-[var(--color-paper-border)]", + label { class: "block text-xs font-semibold uppercase tracking-wide text-[var(--color-paper-tertiary)] mb-3", "摘要" } + textarea { + class: "w-full text-sm bg-[var(--color-paper-entry)] text-[var(--color-paper-primary)] placeholder-[var(--color-paper-tertiary)] focus:outline-none border border-[var(--color-paper-border)] focus:border-[var(--color-paper-primary)] rounded-xl px-3 py-2 transition-all resize-none leading-relaxed", + placeholder: "选填...", + rows: "3", + value: "{summary}", + oninput: move |evt| summary.set(evt.value()), + } + } // 封面图节 div { class: "p-6", label { class: "block text-xs font-semibold uppercase tracking-wide text-[var(--color-paper-tertiary)] mb-3", "封面图" }