mirror of
https://github.com/wah-su/wahs.wah.su.git
synced 2025-05-14 08:49:36 +05:00
add video page
This commit is contained in:
parent
87a27f137a
commit
a2cfae043e
10 changed files with 338 additions and 34 deletions
|
@ -1,32 +1,57 @@
|
|||
export default function PageNav() {
|
||||
|
||||
const ipp = [12,24,32,48,72,100,250,500,1000]
|
||||
export default function PageNav(props: { path: string }) {
|
||||
let ipp;
|
||||
if (props.path == "/images") {
|
||||
ipp = [12, 24, 32, 48, 72, 100, 250, 500, 1000];
|
||||
} else {
|
||||
ipp = [24, 48, 72, 100];
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="bg-orange-800/50 rounded-sm p-2 text-white flex justify-between gap-4 items-center">
|
||||
<button className="flex justify-center items-center cursor-pointer" id="nav_prev">
|
||||
<button
|
||||
className="flex justify-center items-center cursor-pointer"
|
||||
id="nav_prev"
|
||||
>
|
||||
<div className="material-symbols--navigate-before w-16 h-16"></div>
|
||||
</button>
|
||||
<div className="flex gap-4">
|
||||
{ipp.map((item, idx) => {
|
||||
return <button key={`ipp_${item}`}
|
||||
className={`${idx > 4 ? "hidden md:block" : ""} cursor-pointer md:text-lg lg:text-xl text-gray-200`}
|
||||
id="nav_ipp"
|
||||
data-ipp={item}
|
||||
>{item}</button>
|
||||
return (
|
||||
<button
|
||||
key={`ipp_${item}`}
|
||||
className={`${
|
||||
idx > 4 ? "hidden md:block" : ""
|
||||
} cursor-pointer md:text-lg lg:text-xl text-gray-200`}
|
||||
id="nav_ipp"
|
||||
data-ipp={item}
|
||||
>
|
||||
{item}
|
||||
</button>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
<div className="flex">
|
||||
<div className="gap-1 hidden xl:flex">
|
||||
<button className="flex justify-center items-center cursor-pointer text-gray-200" id="nav_view" data-view="grid">
|
||||
<div className="material-symbols--grid-on w-8 h-8"></div>
|
||||
</button>
|
||||
<button className="flex justify-center items-center cursor-pointer text-gray-200" id="nav_view" data-view="masonry">
|
||||
<div className="material-symbols--dashboard-rounded w-8 h-8"></div>
|
||||
</button>
|
||||
<button
|
||||
className="flex justify-center items-center cursor-pointer text-gray-200"
|
||||
id="nav_view"
|
||||
data-view="grid"
|
||||
>
|
||||
<div className="material-symbols--grid-on w-8 h-8"></div>
|
||||
</button>
|
||||
<button
|
||||
className="flex justify-center items-center cursor-pointer text-gray-200"
|
||||
id="nav_view"
|
||||
data-view="masonry"
|
||||
>
|
||||
<div className="material-symbols--dashboard-rounded w-8 h-8"></div>
|
||||
</button>
|
||||
</div>
|
||||
<button className="flex justify-center items-center cursor-pointer" id="nav_next">
|
||||
<div className="material-symbols--navigate-next w-16 h-16"></div>
|
||||
<button
|
||||
className="flex justify-center items-center cursor-pointer"
|
||||
id="nav_next"
|
||||
>
|
||||
<div className="material-symbols--navigate-next w-16 h-16"></div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue