improve webhook anotations styles

Author: mrin9

dist/rapidoc-min.js

@@ -20,8 +20,9 @@
       show-info = "true"
       show-header = "false"
       allow-server-selection = "false"
-      render-style = "view"
+      render-style = "read"
       allow-try = "true" 
+      use-path-in-nav-bar = "true"
       regular-font = 'Open Sans'
       mono-font = "Roboto Mono"
     > </rapi-doc>

dist/rapidoc-min.js.gz

@@ -15,8 +15,6 @@ info:
 paths:
   /pet/findByTags:
     get:
-      tags:
-        - pet
       summary: Finds Pets by tags
       description: >-
         Muliple tags can be provided with comma seperated strings. Use tag1,

dist/report.html

@@ -46,7 +46,7 @@ function endpointHeadTemplate(path) {
     <div class="method ${path.method} ${path.deprecated ? 'deprecated' : ''}"> ${path.method} </div> 
     <div class="path ${path.deprecated ? 'deprecated' : ''}"> 
       ${path.path} 
-      ${path.isWebhook ? html`<span style="color:var(--primary-color)"> (Webhook) </span>` : ''}
+      ${path.isWebhook ? html`<span style="font-family: var(--font-regular); font-size: var(--); font-size: var(--font-size-small); color:var(--primary-color); margin-left: 16px"> Webhook</span>` : ''}
     </div>
     ${path.deprecated
       ? html`

docs/examples/open-api-3-1.html

@@ -41,11 +41,15 @@ export function expandedEndpointBodyTemplate(path, tagName = '') {
     ${path.deprecated ? html`<div class="bold-text red-text"> DEPRECATED </div>` : ''}
     ${html`
       <h2> ${path.shortSummary || `${path.method.toUpperCase()} ${path.path}`}</h2>
-      <div class='mono-font part="section-operation-url" regular-font-size' style='padding: 8px 0; color:var(--fg3)'> 
-        ${path.isWebhook ? html`<span style="color:var(--primary-color)"> WEBHOOK </span>` : ''}
-        <span part="label-operation-method" class='regular-font upper method-fg bold-text ${path.method}'>${path.method}</span> 
-        <span part="label-operation-path">${path.path}</span>
-      </div>
+      ${path.isWebhook
+        ? html`<span style="color:var(--primary-color); font-weight:bold; font-size: var(--font-size-regular);"> WEBHOOK </span>`
+        : html`
+          <div class='mono-font part="section-operation-url" regular-font-size' style='padding: 8px 0; color:var(--fg3)'> 
+            <span part="label-operation-method" class='regular-font upper method-fg bold-text ${path.method}'>${path.method}</span> 
+            <span part="label-operation-path">${path.path}</span>
+          </div>
+        `
+      }
       <slot name="${path.elementId}"></slot>`
     }
     ${path.description ? html`<div class="m-markdown"> ${unsafeHTML(marked(path.description))}</div>` : ''}

docs/rapidoc-min.js

@@ -193,11 +193,11 @@ export default function navbarTemplate() {
                 }}'
               >
                 <span style = "${p.deprecated ? 'filter:opacity(0.5)' : ''}">
+                  ${p.isWebhook ? html`<span style="font-weight:bold; margin-right:8px; font-size: calc(var(--font-size-small) - 2px)">WEBHOOK</span>` : ''}
                   ${this.usePathInNavBar === 'true'
                     ? html`<span class='mono-font'>${p.method.toUpperCase()} ${p.path}</span>`
                     : p.summary || p.shortSummary
                   }
-                  ${p.isWebhook ? '(Webhook)' : ''}
                 </span>
               </div>`)}
             </div>