classNames

src/components/Fields/Extensions.tsx

@@ -27,7 +27,7 @@ export class Extensions extends React.PureComponent<ExtensionsProps> {
           <>
             {options.showExtensions &&
               Object.keys(exts).map(key => (
-                <Extension key={key} className="operation-extension">
+                <Extension key={key} className="extension">
                   <FieldLabel> {key.substring(2)}: </FieldLabel>{' '}
                   <ExtensionValue>
                     {typeof exts[key] === 'string' ? exts[key] : JSON.stringify(exts[key])}

src/components/Fields/FieldContstraints.tsx

@@ -11,7 +11,7 @@ export class ConstraintsView extends React.PureComponent<ConstraintsViewProps> {
       return null;
     }
     return (
-      <span>
+      <span className="field-constraints">
         {' '}
         {this.props.constraints.map(constraint => (
           <ConstraintItem key={constraint}> {constraint} </ConstraintItem>

src/components/Fields/FieldDetail.tsx

@@ -16,7 +16,8 @@ function FieldDetailComponent({ value, label, raw }: FieldDetailProps) {
 
   return (
     <div>
-      <FieldLabel> {label} </FieldLabel> <ExampleValue>{stringifyValue}</ExampleValue>
+      <FieldLabel> {label} </FieldLabel>{' '}
+      <ExampleValue className="field-example">{stringifyValue}</ExampleValue>
     </div>
   );
 }

src/components/Fields/FieldDetails.tsx

@@ -53,7 +53,7 @@ export const FieldDetailsComponent = observer((props: FieldProps) => {
   }, [field, showExamples]);
 
   return (
-    <div>
+    <div className="field-details">
       <div>
         <TypePrefix>{schema.typePrefix}</TypePrefix>
         <TypeName>{schema.displayType}</TypeName>
@@ -88,7 +88,7 @@ export const FieldDetailsComponent = observer((props: FieldProps) => {
         {isArrayType && schema.items && <ArrayItemDetails schema={schema.items} />}
       </div>
       {deprecated && (
-        <div>
+        <div className="field-deprecated">
           <Badge type="warning"> {l('deprecated')} </Badge>
         </div>
       )}

src/components/Fields/Pattern.tsx

@@ -18,7 +18,7 @@ export function Pattern(props: { schema: SchemaModel }) {
 
   return (
     <>
-      <PatternLabel>
+      <PatternLabel className="field-pattern">
         {isPatternShown || pattern.length < MAX_PATTERN_LENGTH
           ? pattern
           : `${pattern.substr(0, MAX_PATTERN_LENGTH)}...`}

src/components/Responses/Response.tsx

@@ -28,7 +28,7 @@ export const ResponseView = observer(({ response }: ResponseViewProps): React.Re
   );
 
   return (
-    <div>
+    <div className="response">
       <StyledResponseTitle
         onClick={() => response.toggle()}
         type={type}

src/components/Responses/ResponseHeaders.tsx

@@ -19,7 +19,7 @@ export class ResponseHeaders extends React.PureComponent<ResponseHeadersProps> {
     return (
       <PropertiesTable>
         <HeadersCaption> Response Headers </HeadersCaption>
-        <tbody>
+        <tbody className="response-headers">
           {mapWithLast(headers, (header, isLast) => (
             <Field isLast={isLast} key={header.name} field={header} showExamples={true} />
           ))}