From 385a0573e015c573c64533210dc0dea67fb92cbc Mon Sep 17 00:00:00 2001
From: winkerVSbecks <varunvachhar@gmail.com>
Date: Tue, 8 Dec 2020 14:40:11 -0500
Subject: [PATCH] Tighter spacing for top level flat list

---
 .../table-of-contents/TableOfContentsItems.tsx       | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/components/table-of-contents/TableOfContentsItems.tsx b/src/components/table-of-contents/TableOfContentsItems.tsx
index 3f7e4fbe..05655ac0 100644
--- a/src/components/table-of-contents/TableOfContentsItems.tsx
+++ b/src/components/table-of-contents/TableOfContentsItems.tsx
@@ -138,7 +138,7 @@ Menu.defaultProps = {
   isTopLevel: false,
 };
 
-const List = styled.ul<{ isTopLevel?: boolean }>`
+const List = styled.ul<{ isTopLevel?: boolean; isFlatList?: boolean }>`
   list-style-type: none;
   padding: 0;
   margin: 0;
@@ -155,7 +155,7 @@ const List = styled.ul<{ isTopLevel?: boolean }>`
     props.isTopLevel &&
     css`
       > li {
-        padding-top: 24px;
+        padding-top: ${props.isFlatList ? 16 : 24}px;
 
         ul,
         ol {
@@ -196,9 +196,15 @@ export function TableOfContentsItems({
   ...rest
 }: TableOfContentsItemsProps) {
   const isOrderedList = items.every((item) => item.type === ItemType.BULLET_LINK);
+  const isFlatList = items.every((item) => item.type === ItemType.LINK);
 
   return (
-    <List className={className} isTopLevel={isTopLevel} as={isOrderedList ? 'ol' : 'ul'}>
+    <List
+      className={className}
+      isTopLevel={isTopLevel}
+      isFlatList={isFlatList}
+      as={isOrderedList ? 'ol' : 'ul'}
+    >
       {items.map((item) => {
         return (
           <ItemComponent