diff options
| author | Rafi Zadanly <rafizadanly@gmail.com> | 2022-12-15 16:37:02 +0700 |
|---|---|---|
| committer | Rafi Zadanly <rafizadanly@gmail.com> | 2022-12-15 16:37:02 +0700 |
| commit | 2c58745807110ba234e1a9ec939457e641fff469 (patch) | |
| tree | 95297d3b4df5ba3b053cfd16cd5c9dfb598988e2 /src/components/Filter.js | |
| parent | bd4008ac5c2a22c1d99239ba0691cfb8ef0e9aea (diff) | |
Fix style
Diffstat (limited to 'src/components/Filter.js')
| -rw-r--r-- | src/components/Filter.js | 34 |
1 files changed, 29 insertions, 5 deletions
diff --git a/src/components/Filter.js b/src/components/Filter.js index 4727fb9d..19e9778f 100644 --- a/src/components/Filter.js +++ b/src/components/Filter.js @@ -93,7 +93,7 @@ const Filter = ({ </div> <form className="flex flex-col gap-y-4" onSubmit={submit}> {selectedBrand || selectedCategory || priceFrom || priceTo || orderBy ? ( - <button type="button" className="text-yellow-900 font-semibold ml-auto" onClick={reset}> + <button type="button" className="text-yellow_r-12 font-semibold ml-auto" onClick={reset}> Reset Filter </button> ) : ''} @@ -101,10 +101,34 @@ const Filter = ({ <div> <label>Urutkan</label> <div className="flex gap-2 mt-2 overflow-x-auto w-full"> - <button type="button" className={"p-2 rounded border border-gray-300 text-gray-800 flex-shrink-0" + (orderBy == 'price-asc' ? ' border-yellow-900 text-yellow-900' : '')} onClick={() => changeOrderBy('price-asc')}>Harga Terendah</button> - <button type="button" className={"p-2 rounded border border-gray-300 text-gray-800 flex-shrink-0" + (orderBy == 'price-desc' ? ' border-yellow-900 text-yellow-900' : '')} onClick={() => changeOrderBy('price-desc')}>Harga Tertinggi</button> - <button type="button" className={"p-2 rounded border border-gray-300 text-gray-800 flex-shrink-0" + (orderBy == 'popular' ? ' border-yellow-900 text-yellow-900' : '')} onClick={() => changeOrderBy('popular')}>Populer</button> - <button type="button" className={"p-2 rounded border border-gray-300 text-gray-800 flex-shrink-0" + (orderBy == 'stock' ? ' border-yellow-900 text-yellow-900' : '')} onClick={() => changeOrderBy('stock')}>Ready Stock</button> + <button + type="button" + className={"p-2 rounded border border-gray_r-6 flex-shrink-0" + (orderBy == 'price-asc' ? ' border-yellow_r-9 text-yellow_r-10' : '')} + onClick={() => changeOrderBy('price-asc')} + > + Harga Terendah + </button> + <button + type="button" + className={"p-2 rounded border border-gray_r-6 flex-shrink-0" + (orderBy == 'price-desc' ? ' border-yellow_r-9 text-yellow_r-10' : '')} + onClick={() => changeOrderBy('price-desc')} + > + Harga Tertinggi + </button> + <button + type="button" + className={"p-2 rounded border border-gray_r-6 flex-shrink-0" + (orderBy == 'popular' ? ' border-yellow_r-9 text-yellow_r-10' : '')} + onClick={() => changeOrderBy('popular')} + > + Populer + </button> + <button + type="button" + className={"p-2 rounded border border-gray_r-6 flex-shrink-0" + (orderBy == 'stock' ? ' border-yellow_r-9 text-yellow_r-10' : '')} + onClick={() => changeOrderBy('stock')} + > + Ready Stock + </button> </div> </div> ) : ''} |