soheilkhaledabadi/rahavard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Init(Coore): add to repo

Browse Source
This commit is contained in:
soheil khaledabadi
2026-04-24 16:20:36 +03:30
commit 893cdcb89c
91 changed files with 13751 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
components/SortButton.js Executable file
View File

@@ -0,0 +1,37 @@
import { useState } from 'react';
export default function SortButton({ setSort }){
let [open, setOpen] = useState(false);
function toggleOpen(){
if(!open){
document.getElementById('sort_dropdown').classList.remove('scale-0');
document.getElementById('sort_dropdown').classList.add('scale-100');
document.getElementById('sort_dropdown').classList.remove('opacity-0');
document.getElementById('sort_dropdown').classList.add('opacity-100');
setOpen(true);
}
else {
document.getElementById('sort_dropdown').classList.remove('scale-100');
document.getElementById('sort_dropdown').classList.add('scale-0');
document.getElementById('sort_dropdown').classList.remove('opacity-100');
document.getElementById('sort_dropdown').classList.add('opacity-0');
setOpen(false);
}
}
return (
<div className="relative">
<button id="sort_button" onClick={ toggleOpen } className="transition duration-300 ease-in-out flex w-fit px-2 py-1 pb-0.5 text-sm text-white bg-gradient-to-tr from-rose-900 to-orange-700 rounded-lg">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth="1.5" stroke="currentColor" className="w-4 h-4">
<path strokeLinecap="round" strokeLinejoin="round" d="M3 4.5h14.25M3 9h9.75M3 13.5h9.75m4.5-4.5v12m0 0l-3.75-3.75M17.25 21L21 17.25" />
</svg>
<span className="pr-1 text-sm">مرتب سازی</span>
</button>
<div id="sort_dropdown" onClick={e => toggleOpen()} className="mt-1 flex flex-col text-sm items-center absolute bg-white border w-full rounded-xl origin-top scale-0 opacity-0 duration-600 transition ease-in-out translate">
<button onClick={ e => setSort('default') } className="border-b py-1 pt-2 border-gray-300 w-full">پیشفرض </button>
<button onClick={ e => setSort('price') } className="border-b py-1 pt-2 border-gray-300 w-full">قیمت </button>
<button onClick={ e => setSort('popularity') } className="py-2 w-full">محبوبیت </button>
</div>
</div>
)
}