added new slot on navigation bar

Author: mrin9

docs/api.html

@@ -69,7 +69,7 @@
       <h2> Attributes</h2> 
       <div class='table-block' style="display:flex; flex-direction: column;">
 
-        <div class='table-title'> General </div>
+        <div class='table-title' id="general"> General </div>
         <table class="m-table">
           <tr>
             <td class="attr-col mono-bold right">spec-url </td>
@@ -83,7 +83,7 @@ <h2> Attributes</h2>
           </tr>
         </table>
 
-        <div class='table-title'> UI Colors and Fonts </div>
+        <div class='table-title' id="colors"> UI Colors and Fonts </div>
         <table class="m-table">
           <tr>
             <td class=" attr-col mono-bold right">theme </td>
@@ -115,7 +115,7 @@ <h2> Attributes</h2>
           </tr>
         </table>
 
-        <div class='table-title'> Navigation bar colors (only applicable in read-mode)</div>
+        <div class='table-title' id="nav-bar-colors"> Navigation bar colors (only applicable in read-mode)</div>
         <table class="m-table">
           <tr>
             <td class=" attr-col mono-bold right">nav-bg-color </td>
@@ -144,7 +144,7 @@ <h2> Attributes</h2>
           </tr>          
         </table>
 
-        <div class='table-title'> UI Layout & Placement</div>
+        <div class='table-title' id='layout'> UI Layout & Placement</div>
         <table class="m-table">
           <tr>
             <td class="attr-col mono-bold right"> layout </td>
@@ -204,7 +204,7 @@ <h2> Attributes</h2>
           </tr>
         </table>
 
-        <div class='table-title'> Hide/Show Sections </div>
+        <div class='table-title' id='toggle-sections'> Hide/Show Sections </div>
         <table class="m-table">
           <tr>
             <td class="attr-col mono-bold right">show-info</td>
@@ -279,7 +279,7 @@ <h2> Attributes</h2>
           </tr>
         </table>
 
-        <div class='table-title'> API Server</div>
+        <div class='table-title' id='api-servers'> API Server</div>
         <table class="m-table">
           <tr>
             <td class="attr-col mono-bold right">api-key-name</td>
@@ -368,6 +368,10 @@ <h2> Slots</h2>
             <td class="mono-bold right">footer</td>
             <td class="gray"> The conents of this slot will appear at the bottom of the spec</td>
           </tr>
+          <tr>
+            <td class="mono-bold right">nav-logo</td>
+            <td class="gray"> The conents of this slot will appear on Side navigation bar (only available in read-mode)</td>
+          </tr>
         </table>
       </div>
     </div>  

docs/specs/basic.json

@@ -2,6 +2,7 @@
   "swagger": "2.0",
   "info": {
     "title": "Basic Spec",
+    "version" : "1.0.0",
     "description": ""
   },
   "consumes": [ "application/json"],

src/rapidoc.js

@@ -501,9 +501,12 @@ export default class RapiDoc extends LitElement {
       ${(this.allowSearch === 'false')
         ? ''
         : html`
-          <div style="position:sticky; top:0; display:flex; align-items: center; padding:16px 24px; background: var(--bg3);">  
-            <input id="nav-bar-search" type="text" placeholder="search" @change="${this.onSearchChange}" style="flex:1" spellcheck="false" >
-            <div style="margin: 6px 5px 0 -24px; font-size:var(--title-font-size); cursor:pointer;">&#x23ce;</div>
+          <div style="position:sticky; top:0; display:flex; flex-direction:column; align-items: stretch; padding:16px 24px; background: var(--bg3);"> 
+            <slot name="nav-logo" class="logo"></slot>
+            <div style="display:flex;">
+              <input id="nav-bar-search" style="width:100%" type="text" placeholder="search" @change="${this.onSearchChange}"  spellcheck="false" >
+              <div style="margin: 6px 5px 0 -24px; font-size:var(--title-font-size); cursor:pointer;">&#x23ce;</div>
+            </div>  
             ${this.matchPaths
               ? html`
                 <div style='margin-left:10px; cursor:pointer;' @click = '${this.onClearSearch}'> Clear </div>`