fix: some warnings in console (#155)

* fix: remove react emotion selector warning

* fix: validate DOM nesting
This commit is contained in:
Antoine Chalifour 2019-10-04 23:19:50 +02:00 committed by Juan Picado @jotadeveloper
parent 7bd9eb7a07
commit 583ddd555a
3 changed files with 18 additions and 13 deletions

View File

@ -14,14 +14,18 @@ import Repository from '../Repository/Repository';
import { DetailContext } from '../../pages/Version'; import { DetailContext } from '../../pages/Version';
import { TitleListItem, TitleListItemText } from './styles'; import { TitleListItem, TitleListItemText, PackageDescription, PackageVersion } from './styles';
const renderLatestDescription = (description, version, isLatest: boolean = true): JSX.Element => { const renderLatestDescription = (description, version, isLatest: boolean = true): JSX.Element => {
return ( return (
<span> <>
<div>{description}</div> <PackageDescription>{description}</PackageDescription>
{version ? <small>{`${isLatest ? 'Latest v' : 'v'}${version}`}</small> : null} {version ? (
</span> <PackageVersion>
<small>{`${isLatest ? 'Latest v' : 'v'}${version}`}</small>
</PackageVersion>
) : null}
</>
); );
}; };

View File

@ -1,10 +1,7 @@
import styled from 'react-emotion'; import styled from 'react-emotion';
import Avatar from '@material-ui/core/Avatar';
import ListItem from '@material-ui/core/ListItem'; import ListItem from '@material-ui/core/ListItem';
import ListItemText from '@material-ui/core/ListItemText'; import ListItemText from '@material-ui/core/ListItemText';
import colors from '../../utils/styles/colors';
export const TitleListItem = styled(ListItem)({ export const TitleListItem = styled(ListItem)({
'&&': { '&&': {
paddingLeft: 0, paddingLeft: 0,
@ -21,10 +18,14 @@ export const TitleListItemText = styled(ListItemText)({
}, },
}); });
export const TitleAvatar = styled(Avatar)({ export const PackageDescription = styled('span')({
'&&': { '&&': {
color: colors.greySuperLight, display: 'block',
backgroundColor: colors.primary, },
textTransform: 'capitalize', });
export const PackageVersion = styled('span')({
'&&': {
display: 'block',
}, },
}); });

View File

@ -90,7 +90,7 @@ export const Flags = styled('span')`
border-color: ${colors.greyAthens} transparent transparent transparent; border-color: ${colors.greyAthens} transparent transparent transparent;
transform: rotate(90deg); transform: rotate(90deg);
} }
${ToolTip}:hover & { ${/* sc-selector */ ToolTip}:hover & {
visibility: visible; visibility: visible;
} }
} }