nyne/nysoure
1
0
Fork 0
mirror of https://github.com/wgh136/nysoure.git synced 2025-12-16 23:51:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

improve gallery

Browse Source
This commit is contained in:
nyne
2025-11-01 17:28:24 +08:00
parent a4de7a1d54
commit 2499962815
1 changed files with 56 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

108
frontend/src/pages/resource_details_page.tsx
View File

@@ -25,7 +25,8 @@ import Markdown from "react-markdown";
import "../markdown.css"; import "../markdown.css";
import Loading from "../components/loading.tsx"; import Loading from "../components/loading.tsx";
import { import {
MdAdd, MdOutlineAccessTime, MdAdd,
MdOutlineAccessTime,
MdOutlineAdd, MdOutlineAdd,
MdOutlineArchive, MdOutlineArchive,
MdOutlineArticle, MdOutlineArticle,
@@ -196,38 +197,64 @@ export default function ResourcePage() {
<div className="flex"> <div className="flex">
<div className="flex-1"> <div className="flex-1">
<h1 className={"text-2xl font-bold px-4 py-2"}>{resource.title}</h1> <h1 className={"text-2xl font-bold px-4 py-2"}>{resource.title}</h1>
{resource.alternativeTitles.map((e, i) => { {resource.alternativeTitles.map((e, i) => {
return ( return (
<h2 <h2
key={i} key={i}
className={"text-lg px-4 py-1 text-gray-700 dark:text-gray-300"} className={
"text-lg px-4 py-1 text-gray-700 dark:text-gray-300"
}
>
{e}
</h2>
);
})}
<button
onClick={() => {
navigate(
`/user/${encodeURIComponent(resource.author.username)}`,
);
}}
className="border-b-2 mx-4 py-1 cursor-pointer border-transparent hover:border-primary transition-colors duration-200 ease-in-out"
> >
{e} <div className="flex items-center ">
</h2> <div className="avatar">
); <div className="w-6 rounded-full">
})} <img
<button src={network.getUserAvatar(resource.author)}
onClick={() => { alt={"avatar"}
navigate(`/user/${encodeURIComponent(resource.author.username)}`); />
}} </div>
className="border-b-2 mx-4 py-1 cursor-pointer border-transparent hover:border-primary transition-colors duration-200 ease-in-out" </div>
> <div className="w-2"></div>
<div className="flex items-center "> <div className="text-sm">{resource.author.username}</div>
<div className="avatar">
<div className="w-6 rounded-full">
<img
src={network.getUserAvatar(resource.author)}
alt={"avatar"}
/>
</div> </div>
</div> </button>
<div className="w-2"></div>
<div className="text-sm">{resource.author.username}</div>
</div>
</button>
<Tags tags={resource.tags} /> <Tags tags={resource.tags} />
<div className={"px-3 mt-2 flex flex-wrap"}>
{resource.links &&
resource.links.map((l) => {
return (
<a href={l.url} target={"_blank"}>
<span
className={
"py-1 px-3 inline-flex items-center m-1 border border-base-300 bg-base-100 opacity-90 rounded-2xl hover:bg-base-200 transition-colors cursor-pointer select-none"
}
>
{l.url.includes("steampowered.com") ? (
<BiLogoSteam size={20} />
) : (
<MdOutlineLink size={20} />
)}
<span className={"ml-2 text-sm"}>{l.label}</span>
</span>
</a>
);
})}
<CollectionDialog rid={resource.id} />
</div>
</div> </div>
<div className="w-md p-4 hidden sm:flex items-center justify-center"> <div className="w-96 md:w-md lg:w-lg p-4 hidden sm:flex items-center justify-center">
<Gallery images={resource.gallery} /> <Gallery images={resource.gallery} />
</div> </div>
</div> </div>
@@ -236,29 +263,6 @@ export default function ResourcePage() {
<Gallery images={resource.gallery} /> <Gallery images={resource.gallery} />
</div> </div>
<div className={"px-3 mt-2 flex flex-wrap"}>
{resource.links &&
resource.links.map((l) => {
return (
<a href={l.url} target={"_blank"}>
<span
className={
"py-1 px-3 inline-flex items-center m-1 border border-base-300 bg-base-100 opacity-90 rounded-2xl hover:bg-base-200 transition-colors cursor-pointer select-none"
}
>
{l.url.includes("steampowered.com") ? (
<BiLogoSteam size={20} />
) : (
<MdOutlineLink size={20} />
)}
<span className={"ml-2 text-sm"}>{l.label}</span>
</span>
</a>
);
})}
<CollectionDialog rid={resource.id} />
</div>
<div <div
className="tabs tabs-box my-4 mx-2 p-4 shadow" className="tabs tabs-box my-4 mx-2 p-4 shadow"
style={{ style={{