diff --git a/src/components/ObjectDescription/ObjectDescription.tsx b/src/components/ObjectDescription/ObjectDescription.tsx index 130bf94e..0aa4672a 100644 --- a/src/components/ObjectDescription/ObjectDescription.tsx +++ b/src/components/ObjectDescription/ObjectDescription.tsx @@ -1,10 +1,12 @@ import * as React from 'react'; -import { DarkRightPanel, MiddlePanel, Row, Section } from '../../common-elements'; +import { DarkRightPanel, MiddlePanel, MimeLabel, Row, Section } from '../../common-elements'; import { MediaTypeModel, OpenAPIParser, RedocNormalizedOptions } from '../../services'; import styled from '../../styled-components'; import { OpenAPIMediaType } from '../../types'; +import { DropdownOrLabel } from '../DropdownOrLabel/DropdownOrLabel'; import { MediaTypeSamples } from '../PayloadSamples/MediaTypeSamples'; +import { InvertedSimpleDropdown } from '../PayloadSamples/styled.elements'; import { Schema } from '../Schema'; export interface ObjectDescriptionProps { @@ -64,13 +66,17 @@ export class ObjectDescription extends React.PureComponent - + ); } + + private renderDropdown = props => { + return ; + }; } const MediaSamplesWrap = styled.div` diff --git a/src/components/PayloadSamples/MediaTypeSamples.tsx b/src/components/PayloadSamples/MediaTypeSamples.tsx index 2e1c5517..5fedce01 100644 --- a/src/components/PayloadSamples/MediaTypeSamples.tsx +++ b/src/components/PayloadSamples/MediaTypeSamples.tsx @@ -1,5 +1,7 @@ import * as React from 'react'; +import styled from '../../styled-components'; + import { DropdownProps } from '../../common-elements'; import { MediaTypeModel } from '../../services/models'; import { Markdown } from '../Markdown/Markdown'; @@ -48,7 +50,7 @@ export class MediaTypeSamples extends React.Component + Example {this.props.renderDropdown({ @@ -61,16 +63,20 @@ export class MediaTypeSamples extends React.Component} - + ); } else { const example = examples[examplesNames[0]]; return ( -
+ {example.description && } -
+ ); } } } + +const SamplesWrapper = styled.div` + margin-top: 15px; +`; diff --git a/src/components/PayloadSamples/PayloadSamples.tsx b/src/components/PayloadSamples/PayloadSamples.tsx index aa9d0e1b..7e2a85f0 100644 --- a/src/components/PayloadSamples/PayloadSamples.tsx +++ b/src/components/PayloadSamples/PayloadSamples.tsx @@ -2,11 +2,9 @@ import { observer } from 'mobx-react'; import * as React from 'react'; import { MediaTypeSamples } from './MediaTypeSamples'; -import { MediaTypesSwitch } from '../MediaTypeSwitch/MediaTypesSwitch'; - -import styled from '../../../src/styled-components'; import { MediaContentModel } from '../../services/models'; import { DropdownOrLabel } from '../DropdownOrLabel/DropdownOrLabel'; +import { MediaTypesSwitch } from '../MediaTypeSwitch/MediaTypesSwitch'; import { InvertedSimpleDropdown, MimeLabel } from './styled.elements'; export interface PayloadSamplesProps { @@ -24,13 +22,11 @@ export class PayloadSamples extends React.Component { return ( {mediaType => ( - - - + )} ); @@ -40,7 +36,3 @@ export class PayloadSamples extends React.Component { return ; }; } - -const SamplesWrapper = styled.div` - margin-top: 15px; -`; diff --git a/src/components/PayloadSamples/styled.elements.ts b/src/components/PayloadSamples/styled.elements.ts index c00a55a1..ee2f4a74 100644 --- a/src/components/PayloadSamples/styled.elements.ts +++ b/src/components/PayloadSamples/styled.elements.ts @@ -53,7 +53,7 @@ export const InvertedSimpleDropdown = styled(StyledDropdown)` } .Dropdown-menu { margin: 0; - margin-top: 10px; + margin-top: 2px; } `;