rushilwiz/compass
1
0
Fork 0
mirror of https://github.com/cssgunc/compass.git synced 2025-04-11 06:40:17 -04:00
Code Issues Actions Packages Projects Releases Wiki Activity

4/20 meeting progress

Browse Source
This commit is contained in:
Ilakkiya Senthilkumar 2024-04-20 15:30:48 -04:00
parent 80b450fa60
commit a8e74f13eb
2 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
compass/components/Table/TableAction.tsx
View File

@ -37,7 +37,7 @@ export const TableAction: FunctionComponent<TableActionProps> = ({
return ( return (
<div className="w-auto flex flex-row gap-x-0.5 items-center justify-between text-xs font-medium text-gray-500 p-2"> <div className="w-auto flex flex-row gap-x-0.5 items-center justify-between text-xs font-medium text-gray-500 p-2">
<span <span
className="p-1 rounded hover:bg-gray-100" className="p-1 rounded hover:text-purple-700 focus:bg-purple-50 hover:bg-purple-50"
onClick={toggleFilterBox} onClick={toggleFilterBox}
> >
Filter Filter

9
compass/components/resource/LandingSearchBar.tsx
View File

@ -1,9 +1,12 @@
import { MagnifyingGlassIcon, XMarkIcon } from "@heroicons/react/24/solid" import { ChevronDownIcon, MagnifyingGlassIcon, XMarkIcon } from "@heroicons/react/24/solid"
import React, { useState } from 'react'; import React, { useState } from 'react';
import Image from 'next/image'; import Image from 'next/image';
import { FilterBox } from "../FilterBox";
export const LandingSearchBar: React.FC = () => { export const LandingSearchBar: React.FC = () => {
const [searchTerm, setSearchTerm] = useState(''); const [searchTerm, setSearchTerm] = useState('');
const [showFilterBox, setShowFilterBox] = useState(false);
const toggleFilterBox = () => setShowFilterBox((prev) => !prev);
const handleSearchChange = (event: React.ChangeEvent<HTMLInputElement>) => { const handleSearchChange = (event: React.ChangeEvent<HTMLInputElement>) => {
setSearchTerm(event.target.value); setSearchTerm(event.target.value);
@ -34,7 +37,9 @@ export const LandingSearchBar: React.FC = () => {
<XMarkIcon className="h-5 w-5 text-gray-500" aria-hidden="true" /> <XMarkIcon className="h-5 w-5 text-gray-500" aria-hidden="true" />
</button> </button>
)} )}
<div className="p-3"> <div className="flex flex-row space-x-1 p-3">
<span><ChevronDownIcon className="h-5 w-5 text-gray-500" onClick={toggleFilterBox} /></span>
{showFilterBox && <FilterBox className="relative top-50" />}
<MagnifyingGlassIcon className="h-5 w-5 text-gray-500" aria-hidden="true" /> <MagnifyingGlassIcon className="h-5 w-5 text-gray-500" aria-hidden="true" />
</div> </div>
</div> </div>