shishantbiswas/JustAnime
1
0
Fork 0
mirror of https://github.com/JustAnimeCore/JustAnime.git synced 2026-04-17 22:01:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

small fix

Browse Source
This commit is contained in:
Tejas Panchal
2025-07-30 21:08:16 +05:30
parent ef1746a716
commit 42623886a3
1 changed files with 22 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/episodelist/Episodelist.jsx
View File

@@ -138,28 +138,26 @@ function Episodelist({
return ( return (
<div className="flex flex-col w-full h-full"> <div className="flex flex-col w-full h-full">
<div className="sticky top-0 z-10 flex flex-col gap-y-[5px] justify-start px-4 py-3 bg-[#1a1a1a] border-b border-[#2a2a2a]"> <div className="sticky top-0 z-10 flex items-center justify-between px-4 py-3 bg-[#1a1a1a] border-b border-[#2a2a2a]">
<h1 className="text-[14px] font-semibold text-white mb-1">Episodes</h1> <div className="flex items-center gap-4">
<h1 className="text-[14px] font-semibold text-white">Episodes</h1>
{totalEpisodes > 100 && ( {totalEpisodes > 100 && (
<div className="w-full flex gap-x-4 items-center max-[1200px]:justify-between"> <div className="flex items-center">
<div className="min-w-fit flex text-[13px]">
<div <div
onClick={() => setShowDropDown((prev) => !prev)} onClick={() => setShowDropDown((prev) => !prev)}
className="text-gray-300 w-fit mt-1 text-[13px] relative cursor-pointer flex justify-center items-center hover:text-white transition-colors" className="text-gray-300 relative cursor-pointer flex items-center gap-2 hover:text-white transition-colors"
ref={dropDownRef} ref={dropDownRef}
> >
<FontAwesomeIcon icon={faList} className="text-gray-400" /> <FontAwesomeIcon icon={faList} className="text-gray-400" />
<div className="w-fit flex justify-center items-center gap-x-2 ml-4">
<p className="text-[12px]"> <p className="text-[12px]">
{selectedRange[0]}-{selectedRange[1]} {selectedRange[0]}-{selectedRange[1]}
</p> </p>
<FontAwesomeIcon <FontAwesomeIcon
icon={faAngleDown} icon={faAngleDown}
className="mt-[2px] text-[10px]" className="text-[10px]"
/> />
</div>
{showDropDown && ( {showDropDown && (
<div className="absolute flex flex-col top-full mt-[10px] left-0 z-30 bg-[#2a2a2a] w-[150px] max-h-[200px] overflow-y-auto rounded-lg border border-[#3a3a3a] shadow-lg"> <div className="absolute top-full mt-2 left-0 z-30 bg-[#2a2a2a] w-[150px] max-h-[200px] overflow-y-auto rounded-lg border border-[#3a3a3a] shadow-lg">
{generateRangeOptions(totalEpisodes).map((item, index) => ( {generateRangeOptions(totalEpisodes).map((item, index) => (
<div <div
key={index} key={index}
@@ -183,14 +181,19 @@ function Episodelist({
)} )}
</div> </div>
</div> </div>
<div className="border border-[#3a3a3a] rounded-lg py-2 px-3 flex items-center gap-x-3 bg-[#2a2a2a] focus-within:border-gray-500 transition-colors"> )}
</div>
{totalEpisodes > 100 && (
<div className="flex items-center min-w-[180px]">
<div className="w-full flex items-center gap-2 px-3 py-1.5 bg-[#2a2a2a] rounded-lg border border-[#3a3a3a] focus-within:border-gray-500 transition-colors">
<FontAwesomeIcon <FontAwesomeIcon
icon={faMagnifyingGlass} icon={faMagnifyingGlass}
className="text-[12px] text-gray-400" className="text-[12px] text-gray-400"
/> />
<input <input
type="text" type="text"
className="w-full bg-transparent focus:outline-none rounded-sm text-[13px] text-white placeholder:text-gray-500" className="w-full bg-transparent focus:outline-none text-[13px] text-white placeholder:text-gray-500"
placeholder="Go to episode..." placeholder="Go to episode..."
onChange={handleChange} onChange={handleChange}
/> />
@@ -198,6 +201,7 @@ function Episodelist({
</div> </div>
)} )}
</div> </div>
<div ref={listContainerRef} className="w-full flex-1 overflow-y-auto bg-[#1a1a1a]"> <div ref={listContainerRef} className="w-full flex-1 overflow-y-auto bg-[#1a1a1a]">
<div <div
className={`${ className={`${