fix: 修复 fediverse comment image 布局
This commit is contained in:
parent
03cf6fffe2
commit
3f96faee99
src
app
components
lib
@ -46,10 +46,10 @@ interface FediverseEditorProps {
|
||||
}
|
||||
|
||||
function FediverseEditor({fediverse}: FediverseEditorProps) {
|
||||
const [enabled, setEnabled] = useState(false);
|
||||
const [name, setName] = useState("");
|
||||
const [preferredUsername, setPreferredUsername] = useState("");
|
||||
const [summary, setSummary] = useState("");
|
||||
const [enabled, setEnabled] = useState(fediverse.enabled);
|
||||
const [name, setName] = useState(fediverse.name);
|
||||
const [preferredUsername, setPreferredUsername] = useState(fediverse.preferredUsername);
|
||||
const [summary, setSummary] = useState(fediverse.summary);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const t = useTranslations("page.admin.settings.FediverseEditor");
|
||||
|
||||
|
@ -13,7 +13,7 @@ import Link from "next/link";
|
||||
import {notFound} from "next/navigation";
|
||||
import CommentTree from "@/components/comment/CommentTree";
|
||||
import {getCommentsByArticleId} from "@/lib/comment";
|
||||
import {getLocale, getTranslations} from "next-intl/server";
|
||||
import {getFormatter, getLocale, getTranslations} from "next-intl/server";
|
||||
|
||||
interface PostPageProps {
|
||||
params: {
|
||||
@ -70,6 +70,7 @@ async function PostPage({params}: PostPageProps) {
|
||||
const article = await getArticleBySlug(slug);
|
||||
const {site, fediverse} = await getDynamicConfig();
|
||||
const t = await getTranslations("page.post");
|
||||
const formatter = await getFormatter();
|
||||
|
||||
if (!article) return notFound();
|
||||
|
||||
@ -89,11 +90,9 @@ async function PostPage({params}: PostPageProps) {
|
||||
<h1 className="px-4 pt-2 md:px-6 text-2xl font-semibold text-text-main">{article.title}</h1>
|
||||
<div className="px-4 md:px-6 text-sm text-text-subnote flex flex-row flex-nowrap justify-between">
|
||||
<div>
|
||||
<time>{article.createdAt.toLocaleDateString("zh-CN", {
|
||||
year: "numeric",
|
||||
month: "long",
|
||||
day: "numeric",
|
||||
})}</time>
|
||||
<time dateTime={article.createdAt.toISOString()}>
|
||||
{formatter.dateTime(article.createdAt, "default")}
|
||||
</time>
|
||||
<span className="mx-1 after:content-['·']"></span>
|
||||
<Link className="text-text-content hover:text-link-hover"
|
||||
href={L.series(article.series)}>{article.series}</Link>
|
||||
|
@ -1,4 +1,4 @@
|
||||
import {GET as getIcon} from "@/app/favicon/route";
|
||||
import getIcon from "@/app/icon";
|
||||
import config from "@/config";
|
||||
import DefaultCoverImage from "@/default-cover";
|
||||
import {getDynamicConfig} from "@/lib/config";
|
||||
|
@ -16,7 +16,7 @@ function getFileContentTypeFromExtension(ext?: string) {
|
||||
|
||||
const customImageDir = config.dir.custom;
|
||||
|
||||
export async function GET() {
|
||||
async function Icon() {
|
||||
const dynamicConfig = await getDynamicConfig();
|
||||
|
||||
const logo = dynamicConfig.site.logo;
|
||||
@ -41,3 +41,5 @@ export async function GET() {
|
||||
|
||||
return new Response(await fs.readFile(`${customImageDir}/${logo}`), {headers});
|
||||
}
|
||||
|
||||
export default Icon;
|
@ -62,7 +62,6 @@ async function RootLayout({children}: RootLayoutProps) {
|
||||
return (
|
||||
<html lang={locale}>
|
||||
<head>
|
||||
<link rel="icon" href={"/favicon"} sizes="any"/>
|
||||
<link rel="sitemap" type="application/xml" title="Sitemap" href={"/sitemap.xml"}/>
|
||||
</head>
|
||||
<body className={clsx(inter.className, "pk-scroll", {"color-transition": config.theme.colorTransition})}>
|
||||
|
@ -35,7 +35,9 @@ async function ArticleSummaryCard({className, article}: ArticleSummaryCardProps)
|
||||
</section>
|
||||
<div className="flex justify-between text-text-subnote text-sm">
|
||||
<div>
|
||||
<time>{formatter.dateTime(article.createdAt, "default")}</time>
|
||||
<time dateTime={article.createdAt.toISOString()}>
|
||||
{formatter.dateTime(article.createdAt, "default")}
|
||||
</time>
|
||||
<span className="mx-1 after:content-['·']"></span>
|
||||
<Link className="text-text-content hover:underline hover:text-link-hover"
|
||||
href={L.series(article.series)}>
|
||||
|
@ -309,10 +309,9 @@ function ArticleEditor({article, allTags, className}: ArticleEditorProps) {
|
||||
</div>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<label htmlFor="article-editor-info-tags"
|
||||
className="block text-sm font-medium leading-6 text-text-content">
|
||||
<p className="block text-sm font-medium leading-6 text-text-content">
|
||||
{t("tags")}
|
||||
</label>
|
||||
</p>
|
||||
<div
|
||||
className="flex flex-row flex-wrap p-2 md:p-3 text-sm text-text-content gap-2 select-none">
|
||||
{tags.map((tag, index) => (
|
||||
@ -323,10 +322,9 @@ function ArticleEditor({article, allTags, className}: ArticleEditorProps) {
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
<label htmlFor="article-editor-info-tags"
|
||||
className="block text-sm font-medium leading-6 text-text-subnote">
|
||||
<p className="block text-sm font-medium leading-6 text-text-subnote">
|
||||
{t("tagQuickAdd")}
|
||||
</label>
|
||||
</p>
|
||||
<div
|
||||
className="flex flex-row flex-wrap p-2 md:p-3 text-sm text-text-subnote gap-2 select-none">
|
||||
{otherTags.map((tag) => (
|
||||
|
@ -110,9 +110,9 @@ async function CommentItem({comment, replies, replyTarget}: CommentItemProps) {
|
||||
<CommentHASTRender ast={JSON.parse(comment.parsed)}/>
|
||||
</div>
|
||||
{comment.images.length > 0 && (
|
||||
<div className="flex flex-row flex-wrap gap-2">
|
||||
<div className="grid gap-2" style={{gridTemplateColumns: "repeat(auto-fit, minmax(128px, 1fr))"}}>
|
||||
{comment.images.map((image, index) => (
|
||||
<ImgWithViewer className="min-w-32 w-0 aspect-square rounded shadow-sm flex-grow object-cover"
|
||||
<ImgWithViewer className="max-w-full aspect-square rounded shadow-sm object-cover"
|
||||
key={index} src={image.url} alt={`comment-image-${index}`}/>
|
||||
))}
|
||||
</div>
|
||||
|
@ -48,7 +48,7 @@ export function DeepMergeTemplate<T extends object>(target: T, ...sources: any[]
|
||||
if (isObject(target) && isObject(source)) {
|
||||
for (const key in target) {
|
||||
// @ts-ignore
|
||||
if (source?.[key] && typeof source[key] === typeof target[key]) {
|
||||
if (source?.[key] !== undefined && typeof source[key] === typeof target[key]) {
|
||||
// @ts-ignore
|
||||
if (isObject(source[key])) {
|
||||
// @ts-ignore
|
||||
|
Loading…
x
Reference in New Issue
Block a user