<!-- Target Button -->
                                 <button  class="gk-button button-outline-info"  data-sidenav-target="sideNavComponent">დამაჭირე</button>
                         
                                 <!-- Target Component -->
                                 <template  data-sidenav-id="sideNavComponent">
                                   <div  class="gk-sidenav-wrapper">
                                     <div  class="gk-sidenav-header">
                                       <span  class="gk-sidenav-title">მენიუ</span>
                                       <button  class="gk-button button-icon sidenav-close"  sidenav-close="true">
                                         <i  class="material-symbols-outlined smaller-icon">close</i>
                                       </button>
                                     </div>
                                     <div  class="gk-sidenav-content">
                                       <div  class="component-list">
                                         <a  class="gk-button component-listitem"  href="/accordion">
                                           Accordion
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/badge">
                                           Badges
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/bottom-sheet">
                                           Bottom Sheet
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/breadcrumb">
                                           Breadcrumb
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/button">
                                           Button
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/card">
                                           Card
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/carousel">
                                           Carousel
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/checkbox">
                                           Checkbox
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/confirmation">
                                           Confirmation
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/dialog">
                                           Dialog
                                         </a>
                                         <!--
                                 <a  class="gk-button component-listitem gk-divider "  href="/divider">
                                     Divider
                                 </a>
                                 
                                         <a class="gk-button component-listitem gk-divider "
                                             href="/expansion-panel">
                                             Expansion Panel
                                         </a>
                                         -->
                                         <a  class="gk-button component-listitem"  href="/input">
                                           Input
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/list">
                                           List
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/menu">
                                           Menu
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/paginator">
                                           Paginator
                                         </a>
                                         <a class="gk-button component-listitem"
                                           href="/progress-spinner">
                                           Progress Spinner
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/select">
                                           Select
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/sidenav">
                                           Sidenav
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/table">
                                           Table
                                         </a>
                                         <a  class="gk-button component-listitem"  href="/tab">
                                           Tab
                                         </a>
                                         <a  class="gk-button component-listitem">
                                           Toast
                                         </a>
                                         <a  class="gk-button component-listitem">
                                           Tooltip
                                         </a>
                                       </div>
                                     </div>
                                   </div>
                                 </template>