From db846052d80097b2f4f872a81cd3d6928ae5f34b Mon Sep 17 00:00:00 2001
From: Cameron Koegel <ckoegel@bandwidth.com>
Date: Fri, 9 Sep 2022 12:02:19 -0400
Subject: [PATCH] classNames

---
 src/components/Fields/Extensions.tsx         | 2 +-
 src/components/Fields/FieldContstraints.tsx  | 2 +-
 src/components/Fields/FieldDetail.tsx        | 3 ++-
 src/components/Fields/FieldDetails.tsx       | 4 ++--
 src/components/Fields/Pattern.tsx            | 2 +-
 src/components/Responses/Response.tsx        | 2 +-
 src/components/Responses/ResponseHeaders.tsx | 2 +-
 7 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/components/Fields/Extensions.tsx b/src/components/Fields/Extensions.tsx
index 887adfec..bac8d637 100644
--- a/src/components/Fields/Extensions.tsx
+++ b/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])}
diff --git a/src/components/Fields/FieldContstraints.tsx b/src/components/Fields/FieldContstraints.tsx
index c92e8f5c..7e5c831f 100644
--- a/src/components/Fields/FieldContstraints.tsx
+++ b/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>
diff --git a/src/components/Fields/FieldDetail.tsx b/src/components/Fields/FieldDetail.tsx
index 53fb89bf..b24619a8 100644
--- a/src/components/Fields/FieldDetail.tsx
+++ b/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>
   );
 }
diff --git a/src/components/Fields/FieldDetails.tsx b/src/components/Fields/FieldDetails.tsx
index 36a43d3e..a47a2dff 100644
--- a/src/components/Fields/FieldDetails.tsx
+++ b/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>
       )}
diff --git a/src/components/Fields/Pattern.tsx b/src/components/Fields/Pattern.tsx
index 3b0c17ea..57d324e3 100644
--- a/src/components/Fields/Pattern.tsx
+++ b/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)}...`}
diff --git a/src/components/Responses/Response.tsx b/src/components/Responses/Response.tsx
index 117b8fb5..9fe82c39 100644
--- a/src/components/Responses/Response.tsx
+++ b/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}
diff --git a/src/components/Responses/ResponseHeaders.tsx b/src/components/Responses/ResponseHeaders.tsx
index 0e97e175..7da94a76 100644
--- a/src/components/Responses/ResponseHeaders.tsx
+++ b/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} />
           ))}