Files
jiang13-bbs/frontend/components/admin/AdminSettingRow.tsx

37 lines
1.1 KiB
TypeScript

import type { ReactNode } from "react";
/** 「标题 + 说明 | 控件」一行,设置页与内容策略共用 */
export default function AdminSettingRow({
title,
description,
control,
children,
}: {
title: ReactNode;
description?: ReactNode;
control?: ReactNode;
/** 展开区(如阈值输入),画在分隔线下方 */
children?: ReactNode;
}) {
return (
<div className="panel p-4 sm:p-5">
<div className="flex items-start justify-between gap-4 flex-wrap">
<div className="min-w-0 flex-1">
<h2 className="text-[15px] font-semibold flex items-center gap-1.5" style={{ color: "var(--ink)" }}>
{title}
</h2>
{description != null && description !== "" && (
<p className="meta text-[12.5px] mt-1 leading-relaxed">{description}</p>
)}
</div>
{control != null && <div className="shrink-0">{control}</div>}
</div>
{children != null && (
<div className="mt-4 pt-4" style={{ borderTop: "1px solid var(--line)" }}>
{children}
</div>
)}
</div>
);
}