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 { TitleListItem, TitleListItemText } from './styles';
import { TitleListItem, TitleListItemText, PackageDescription, PackageVersion } from './styles';
const renderLatestDescription = (description, version, isLatest: boolean = true): JSX.Element => {
return (
<span>
<div>{description}</div>
{version ? <small>{`${isLatest ? 'Latest v' : 'v'}${version}`}</small> : null}
</span>
<>
<PackageDescription>{description}</PackageDescription>
{version ? (
<PackageVersion>
<small>{`${isLatest ? 'Latest v' : 'v'}${version}`}</small>
</PackageVersion>
) : null}
</>
);
};

View File

@ -1,10 +1,7 @@
import styled from 'react-emotion';
import Avatar from '@material-ui/core/Avatar';
import ListItem from '@material-ui/core/ListItem';
import ListItemText from '@material-ui/core/ListItemText';
import colors from '../../utils/styles/colors';
export const TitleListItem = styled(ListItem)({
'&&': {
paddingLeft: 0,
@ -21,10 +18,14 @@ export const TitleListItemText = styled(ListItemText)({
},
});
export const TitleAvatar = styled(Avatar)({
export const PackageDescription = styled('span')({
'&&': {
color: colors.greySuperLight,
backgroundColor: colors.primary,
textTransform: 'capitalize',
display: 'block',
},
});
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;
transform: rotate(90deg);
}
${ToolTip}:hover & {
${/* sc-selector */ ToolTip}:hover & {
visibility: visible;
}
}