chore(docz-theme-default): add some margin for overflow on menu

doczjs · Jun 30, 2018 · 9cffa3b · 9cffa3b
1 parent 4cdbcfd
commit 9cffa3b
Showing 1 changed file with 12 additions and 2 deletions.
diff --git a/packages/docz-theme-default/src/components/shared/Sidebar/index.tsx b/packages/docz-theme-default/src/components/shared/Sidebar/index.tsx
@@ -26,7 +26,6 @@ const background = (p: Wrapper) =>
 const Wrapper = styled('div')`
   display: flex;
   flex-direction: column;
-  padding: 20px;
   width: 300px;
   height: 100%;
   background: ${background};
@@ -36,6 +35,7 @@ const Wrapper = styled('div')`
 
   ${p =>
     p.theme.mq({
+      padding: [10, 20],
       position: ['absolute', 'absolute', 'absolute', 'relative'],
     })};
 
@@ -71,9 +71,16 @@ const Wrapper = styled('div')`
   }
 `
 
+const logoMarginBottom = (p: any) =>
+  p.theme.mq({
+    marginBottom: ['30px', '64px'],
+  })
+
 const LogoImg = styled('img')`
-  margin: 24px 16px 64px;
+  margin: 24px 16px 0;
   padding: 0;
+
+  ${logoMarginBottom};
 `
 
 const LogoText = styled('h1')`
@@ -83,6 +90,8 @@ const LogoText = styled('h1')`
   font-size: 32px;
   color: ${p => p.theme.colors.text};
 
+  ${logoMarginBottom};
+
   &:before {
     position: absolute;
     content: '';
@@ -97,6 +106,7 @@ const LogoText = styled('h1')`
 const Menus = styled('nav')`
   flex: 1;
   overflow-y: auto;
+  margin-bottom: 10px;
 `
 
 const Footer = styled('div')`