Stylstic fix for the new way we sectionize headings / table of contents

This commit is contained in:
Piotr Janosz
2019-08-28 12:14:05 +02:00
parent d816551dba
commit 219e09d157

View File

@@ -38,7 +38,7 @@ export const TableOfContents: React.FC<ITableOfContentsProps> = ({ contents, ver
const Contents: React.FC<ITableOfContentsProps> = ({ contents }) => { const Contents: React.FC<ITableOfContentsProps> = ({ contents }) => {
return ( return (
<ContentsList> <ul>
{contents.map(content => { {contents.map(content => {
const { children, id, level, title } = content; const { children, id, level, title } = content;
@@ -58,16 +58,10 @@ const Contents: React.FC<ITableOfContentsProps> = ({ contents }) => {
</li> </li>
); );
})} })}
</ContentsList> </ul>
); );
}; };
const ContentsList = styled.ul`
ul {
margin-bottom: 1rem;
}
`;
const ContentLink = styled(Link)<{ level: number }>` const ContentLink = styled(Link)<{ level: number }>`
display: inline-block; display: inline-block;
@@ -91,8 +85,7 @@ const ContentLink = styled(Link)<{ level: number }>`
` `
font-size: 0.8333rem; font-size: 0.8333rem;
line-height: 1.5; line-height: 1.5;
margin-bottom: .5rem; margin: .4rem 0;
`} `}
${({ level }) => ${({ level }) =>