moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Search styles on aliases page 

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
marcin mikołajczak 2022-05-19 15:32:30 +02:00
parent 0fd073bb00
commit dd4df89f22
1 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/soapbox/features/aliases/components/search.tsx
View File

@ -40,23 +40,23 @@ const Search: React.FC = () => {
const hasValue = value.length > 0; const hasValue = value.length > 0;
return ( return (
<div className='aliases_search search'> <div className='flex items-center gap-1'>
<label> <label className='flex-grow relative'>
<span style={{ display: 'none' }}>{intl.formatMessage(messages.search)}</span> <span style={{ display: 'none' }}>{intl.formatMessage(messages.search)}</span>
<input <input
className='search__input' className='block w-full sm:text-sm dark:bg-slate-800 dark:text-white dark:placeholder:text-gray-500 focus:ring-indigo-500 focus:border-indigo-500 rounded-full'
type='text' type='text'
value={value} value={value}
onChange={handleChange} onChange={handleChange}
onKeyUp={handleKeyUp} onKeyUp={handleKeyUp}
placeholder={intl.formatMessage(messages.search)} placeholder={intl.formatMessage(messages.search)}
/> />
</label>
<div role='button' tabIndex={0} className='search__icon' onClick={handleClear}> <div role='button' tabIndex={0} className='search__icon' onClick={handleClear}>
<Icon src={require('@tabler/icons/icons/backspace.svg')} aria-label={intl.formatMessage(messages.search)} className={classNames('svg-icon--backspace', { active: hasValue })} /> <Icon src={require('@tabler/icons/icons/backspace.svg')} aria-label={intl.formatMessage(messages.search)} className={classNames('svg-icon--backspace', { active: hasValue })} />
</div> </div>
</label>
<Button onClick={handleSubmit}>{intl.formatMessage(messages.searchTitle)}</Button> <Button onClick={handleSubmit}>{intl.formatMessage(messages.searchTitle)}</Button>
</div> </div>
); );