# Compact Menu

The design for the Compact Menu is shown below:

![](https://2584671515-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M4TuOJwf99HMPS1ygqn%2F-M4TuT62SoA3qHZ1oRMw%2F-M4TuUbQxwBYyNOB5nVR%2Frare53.png?generation=1586435334251922\&alt=media)

It has the following Structure:

```
<html>
   <head>
        <title> </title>
   </head>
<body>
     <header class="header">
        <nav class="navbar navbar-static-top">
                <a href="index.html" class="logo navbar-brand float-left text-white text-center">
                        <!--It contains logo-->
                </a>
        <div class="navbar-btn float-left sidebar-toggle">
             <div>
                   <div class="bar1 first"></div>
                   <div class="bar2 second"></div>
                   <div class="bar3 third"></div>
             </div>
        </div>
        <div class="top_right_nav">
             <div class="float-left">
                  <!--It contains Header Left side sections-->
             </div>
        </div>
        </nav>
     </header>
     <!-- start of wrapper -->
     <div class="wrapper">
     <!-- Start Left side menu -->
        <div class="left_aside">

             <!-- sidebar: style can be found in sidebar-->
                 <div class="sidebar">

                     <!--user profile section-->
                     <div class="user_section">
                     <!--user profile content-->
                 </div>
             <!--user profile section-->


             <!--Start Left menu links-->

                 <div id="menu" role="navigation">
                     <ul class="navigation">
                         <li class="menu-dropdown">
                            <a href="#" class="dropdown_head">
                                <i class="menu_icon ti-home text-primary"></i>
                                <p class="mm-text ">
                                    <!--category -->
                                </p>
                            </a>
                            <ul class="sub_menu">
                                <li>
                                    <a href="../pathto/..">
                                        <i class="ti-angle-double-right"></i> 
                                        <!-- page link -->
                                    </a>
                                </li>
                                <li>
                                    <a href="../pathto/..">
                                        <i class="ti-angle-double-right"></i> 
                                        <!-- page link -->
                                    </a>
                                </li>
                            </ul>
                         </li>
                         ....
                         ....
                         ....
                         ....
                         ....
                     </ul>
                 </div>

             <!--End Left menu links-->

        </div>
        <!-- sidebar: style can be found in sidebar-->


     <!-- End of Left side menu -->
     <!-- Start of right Content -->

        <div class="right-aside view-port-height">

               <!--Start of Content Header (Page header) -->

               <div class="content-header container-fluid bg-white">
                     <!-- It contains page Header -->
                </div>

              <!--End of Content Header (Page header) -->


               <!--Start of Main content -->

                <div class="content">

                     <!--page content --!>

                </div>
               <!-- End of Main content --!>

         </div>

       <!-- End of right Content -->

</div>
<!--End of wrapper-->

<!--start of footer-->

<footer>
    <div class="bg-white container-fluid">
        <div class="row">
            <div class="col-lg-12 text-center">
                 <!-- It contains Footer content -->
            </div>
        </div>
    </div>

</footer>

<!--end of footer-->

</body>
</html>
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://lorvent.gitbook.io/rare/html/starts-new-page/compact-menu.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
