Fixed tooltips.

This commit is contained in:
Mike Cao 2023-02-07 22:17:55 -08:00
parent a7cad0190c
commit 87bbaa7f1d
6 changed files with 19 additions and 48 deletions

View file

@ -18,14 +18,13 @@ export default function LanguageButton({ tooltipPosition = 'top' }) {
return (
<PopupTrigger>
<PopupTrigger action="hover">
<Tooltip label={formatMessage(labels.language)} position={tooltipPosition}>
<Button variant="quiet">
<Icon>
<Icons.Globe />
</Icon>
</Button>
<Tooltip position={tooltipPosition}>{formatMessage(labels.language)}</Tooltip>
</PopupTrigger>
</Tooltip>
<Popup position="right" alignment="end">
<div className={styles.menu}>
{items.map(({ value, label }) => {

View file

@ -1,4 +1,4 @@
import { Button, Icon, Icons, PopupTrigger, Tooltip } from 'react-basics';
import { Button, Icon, Icons, Tooltip } from 'react-basics';
import Link from 'next/link';
import { labels } from 'components/messages';
import { useIntl } from 'react-intl';
@ -8,14 +8,13 @@ export default function LogoutButton({ tooltipPosition = 'top' }) {
return (
<Link href="/logout">
<a>
<PopupTrigger action="hover">
<Tooltip label={formatMessage(labels.logout)} position={tooltipPosition}>
<Button variant="quiet">
<Icon>
<Icons.Logout />
</Icon>
</Button>
<Tooltip position={tooltipPosition}>{formatMessage(labels.logout)}</Tooltip>
</PopupTrigger>
</Tooltip>
</a>
</Link>
);

View file

@ -25,9 +25,14 @@
}
.icon {
position: absolute;
right: 0;
visibility: hidden;
position: absolute;
right: -10px;
border-radius: 100%;
color: var(--base50);
background: var(--base800);
height: 20px;
width: 20px;
}
.minimized.navbar {

View file

@ -12,7 +12,7 @@ import ScreenTable from 'components/metrics/ScreenTable';
import EventsTable from 'components/metrics/EventsTable';
import usePageQuery from 'hooks/usePageQuery';
import Icons from 'components/icons';
import { labels } from '../../messages';
import { labels } from 'components/messages';
import { useIntl } from 'react-intl';
const views = {