Addd searchInput selector & remove redundant css

develop
Jason Zhu 2023-04-19 00:14:45 +10:00
parent b2839de8a7
commit b56eae4e40
3 changed files with 3 additions and 15 deletions

View File

@ -27,6 +27,7 @@ html {
font-size: 12px; font-size: 12px;
} }
/* TODO: Fix incorrect render of input */
.filter__items > input { .filter__items > input {
width: 10vw; width: 10vw;
margin-top: 5px; margin-top: 5px;

View File

@ -58,6 +58,7 @@ const Filters = () => {
const selectedRegion = useAppSelector(state => state.pokedex.selectedRegion); const selectedRegion = useAppSelector(state => state.pokedex.selectedRegion);
const selectedType = useAppSelector(state => state.pokedex.selectedType); const selectedType = useAppSelector(state => state.pokedex.selectedType);
const selectedSort = useAppSelector(state => state.pokedex.selectedSort); const selectedSort = useAppSelector(state => state.pokedex.selectedSort);
const searchInput = useAppSelector(state => state.pokedex.searchInput);
const regionPokemonList = useAppSelector( const regionPokemonList = useAppSelector(
state => state.pokedex.regionOptions, state => state.pokedex.regionOptions,
@ -149,6 +150,7 @@ const Filters = () => {
<input <input
type="text" type="text"
onChange={e => dispatch(setSearchInput(e.target.value))} onChange={e => dispatch(setSearchInput(e.target.value))}
value={searchInput}
/> />
</div> </div>
</div> </div>

View File

@ -23,21 +23,6 @@ code {
monospace; monospace;
} }
.filter__container {
display: flex;
flex-direction: row;
margin: 7vh 0 5vh 0;
gap: 0 2vw;
}
.filter__items {
display: flex;
flex-direction: column;
align-items: center;
font-family: 'barcadebrawl';
font-size: 12px;
}
.pokemon__container { .pokemon__container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;