Fix

resources/views/themes/elements/components/field-details.blade.php

@@ -9,22 +9,13 @@
     <div class="sl-stack sl-stack--vertical sl-stack--1 sl-flex sl-flex-1 sl-flex-col sl-items-stretch sl-max-w-full sl-ml-2 @if($expandable) sl-cursor-pointer @endif">
         <div class="sl-flex sl-items-center sl-max-w-full">
             @if($expandable)
-                <div class="sl-flex sl-justify-center sl-w-8 sl--ml-8 sl-pl-3 sl-text-muted" role="button">
+                <div class="sl-flex sl-justify-center sl-w-8 sl--ml-8 sl-pl-3 sl-text-muted expansion-chevrons" role="button">
                     <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="chevron-right"
-                         class="expand-chevron svg-inline--fa fa-chevron-right fa-fw fa-sm sl-icon" role="img"
+                         class="svg-inline--fa fa-chevron-right fa-fw fa-sm sl-icon" role="img"
                          xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
                         <path fill="currentColor"
                               d="M96 480c-8.188 0-16.38-3.125-22.62-9.375c-12.5-12.5-12.5-32.75 0-45.25L242.8 256L73.38 86.63c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0l192 192c12.5 12.5 12.5 32.75 0 45.25l-192 192C112.4 476.9 104.2 480 96 480z"></path>
                     </svg>
-                    <svg aria-hidden="true" focusable="false" data-prefix="fas"
-                         data-icon="chevron-down"
-                         style="display: none"
-                         class="expanded-chevron svg-inline--fa fa-chevron-down fa-fw fa-sm sl-icon"
-                         role="img" xmlns="http://www.w3.org/2000/svg"
-                         viewBox="0 0 448 512">
-                        <path fill="currentColor"
-                              d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"></path>
-                    </svg>
                 </div>
             @endif
             @unless($isArrayBody)
@@ -40,9 +31,11 @@
                 @endif
             @endunless
         </div>
+        @if($description)
         <div class="sl-prose sl-markdown-viewer" style="font-size: 12px;">
             {!! Parsedown::instance()->text($description) !!}
         </div>
+        @endif
         @if($isArrayBody)
             <div class="sl-flex sl-items-baseline sl-text-base">
                 <div class="sl-font-mono sl-font-semibold sl-mr-2">array of:</div>
@@ -54,11 +47,11 @@
         @endif
         @if(!$hasChildren && !is_null($example) && $example != '')
             <div class="sl-stack sl-stack--horizontal sl-stack--2 sl-flex sl-flex-row sl-items-baseline sl-text-muted">
-                <span>Example:</span>
+                <span>Example:</span> <!-- <span> important for spacing -->
                 <div class="sl-flex sl-flex-1 sl-flex-wrap" style="gap: 4px;">
-                    <span class="sl-max-w-full sl-break-all sl-px-1 sl-bg-canvas-tint sl-text-muted sl-rounded sl-border">
+                    <div class="sl-max-w-full sl-break-all sl-px-1 sl-bg-canvas-tint sl-text-muted sl-rounded sl-border">
                         {{ is_array($example) ? json_encode($example) : $example }}
-                    </span>
+                    </div>
                 </div>
             </div>
         @endif

resources/views/themes/elements/endpoint.blade.php

@@ -50,7 +50,7 @@
                             <h3 class="sl-text-2xl sl-leading-snug sl-font-prose">
                                 Headers
                             </h3>
-                            <div class="JsonSchemaViewer">
+                            <div class="sl-text-sm">
                                 @foreach($endpoint->headers as $header => $value)
                                     @component('scribe::themes.elements.components.field-details', [
                                       'name' => $header,
@@ -72,7 +72,7 @@
                         <div class="sl-stack sl-stack--vertical sl-stack--6 sl-flex sl-flex-col sl-items-stretch">
                             <h3 class="sl-text-2xl sl-leading-snug sl-font-prose">URL Parameters</h3>
 
-                            <div class="JsonSchemaViewer">
+                            <div class="sl-text-sm">
                                 @foreach($endpoint->urlParameters as $attribute => $parameter)
                                     @component('scribe::themes.elements.components.field-details', [
                                       'name' => $parameter->name,
@@ -95,7 +95,7 @@
                             <div class="sl-stack sl-stack--vertical sl-stack--6 sl-flex sl-flex-col sl-items-stretch">
                                 <h3 class="sl-text-2xl sl-leading-snug sl-font-prose">Query Parameters</h3>
 
-                                <div class="JsonSchemaViewer">
+                                <div class="sl-text-sm">
                                     @foreach($endpoint->queryParameters as $attribute => $parameter)
                                         @component('scribe::themes.elements.components.field-details', [
                                           'name' => $parameter->name,
@@ -117,7 +117,7 @@
                         <div class="sl-stack sl-stack--vertical sl-stack--6 sl-flex sl-flex-col sl-items-stretch">
                             <h3 class="sl-text-2xl sl-leading-snug sl-font-prose">Body Parameters</h3>
 
-                                <div class="JsonSchemaViewer">
+                                <div class="sl-text-sm">
                                     @component('scribe::themes.elements.components.nested-fields', [
                                       'fields' => $endpoint->nestedBodyParameters,
                                       'endpointId' => $endpoint->endpointId(),
@@ -131,7 +131,7 @@
                             <div class="sl-stack sl-stack--vertical sl-stack--6 sl-flex sl-flex-col sl-items-stretch">
                                 <h3 class="sl-text-2xl sl-leading-snug sl-font-prose">Response Fields</h3>
 
-                                <div class="JsonSchemaViewer">
+                                <div class="sl-text-sm">
                                     @component('scribe::themes.elements.components.nested-fields', [
                                       'fields' => $endpoint->nestedResponseFields,
                                       'endpointId' => $endpoint->endpointId(),