StarMC/Astral-nook
StarMC/Astral-nook
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Improve usability of icon buttons in header with tooltip

Browse source
This commit is contained in:
DaneEveritt 2022-06-12 09:35:02 -04:00
parent 9c957952fb
commit f860fd2cfe
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
4 changed files with 66 additions and 53 deletions
Download patch file Download diff file Expand all files Collapse all files

9
resources/scripts/components/dashboard/search/SearchContainer.tsx
View file

@ -3,6 +3,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faSearch } from '@fortawesome/free-solid-svg-icons';
import useEventListener from '@/plugins/useEventListener';
import SearchModal from '@/components/dashboard/search/SearchModal';
import Tooltip from '@/components/elements/tooltip/Tooltip';
export default () => {
const [ visible, setVisible ] = useState(false);
@ -24,9 +25,11 @@ export default () => {
onDismissed={() => setVisible(false)}
/>
}
<div className={'navigation-link'} onClick={() => setVisible(true)}>
<FontAwesomeIcon icon={faSearch}/>
</div>
<Tooltip placement={'bottom'} content={'Search'}>
<div className={'navigation-link'} onClick={() => setVisible(true)}>
<FontAwesomeIcon icon={faSearch}/>
</div>
</Tooltip>
</>
);
};