Compact
It contains Compact menu part which we can include in Compact menu layout.
<div class="left_aside">
<!-- sidebar: style can be found in sidebar-->
<div class="sidebar1">
<!--user profile section-->
<div class="user_section">
<div class="row">
<div class="col-12 text-center">
<img src="img/admin.jpg" alt="user not found" class="rounded-circle">
</div>
</div>
</div>
<div id="menu" role="navigation">
<ul class="navigation">
<li class="menu-dropdown {% if (page == 'index1') or (page == 'index2') or (page == 'index3') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-home text-primary"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p class="mm-text ">Dashboard</p>
</a>
<ul class="sub_menu">
<li {% if page =='index1'%} class="active" id="active" {% endif %}>
<a href="index.html">
<i class="ti-angle-double-right"></i> Dashboard 1
</a>
</li>
<li {% if page =='index2'%} class="active" id="active" {% endif %}>
<a href="index2.html">
<i class="ti-angle-double-right"></i> Dashboard 2
</a>
</li>
<li {% if page =='index3'%} class="active" id="active" {% endif %}>
<a href="index3.html">
<i class="ti-angle-double-right"></i> Dashboard 3
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'Widgets1') or (page == 'Widgets2') or (page == 'Widgets3') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-palette text-danger"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p class="mm-text "> Widgets</p>
</a>
<ul class="sub_menu">
<li {% if page =='Widgets1'%} class="active" id="active" {% endif %}>
<a href="widgets1.html">
<i class="ti-angle-double-right"></i> Widgets 1
</a>
</li>
<li {% if page =='Widgets2'%} class="active" id="active" {% endif %}>
<a href="widgets2.html">
<i class="ti-angle-double-right"></i> Widgets 2
</a>
</li>
<li {% if page =='Widgets3'%} class="active" id="active" {% endif %}>
<a href="widgets3.html">
<i class="ti-angle-double-right"></i> Widgets 3
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'Slider') or (page == 'gridStack') or (page == 'cropper') or (page == 'animations') or (page == 'Timeline1') or (page == 'Timeline2') or (page == 'Transitions') or (page == 'Rating')
or (page == 'Notifications') or (page == 'Notifications2') or (page == 'PNotify') or (page == 'Swiper') or (page == 'PricingTable') or (page == 'JStree') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-paint-bucket text-success"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>
UI features
</p>
</a>
<ul class="sub_menu">
<li {% if page =='Slider'%} class="active" id="active" {% endif %}>
<a href="sliders.html">
<i class="ti-angle-double-right"></i> Sliders
</a>
</li>
<li {% if page =='gridStack'%} class="active" id="active" {% endif %}>
<a href="grid_stack.html">
<i class="ti-angle-double-right"></i> Grid Stack
</a>
</li>
<li {% if page =='cropper'%} class="active" id="active" {% endif %}>
<a href="cropper.html">
<i class="ti-angle-double-right"></i> Cropper
</a>
</li>
<li {% if page =='animations'%} class="active" id="active" {% endif %}>
<a href="animations.html">
<i class="ti-angle-double-right"></i> Animations
</a>
</li>
<li class="{% if (page == 'Timeline1') or (page == 'Timeline2') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="ti-angle-double-right"></i> Timeline
<span class="ti-angle-up"></span>
</a>
<ul class="sub_menu sub-submenu">
<li {% if page =='Timeline1'%} class="active" id="active" {% endif %}>
<a href="timeline1.html">
Timeline 1
</a>
</li>
<li {% if page =='Timeline2'%} class="active" id="active" {% endif %}>
<a href="timeline2.html">
Timeline 2
</a>
</li>
</ul>
</li>
<li {% if page =='Transitions'%} class="active" id="active" {% endif %}>
<a href="transitions.html">
<i class="ti-angle-double-right"></i> Transitions
</a>
</li>
<li {% if page =='Rating'%} class="active" id="active" {% endif %}>
<a href="rating.html">
<i class="ti-angle-double-right"></i> Ratings
</a>
</li>
<li class="{% if (page == 'Notifications') or (page == 'Notifications2') or (page == 'PNotify') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="ti-angle-double-right"></i> Notifications
<span class="ti-angle-up"></span>
</a>
<ul class="sub_menu sub-submenu">
<li {% if page =='Notifications'%} class="active" id="active" {% endif %}>
<a href="notifications.html">
Notifications 1
</a>
</li>
<li {% if page =='Notifications2'%} class="active" id="active" {% endif %}>
<a href="notifications2.html">
Notifications 2
</a>
</li>
<li {% if page =='PNotify'%} class="active" id="active" {% endif %}>
<a href="p_notify.html">
P-Notify
</a>
</li>
</ul>
</li>
<li {% if page =='Swiper'%} class="active" id="active" {% endif %}>
<a href="swiper.html">
<i class="ti-angle-double-right"></i> Swiper
</a>
</li>
<li {% if page =='PricingTable'%} class="active" id="active" {% endif %}>
<a href="pricing_table.html">
<i class="ti-angle-double-right"></i> Pricing Tables
</a>
</li>
<li {% if page =='JStree'%} class="active" id="active" {% endif %}>
<a href="jstree.html">
<i class="ti-angle-double-right"></i>Js tree
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'generalComponents') or (page == 'buttons') or (page == 'RadioCheckbox') or (page == 'dateTimePicker') or (page == 'Modals') or (page == 'alerts') or (page == 'advancedAlerts') or (page == 'SweetAlert')
or (page == 'Navbars') or (page == 'fileUpload') or (page == 'GridView') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-world text-warning"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>
Components
</p>
</a>
<ul class="sub_menu">
<li {% if page =='generalComponents'%} class="active" id="active" {% endif %}>
<a href="general_components.html">
<i class="ti-angle-double-right"></i> General Components
</a>
</li>
<li {% if page =='buttons'%} class="active" id="active" {% endif %}>
<a href="buttons.html">
<i class="ti-angle-double-right"></i> Buttons
</a>
</li>
<li {% if page =='RadioCheckbox'%} class="active" id="active" {% endif %}>
<a href="radio_checkbox.html">
<i class="ti-angle-double-right"></i> Radio and Checkboxes
</a>
</li>
<li {% if page =='dateTimePicker'%} class="active" id="active" {% endif %}>
<a href="datetime_picker.html">
<i class="ti-angle-double-right"></i> Datetime Picker
</a>
</li>
<li {% if page =='Modals'%} class="active" id="active" {% endif %}>
<a href="modals.html">
<i class="ti-angle-double-right"></i> Modals
</a>
</li>
<li class="{% if (page == 'alerts') or (page == 'advancedAlerts') or (page == 'SweetAlert') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="ti-angle-double-right"></i> Alerts
<span class="ti-angle-up"></span>
</a>
<ul class="sub_menu sub-submenu">
<li {% if page =='alerts'%} class="active" id="active" {% endif %}>
<a href="alerts.html">
Alerts
</a>
</li>
<li {% if page =='advancedAlerts'%} class="active" id="active" {% endif %}>
<a href="advanced_alerts.html">
Advanced Alerts
</a>
</li>
<li {% if page =='SweetAlert'%} class="active" id="active" {% endif %}>
<a href="sweetalerts.html">
Sweet Alerts
</a>
</li>
</ul>
</li>
<li {% if page =='Navbars'%} class="active" id="active" {% endif %}>
<a href="navbars.html">
<i class="ti-angle-double-right"></i> Navbars
</a>
</li>
<li {% if page =='fileUpload'%} class="active" id="active" {% endif %}>
<a href="file_upload.html">
<i class="ti-angle-double-right"></i> File Uploads
</a>
</li>
<li {% if page =='GridView'%} class="active" id="active" {% endif %}>
<a href="grid_view.html">
<i class="ti-angle-double-right"></i> Grid View
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'cards') or (page == 'advancedCards') or (page == 'draggableCards') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="ti-layers-alt menu_icon text-info"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>Cards</p>
</a>
<ul class="sub_menu">
<li {% if page =='cards'%} class="active" id="active" {% endif %}>
<a href="cards.html">
<i class="ti-angle-double-right"></i> Basic Cards
</a>
</li>
<li {% if page =='advancedCards'%} class="active" id="active" {% endif %}>
<a href="advanced_cards.html">
<i class="ti-angle-double-right"></i> Advanced Cards
</a>
</li>
<li {% if page =='draggableCards'%} class="active" id="active" {% endif %}>
<a href="draggable_cards.html">
<i class="ti-angle-double-right"></i> Draggable Cards
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'basicFormElements') or (page == 'advancedFormElements') or (page == 'AdvancedFormElements2') or (page == 'Summernote') or (page == 'Tinymce')
or (page == 'formlayouts') or (page == 'formWizards') or (page == 'formValidation') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-pencil-alt text-danger"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>Forms</p>
</a>
<ul class="sub_menu">
<li class="{% if (page == 'basicFormElements') or (page == 'advancedFormElements') or (page == 'AdvancedFormElements2') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="ti-angle-double-right"></i> Form Elements
<span class="ti-angle-up"></span>
</a>
<ul class="sub_menu sub-submenu">
<li {% if page =='basicFormElements'%} class="active" id="active" {% endif %}>
<a href="basic_form_elements.html">
Basic Form Elements
</a>
</li>
<li {% if page =='advancedFormElements'%} class="active" id="active" {% endif %}>
<a href="advanced_form_elements.html">
Advanced Form Elements 1
</a>
</li>
<li {% if page =='AdvancedFormElements2'%} class="active" id="active" {% endif %}>
<a href="advanced_form_elements2.html">
Advanced Form Elements 2
</a>
</li>
</ul>
</li>
<li class="{% if (page == 'Summernote') or (page == 'Tinymce') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="ti-angle-double-right"></i> Form Editors
<span class="ti-angle-up"></span>
</a>
<ul class="sub_menu sub-submenu">
<li {% if page =='Summernote'%} class="active" id="active" {% endif %}>
<a href="summernote.html">Summernote</a>
</li>
<li {% if page =='Tinymce'%} class="active" id="active" {% endif %}>
<a href="tinymce.html">Tinymce</a>
</li>
</ul>
</li>
<li {% if page =='formlayouts'%} class="active" id="active" {% endif %}>
<a href="form_layouts.html">
<i class="ti-angle-double-right"></i> Form Layouts
</a>
</li>
<li {% if page =='formWizards'%} class="active" id="active" {% endif %}>
<a href="form_wizards.html">
<i class="ti-angle-double-right"></i> Form Wizards
</a>
</li>
<li {% if page =='formValidation'%} class="active" id="active" {% endif %}>
<a href="form_validation.html">
<i class="ti-angle-double-right"></i> Form Validations
</a>
</li>
</ul>
</li>
<li {% if page =='calendar'%} class="active" id="active" {% endif %}>
<a href="calendar.html">
<i class="menu_icon ti-calendar text-warning"></i>
<p>Calendar</p>
</a>
</li>
<li class="menu-dropdown {% if (page == 'ThemifyIcons') or (page == 'fontawesomeIcons') or (page == 'IonIcons') or (page == 'LineIcons') or (page == 'VaadinIcons') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-package text-purple"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>Icons</p>
</a>
<ul class="sub_menu">
<li {% if page =='ThemifyIcons'%} class="active" id="active" {% endif %}>
<a href="themify_icons.html">
<i class="ti-angle-double-right"></i> Themify Icons
</a>
</li>
<li {% if page =='fontawesomeIcons'%} class="active" id="active" {% endif %}>
<a href="fontawesome_icons.html">
<i class="ti-angle-double-right"></i> Fontawesome Icons
</a>
</li>
<li {% if page =='IonIcons'%} class="active" id="active" {% endif %}>
<a href="ion_icons.html">
<i class="ti-angle-double-right"></i> Ion Icons
</a>
</li>
<li {% if page =='LineIcons'%} class="active" id="active" {% endif %}>
<a href="simple_line_icons.html">
<i class="ti-angle-double-right"></i> Simple Line Icons
</a>
</li>
<li {% if page =='VaadinIcons'%} class="active" id="active" {% endif %}>
<a href="vaadin_icons.html">
<i class="ti-angle-double-right"></i> Vaadin Icons
</a>
</li>
</ul>
</li>
<li {% if page =='colorPalette'%} class="active" id="active" {% endif %}>
<a href="color_palette.html">
<i class="menu_icon ti-brush text-mint"></i>
<p>Color Palette</p>
</a>
</li>
<li {% if page =='Typography'%} class="active" id="active" {% endif %}>
<a href="typography.html">
<i class="menu_icon ti-smallcap text-primary"></i>
<p>Typography</p>
</a>
</li>
<li class="menu-dropdown {% if (page == 'Inbox') or (page == 'SentMail') or (page == 'emailView') or (page == 'compose') or (page == 'drafts') or (page == 'Trash') or (page == 'allMails') %} %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-email text-danger"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>Emails</p>
</a>
<ul class="sub_menu">
<li {% if page =='Inbox'%} class="active" id="active" {% endif %}>
<a href="inbox.html">
<i class="ti-angle-double-right"></i> Inbox
</a>
</li>
<li {% if page =='SentMail'%} class="active" id="active" {% endif %}>
<a href="sent_mail.html">
<i class="ti-angle-double-right"></i> Sent Mail
</a>
</li>
<li {% if page =='emailView'%} class="active" id="active" {% endif %}>
<a href="email_view.html">
<i class="ti-angle-double-right"></i> View Mail
</a>
</li>
<li {% if page =='compose'%} class="active" id="active" {% endif %}>
<a href="compose.html">
<i class="ti-angle-double-right"></i> Compose
</a>
</li>
<li {% if page =='drafts'%} class="active" id="active" {% endif %}>
<a href="drafts.html">
<i class="ti-angle-double-right"></i> Drafts
</a>
</li>
<li {% if page =='Trash'%} class="active" id="active" {% endif %}>
<a href="trash.html">
<i class="ti-angle-double-right"></i> Trash
</a>
</li>
<li {% if page =='allMails'%} class="active" id="active" {% endif %}>
<a href="all_mails.html">
<i class="ti-angle-double-right"></i> All Mails
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'Profile1') or (page == 'Profile2') or (page == 'UserList') or (page == 'addUser') or (page == 'deleteuser')%} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-user text-success"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>Users</p>
</a>
<ul class="sub_menu">
<li {% if page =='Profile1'%} class="active" id="active" {% endif %}>
<a href="profile1.html">
<i class="ti-angle-double-right"></i> User Profile 1
</a>
</li>
<li {% if page =='Profile2'%} class="active" id="active" {% endif %}>
<a href="profile2.html">
<i class="ti-angle-double-right"></i> User Profile 2
</a>
</li>
<li {% if page =='UserList'%} class="active" id="active" {% endif %}>
<a href="user_list.html">
<i class="ti-angle-double-right"></i> User List
</a>
</li>
<li {% if page =='addUser'%} class="active" id="active" {% endif %}>
<a href="add_user.html">
<i class="ti-angle-double-right"></i> Add User
</a>
</li>
<li {% if page =='deleteuser'%} class="active" id="active" {% endif %}>
<a href="delete_user.html">
<i class="ti-angle-double-right"></i> Delete User
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'SimpleTables') or (page == 'fooTables') %} active{% endif %}">
<a href="#" class="dropdown_head"> <i class="menu_icon ti-view-grid text-purple"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>Tables</p>
</a>
<ul class="sub_menu">
<li {% if page =='SimpleTables'%} class="active" id="active" {% endif %}>
<a href="simple_tables.html">
<i class="ti-angle-double-right"></i> Simple tables
</a>
</li>
<li {% if page =='fooTables'%} class="active" id="active" {% endif %}>
<a href="foo_tables.html">
<i class="ti-angle-double-right"></i> Foo Tables
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'SimpleDatatables') or (page == 'datatables') or (page == 'advancedDatatables') %} active{% endif %}">
<a href="#" class="dropdown_head"> <i class="menu_icon ti-server text-warning"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>Data Tables</p>
</a>
<ul class="sub_menu">
<li {% if page =='SimpleDatatables'%} class="active" id="active" {% endif %}>
<a href="simple_datatables.html">
<i class="ti-angle-double-right"></i> Simple Datatables
</a>
</li>
<li {% if page =='datatables'%} class="active" id="active" {% endif %}>
<a href="datatables.html">
<i class="ti-angle-double-right"></i> Datatables
</a>
</li>
<li {% if page =='advancedDatatables'%} class="active" id="active" {% endif %}>
<a href="advanced_datatables.html">
<i class="ti-angle-double-right"></i> Advanced Datatables
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'lineEcharts') or (page == 'barEcharts') or (page == 'pieEcharts') %} active{% endif %}">
<a href="#" class="dropdown_head"> <i class="menu_icon ti-pie-chart text-primary"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>E charts</p>
</a>
<ul class="sub_menu">
<li {% if page =='lineEcharts'%} class="active" id="active" {% endif %}>
<a href="echart_line.html">
<i class="ti-angle-double-right"></i> Line Echarts
</a>
</li>
<li {% if page =='barEcharts'%} class="active" id="active" {% endif %}>
<a href="echart_bar.html">
<i class="ti-angle-double-right"></i> Bar Echarts
</a>
</li>
<li {% if page =='pieEcharts'%} class="active" id="active" {% endif %}>
<a href="echart_pie.html">
<i class="ti-angle-double-right"></i> Pie Ecahrts
</a>
</li>
</ul>
</li>
<li {% if page =='MorrisCharts'%} class="active" id="active" {% endif %}>
<a href="morris_chart.html">
<i class="menu_icon ti-pulse text-purple"></i>
<p>Morris Charts</p>
</a>
</li>
<li {% if page =='SparklineChart'%} class="active" id="active" {% endif %}>
<a href="sparkline_charts.html">
<i class="menu_icon ti-stats-down text-mint"></i>
<p>Sparkline Charts</p>
</a>
</li>
<li class="menu-dropdown {% if (page == 'LineChartist') or (page == 'barChartist') or (page == 'PieChartist') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-bar-chart text-danger"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>
Chartist
</p>
</a>
<ul class="sub_menu">
<li {% if page =='LineChartist'%} class="active" id="active" {% endif %}>
<a href="line_chartist.html">
<i class="ti-angle-double-right"></i> Line Chartist
</a>
</li>
<li {% if page =='barChartist'%} class="active" id="active" {% endif %}>
<a href="bar_chartist.html">
<i class="ti-angle-double-right"></i> Bar Chartist
</a>
</li>
<li {% if page =='PieChartist'%} class="active" id="active" {% endif %}>
<a href="pie_chartist.html">
<i class="ti-angle-double-right"></i> Pie Chartist
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'c3LineChart') or (page == 'c3BarChart') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-bar-chart-alt text-info"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>
C3 Charts
</p>
</a>
<ul class="sub_menu">
<li {% if page =='c3LineChart'%} class="active" id="active" {% endif %}>
<a href="c3_line_chart.html">
<i class="ti-angle-double-right"></i> C3 Line Charts
</a>
</li>
<li {% if page =='c3BarChart'%} class="active" id="active" {% endif %}>
<a href="c3_bar_chart.html">
<i class="ti-angle-double-right"></i> C3 Bar Charts
</a>
</li>
</ul>
</li>
<li {% if page =='NDV3Charts'%} class="active" id="active" {% endif %}>
<a href="nvd3_charts.html">
<i class="menu_icon ti-stats-up text-warning"></i>
<p>NVD3 Charts</p>
</a>
</li>
<li {% if page =='Rickshaw'%} class="active" id="active" {% endif %}>
<a href="rickshaw.html">
<i class="menu_icon ti-power-off text-primary"></i>
<p>Rickshaw</p>
</a>
</li>
<li {% if page =='PerityCharts'%} class="active" id="active" {% endif %}>
<a href="peity_charts.html">
<i class="menu_icon ti-bolt text-purple"></i>
<p>Peity Charts</p>
</a>
</li>
<li class="menu-dropdown {% if (page == 'flotLineCharts') or (page == 'flotBarCharts') or (page == 'flotPieCharts') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-pulse text-danger"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>
Flot Charts
</p>
</a>
<ul class="sub_menu">
<li {% if page =='flotLineCharts'%} class="active" id="active" {% endif %}>
<a href="flot_line_charts.html">
<i class="ti-angle-double-right"></i> Flot Line Charts
</a>
</li>
<li {% if page =='flotBarCharts'%} class="active" id="active" {% endif %}>
<a href="flot_bar_charts.html">
<i class="ti-angle-double-right"></i> Flot Bar Charts
</a>
</li>
<li {% if page =='flotPieCharts'%} class="active" id="active" {% endif %}>
<a href="flot_pie_charts.html">
<i class="ti-angle-double-right"></i> Flot Pie Charts
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'LineAmcharts') or (page == 'columnBarAmcharts') or (page == 'PieFunnelAmcharts') or (page == 'gaugeAmcharts') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-pie-chart text-warning"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>
Amcharts
</p>
</a>
<ul class="sub_menu">
<li {% if page =='LineAmcharts'%} class="active" id="active" {% endif %}>
<a href="line_amcharts.html">
<i class="ti-angle-double-right"></i> Line Amcharts
</a>
</li>
<li {% if page =='columnBarAmcharts'%} class="active" id="active" {% endif %}>
<a href="column_bar_amcharts.html">
<i class="ti-angle-double-right"></i> Bar Amcharts
</a>
</li>
<li {% if page =='PieFunnelAmcharts'%} class="active" id="active" {% endif %}>
<a href="pie_funnel_amcharts.html">
<i class="ti-angle-double-right"></i> Pie Funnel Amcharts
</a>
</li>
<li {% if page =='gaugeAmcharts'%} class="active" id="active" {% endif %}>
<a href="gauge_amcharts.html">
<i class="ti-angle-double-right"></i> Gauge Amcharts
</a>
</li>
</ul>
</li>
<li {% if page =='chartJs'%} class="active" id="active" {% endif %}>
<a href="chartjs.html">
<i class="menu_icon ti-stats-down text-success"></i>
<p>Chartjs</p>
</a>
</li>
<li class="menu-dropdown {% if (page == 'basicGmaps') or (page == 'gmapServices') or (page == 'gmapRoutes') or (page == 'gmapUtils') or (page == 'vectormaps') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-location-pin text-danger"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>
Maps
</p>
</a>
<ul class="sub_menu">
<li class="{% if (page == 'basicGmaps') or (page == 'gmapServices') or (page == 'gmapRoutes') or (page == 'gmapUtils') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="ti-angle-double-right"></i> Gmaps
<span class="ti-angle-up"></span>
</a>
<ul class="sub_menu sub-submenu">
<li {% if page =='basicGmaps'%} class="active" id="active" {% endif %}>
<a href="gmaps_basic.html">
Basic Gmaps
</a>
</li>
<li {% if page =='gmapServices'%} class="active" id="active" {% endif %}>
<a href="gmaps_services.html">
Gmap Services
</a>
</li>
<li {% if page =='gmapRoutes'%} class="active" id="active" {% endif %}>
<a href="gmap_routes.html">
Gmap Routes
</a>
</li>
<li {% if page =='gmapUtils'%} class="active" id="active" {% endif %}>
<a href="gmap_utils.html">
Gmap Utils
</a>
</li>
</ul>
</li>
<li {% if page =='vectormaps'%} class="active" id="active" {% endif %}>
<a href="vectormaps.html">
<i class="ti-angle-double-right"></i> Vector Maps
</a>
</li>
</ul>
</li>
<li class="menu-dropdown {% if (page == 'gallery') or (page == 'VideoGallery') or (page == 'flippingGallery') or (page == 'fancygallery') %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-gallery text-purple"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>
Galleries
</p>
</a>
<ul class="sub_menu">
<li {% if page =='gallery'%} class="active" id="active" {% endif %}>
<a href="gallery1.html" class="dropdown_head">
<i class="ti-angle-double-right"></i> Gallery
</a>
</li>
<li {% if page =='VideoGallery'%} class="active" id="active" {% endif %}>
<a href="video_gallery.html" class="dropdown_head">
<i class="ti-angle-double-right"></i> Video Gallery
</a>
</li>
<li {% if page =='flippingGallery'%} class="active" id="active" {% endif %}>
<a href="gallery3.html" class="dropdown_head">
<i class="ti-angle-double-right"></i> Flipping Gallery
</a>
</li>
<li {% if page =='fancygallery'%} class="active" id="active" {% endif %}>
<a href="gallery4.html" class="dropdown_head">
<i class="ti-angle-double-right"></i> Fancy Gallery
</a>
</li>
</ul>
</li>
<li {% if page =='blank'%} class="active" id="active" {% endif %}>
<a href="blank.html">
<i class="menu_icon ti-file text-info"></i>
<p>Blank</p>
</a>
</li>
<li>
<a href="login.html">
<i class="menu_icon ti-shift-right text-success"></i>
<p>Login</p>
</a>
</li>
<li>
<a href="register.html">
<i class="menu_icon ti-marker-alt text-warning"></i>
<p>Register</p>
</a>
</li>
<li class="menu-dropdown {% if page == 'Invoice' %} active{% endif %}">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-files text-danger"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>Extra Pages</p>
</a>
<ul class="sub_menu">
<li>
<a href="404.html">
<i class="ti-angle-double-right"></i> 404
</a>
</li>
<li>
<a href="500.html">
<i class="ti-angle-double-right"></i> 500
</a>
</li>
<li>
<a href="forgot_password.html">
<i class="ti-angle-double-right"></i> Forgot Password
</a>
</li>
<li>
<a href="lockscreen.html">
<i class="ti-angle-double-right"></i> Lockscreen
</a>
</li>
<li {% if page =='Invoice'%} class="active" id="active" {% endif %}>
<a href="invoice.html">
<i class="ti-angle-double-right"></i> Invoice
</a>
</li>
</ul>
</li>
<li class="menu-dropdown menu_level">
<a href="#" class="dropdown_head">
<i class="menu_icon ti-view-list text-info"></i>
<i class="menu_icon_dropdown ti-angle-right"></i>
<p>
Menu levels
</p>
</a>
<ul class="sub_menu">
<li>
<a href="javascript:void(0)">
<i class="ti-angle-double-right"></i> Level 1
</a>
</li>
<li>
<a href="#" class="dropdown_head">
<i class="ti-angle-double-right"></i> Level 1
<span class="ti-angle-up"></span>
</a>
<ul class="sub_menu sub-submenu">
<li>
<a href="javascript:void(0)">
Level 2
</a>
</li>
<li>
<a href="javascript:void(0)">
Level 2
</a>
</li>
<li>
<a href="javascript:void(0)">
Level 2
</a>
</li>
</ul>
</li>
<li>
<a href="javascript:void(0)">
<i class="ti-angle-double-right"></i> Level 1
</a>
</li>
</ul>
</li>
</ul>
<!-- / .navigation -->
</div>
<!-- menu -->
</div>
<!-- /.sidebar -->
</div>Last updated