diff --git a/packages/DApp/src/components/Input.tsx b/packages/DApp/src/components/Input.tsx index a8a4deb..5b9e964 100644 --- a/packages/DApp/src/components/Input.tsx +++ b/packages/DApp/src/components/Input.tsx @@ -20,14 +20,11 @@ export const Input = styled.input` export const Search = styled(Input)` width: 270px; - padding: 7px 36px; + padding: 6px 36px; + font-size: 15px; + line-height: 22px; background-image: url(${searchIcon}); background-size: 24px 24px; background-repeat: no-repeat; background-position: center left 10px; - - &::placeholder { - font-size: 15px; - line-height: 22px; - } ` diff --git a/packages/DApp/src/components/votes/VotingCards.tsx b/packages/DApp/src/components/votes/VotingCards.tsx index b9caac7..71bef63 100644 --- a/packages/DApp/src/components/votes/VotingCards.tsx +++ b/packages/DApp/src/components/votes/VotingCards.tsx @@ -11,20 +11,29 @@ import { Colors } from '../../constants/styles' import { useConfig } from '../../providers/config' import { VotingCardSkeleton } from './VotingCardSkeleton' import { VotingCard } from './VotingCard' +import { Search } from '../Input' export function VotingCards() { const { config } = useConfig() const [sortedBy, setSortedBy] = useState(VotingSortingEnum.EndingSoonest) const [voteType, setVoteType] = useState('') + const [filterKeyword, setFilterKeyword] = useState('') const { communities, loading } = useCommunities(getCommunitiesUnderVote, { numberPerPage: config.numberPerPage, sortedBy, voteType, + filterKeyword, }) return (
+ setFilterKeyword(e.currentTarget.value)} + /> Vote types: setVoteType('')}>