uetchy/namae
1
0
Fork 0
mirror of https://github.com/uetchy/namae.git synced 2025-03-17 12:30:32 +09:00
Code Issues Releases Activity

fix: tooltip position

Browse Source
This commit is contained in:
uetchy 2020-02-08 19:17:02 +09:00
parent c75d523f86
commit 71b74d4529
1 changed files with 22 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
web/src/components/cards/core.tsx
View File

@ -198,13 +198,13 @@ export const Result: React.FC<{
? COLORS.available ? COLORS.available
: COLORS.unavailable; : COLORS.unavailable;
return ( return (
<ResultContainer>
<Tooltip <Tooltip
title={message} title={message}
position="bottom" position="bottom"
arrow={true} arrow={true}
animation="shift" animation="shift"
duration="200"> duration="200">
<ResultContainer>
<ResultItem color={itemColor}> <ResultItem color={itemColor}>
<ResultIcon>{icon}</ResultIcon> <ResultIcon>{icon}</ResultIcon>
<ResultName> <ResultName>
@ -220,8 +220,8 @@ export const Result: React.FC<{
</AvailableIcon> </AvailableIcon>
) : null} ) : null}
</ResultItem> </ResultItem>
</ResultContainer>
</Tooltip> </Tooltip>
</ResultContainer>
); );
}; };
@ -256,6 +256,7 @@ class ErrorBoundary extends React.Component<
render() { render() {
if (this.state.hasError) { if (this.state.hasError) {
return ( return (
<ResultContainer>
<Tooltip <Tooltip
title={`${this.state.message}${ title={`${this.state.message}${
this.state.eventId ? ` (${this.state.eventId})` : '' this.state.eventId ? ` (${this.state.eventId})` : ''
@ -264,15 +265,14 @@ class ErrorBoundary extends React.Component<
arrow={true} arrow={true}
animation="shift" animation="shift"
duration="200"> duration="200">
<ResultContainer>
<ResultItem color={COLORS.error}> <ResultItem color={COLORS.error}>
<ResultIcon> <ResultIcon>
<GoInfo /> <GoInfo />
</ResultIcon> </ResultIcon>
<ResultName>Error</ResultName> <ResultName>Error</ResultName>
</ResultItem> </ResultItem>
</ResultContainer>
</Tooltip> </Tooltip>
</ResultContainer>
); );
} }
return this.props.children; return this.props.children;
@ -340,6 +340,8 @@ const Button = styled.div`
`; `;
const ResultContainer = styled.div` const ResultContainer = styled.div`
display: flex;
align-items: center;
padding: 4px 0; padding: 4px 0;
`; `;