From 422123135cab70c3807c290f8eb058ef06d02a58 Mon Sep 17 00:00:00 2001
From: Wouter van den Hoven <wouter@vespertool.com>
Date: Thu, 2 Jul 2020 14:34:10 +0200
Subject: [PATCH] VD-151: Various styling fixes

---
 src/components/ApiLogo/ApiLogo.tsx   |  2 +-
 src/components/Redoc/Redoc.tsx       | 12 +-----------
 src/components/SideMenu/SideMenu.tsx |  6 ------
 src/theme.ts                         |  4 ++--
 4 files changed, 4 insertions(+), 20 deletions(-)

diff --git a/src/components/ApiLogo/ApiLogo.tsx b/src/components/ApiLogo/ApiLogo.tsx
index bd959e38..aa2c9418 100644
--- a/src/components/ApiLogo/ApiLogo.tsx
+++ b/src/components/ApiLogo/ApiLogo.tsx
@@ -19,7 +19,7 @@ export class ApiLogo extends React.Component<{ info: OpenAPIInfo }> {
 
     const logo = <LogoImgEl src={logoInfo.url} alt={altText} />;
     return (
-      <LogoWrap style={{ backgroundColor: logoInfo.backgroundColor }}>
+      <LogoWrap style={{ backgroundColor: logoInfo.backgroundColor, padding: '25px 0 20px 0' }}>
         {logoHref ? LinkWrap(logoHref)(logo) : logo}
       </LogoWrap>
     );
diff --git a/src/components/Redoc/Redoc.tsx b/src/components/Redoc/Redoc.tsx
index 2b43e77d..368a6e6e 100644
--- a/src/components/Redoc/Redoc.tsx
+++ b/src/components/Redoc/Redoc.tsx
@@ -12,7 +12,6 @@ import { SideMenu } from '../SideMenu/SideMenu';
 import { StickyResponsiveSidebar } from '../StickySidebar/StickyResponsiveSidebar';
 import { ApiContentWrap, BackgroundStub, RedocWrap } from './styled.elements';
 
-import { SearchBox } from '../SearchBox/SearchBox';
 import { StoreProvider } from '../StoreBuilder';
 
 export interface RedocProps {
@@ -34,7 +33,7 @@ export class Redoc extends React.Component<RedocProps> {
 
   render() {
     const {
-      store: { spec, menu, options, search, marker },
+      store: { spec, menu, options },
     } = this.props;
     const store = this.props.store;
     return (
@@ -44,15 +43,6 @@ export class Redoc extends React.Component<RedocProps> {
             <RedocWrap className="redoc-wrap">
               <StickyResponsiveSidebar menu={menu} className="menu-content">
                 <ApiLogo info={spec.info} />
-                {(!options.disableSearch && (
-                  <SearchBox
-                    search={search!}
-                    marker={marker}
-                    getItemById={menu.getItemById}
-                    onActivate={menu.activateAndScroll}
-                  />
-                )) ||
-                  null}
                 <SideMenu menu={menu} />
               </StickyResponsiveSidebar>
               <ApiContentWrap className="api-content">
diff --git a/src/components/SideMenu/SideMenu.tsx b/src/components/SideMenu/SideMenu.tsx
index 386fed07..5b18cf96 100644
--- a/src/components/SideMenu/SideMenu.tsx
+++ b/src/components/SideMenu/SideMenu.tsx
@@ -6,7 +6,6 @@ import { OptionsContext } from '../OptionsProvider';
 import { MenuItems } from './MenuItems';
 
 import { PerfectScrollbarWrap } from '../../common-elements/perfect-scrollbar';
-import { RedocAttribution } from './styled.elements';
 
 @observer
 export class SideMenu extends React.Component<{ menu: MenuStore; className?: string }> {
@@ -24,11 +23,6 @@ export class SideMenu extends React.Component<{ menu: MenuStore; className?: str
         }}
       >
         <MenuItems items={store.items} onActivate={this.activate} root={true} />
-        <RedocAttribution>
-          <a target="_blank" rel="noopener noreferrer" href="https://github.com/Redocly/redoc">
-            Documentation Powered by ReDoc
-          </a>
-        </RedocAttribution>
       </PerfectScrollbarWrap>
     );
   }
diff --git a/src/theme.ts b/src/theme.ts
index f6554cb0..816f8394 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -4,7 +4,7 @@ const defaultTheme: ThemeInterface = {
   spacing: {
     unit: 5,
     sectionHorizontal: ({ spacing }) => spacing.unit * 8,
-    sectionVertical: ({ spacing }) => spacing.unit * 8,
+    sectionVertical: ({ spacing }) => spacing.unit * 2,
   },
   breakpoints: {
     small: '50rem',
@@ -14,7 +14,7 @@ const defaultTheme: ThemeInterface = {
   colors: {
     tonalOffset: 0.3,
     primary: {
-      main: '#32329f',
+      main: '#030c38',
       light: ({ colors }) => lighten(colors.tonalOffset, colors.primary.main),
       dark: ({ colors }) => darken(colors.tonalOffset, colors.primary.main),
       contrastText: ({ colors }) => readableColor(colors.primary.main),