diff --git a/src/components/DetailSidebar/DetailSidebar.tsx b/src/components/DetailSidebar/DetailSidebar.tsx
index 832ecbd88..1d73188cb 100644
--- a/src/components/DetailSidebar/DetailSidebar.tsx
+++ b/src/components/DetailSidebar/DetailSidebar.tsx
@@ -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 (
-
- {description}
- {version ? {`${isLatest ? 'Latest v' : 'v'}${version}`} : null}
-
+ <>
+ {description}
+ {version ? (
+
+ {`${isLatest ? 'Latest v' : 'v'}${version}`}
+
+ ) : null}
+ >
);
};
diff --git a/src/components/DetailSidebar/styles.ts b/src/components/DetailSidebar/styles.ts
index 86252a138..b9ba2c8f7 100644
--- a/src/components/DetailSidebar/styles.ts
+++ b/src/components/DetailSidebar/styles.ts
@@ -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')({
+ '&&': {
+ display: 'block',
+ },
+});
+
+export const PackageVersion = styled('span')({
'&&': {
- color: colors.greySuperLight,
- backgroundColor: colors.primary,
- textTransform: 'capitalize',
+ display: 'block',
},
});
diff --git a/src/components/Footer/styles.ts b/src/components/Footer/styles.ts
index 7a63fa910..52079350b 100644
--- a/src/components/Footer/styles.ts
+++ b/src/components/Footer/styles.ts
@@ -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;
}
}