jens/flipper
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add Tooltip to ToolbarIcon in Layout Plugin

Browse Source 
Summary: Trying to add tooltip to some components to promote tooltip itself and make it clearer what they do

Reviewed By: mweststrate

Differential Revision: D21649207

fbshipit-source-id: 4763ae9a99d687e6624c07bb636c5f4e869cafc9
This commit is contained in:
Chaiwat Ekkaewnumchai
2020-05-21 07:54:04 -07:00
committed by Facebook GitHub Bot
parent b8a989214d
commit 27dd08e546
1 changed files with 15 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
desktop/app/src/ui/components/ToolbarIcon.tsx
View File

@@ -8,6 +8,7 @@
*/ */
import Glyph from './Glyph'; import Glyph from './Glyph';
import Tooltip from './Tooltip';
import {colors} from './colors'; import {colors} from './colors';
import styled from '@emotion/styled'; import styled from '@emotion/styled';
import React from 'react'; import React from 'react';
@@ -26,8 +27,9 @@ const ToolbarIconContainer = styled.div({
position: 'relative', // for settings popover positioning position: 'relative', // for settings popover positioning
}); });
export default function ToolbarIcon({active, icon, ...props}: Props) { export default function ToolbarIcon({active, icon, title, ...props}: Props) {
return ( return (
<Tooltip title={title}>
<ToolbarIconContainer {...props}> <ToolbarIconContainer {...props}>
<Glyph <Glyph
name={icon} name={icon}
@@ -39,5 +41,6 @@ export default function ToolbarIcon({active, icon, ...props}: Props) {
} }
/> />
</ToolbarIconContainer> </ToolbarIconContainer>
</Tooltip>
); );
} }