From 782ef77080ec76b033805840be5b4ea1f8922160 Mon Sep 17 00:00:00 2001
From: Roman Hotsiy <gotsijroman@gmail.com>
Date: Mon, 28 May 2018 21:45:34 +0300
Subject: [PATCH] feat: new theme option: nestingSpacing

---
 src/common-elements/fields-layout.ts | 6 ++++--
 src/theme.ts                         | 4 +++-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/common-elements/fields-layout.ts b/src/common-elements/fields-layout.ts
index baee4635a4..d1fa7ced00 100644
--- a/src/common-elements/fields-layout.ts
+++ b/src/common-elements/fields-layout.ts
@@ -114,12 +114,13 @@ export const PropertyBullet = styled.span`
 `;
 
 export const InnerPropertiesWrap = styled.div`
-  padding: 1em;
+  padding: ${({ theme }) => theme.schemaView.nestingSpacing};
 `;
 
 export const PropertiesTable = styled.table`
   border-collapse: collapse;
   border-radius: 3px;
+  font-size: ${props => props.theme.baseFont.size};
 
   border-spacing: 0;
   width: 100%;
@@ -140,7 +141,8 @@ export const PropertiesTable = styled.table`
     ${InnerPropertiesWrap}
     ${InnerPropertiesWrap}
     ${InnerPropertiesWrap} {
-    margin: 1em 0 1em 1em;
+    margin: ${({ theme }) => theme.schemaView.nestingSpacing};
+    margin-right: 0;
     background: #f0f0f0;
   }
 
diff --git a/src/theme.ts b/src/theme.ts
index ae0b53f9cf..9bdde3bb5c 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -32,6 +32,7 @@ const defaultTheme: ThemeInterface = {
     typeNameColor: theme => transparentize(0.2, theme.colors.text),
     typeTitleColor: theme => theme.schemaView.typeNameColor,
     requireLabelColor: theme => theme.colors.error,
+    nestingSpacing: '1em',
   },
   baseFont: {
     size: '14px',
@@ -135,6 +136,7 @@ export interface ResolvedThemeInterface {
     typeNameColor: string;
     typeTitleColor: string;
     requireLabelColor: string;
+    nestingSpacing: string;
   };
   baseFont: {
     size: string;
@@ -174,5 +176,5 @@ export type primitive = string | number | boolean | undefined | null;
 export type AdvancedThemeDeep<T> = T extends primitive
   ? T | ((theme: ResolvedThemeInterface) => T)
   : AdvancedThemeObject<T>;
-export type AdvancedThemeObject<T> = { [P in keyof T]: AdvancedThemeDeep<T[P]> };
+export type AdvancedThemeObject<T> = { [P in keyof T]?: AdvancedThemeDeep<T[P]> };
 export type ThemeInterface = AdvancedThemeObject<ResolvedThemeInterface>;