feat: new theme option: nestingSpacing

This commit is contained in:
Roman Hotsiy 2018-05-28 21:45:34 +03:00
parent 6b1e8e75b0
commit 782ef77080
No known key found for this signature in database
GPG Key ID: 5CB7B3ACABA57CB0
2 changed files with 7 additions and 3 deletions

View File

@ -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;
}

View File

@ -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>;