Horizontal Layouts | Dason Admin & Dashboard Template

Horizontal menu configuration

If you would like to have Horizontal Menu (or Topnav) based layout,

HTML

You can use Horizontal folder for horizontal layout and if you want to change layout from vertical to hoizontal then perform the below changes.
You need to update the below code in the templates/partials/base.html

<body data-layout="horizontal" data-topbar="dark">

And in partials/base.html

{% block header %}
    {% include 'partials/hori-header.html' %}
{% endblock header %}
    
{% block left_sidebar %}
    {% include "partials/hori-left-sidebar.html" %}
{% endblock left_sidebar %}
    
{% block content %}
    {% include "partials/content.html" with title='Horizontal' pageview='Layouts' %}
{% endblock content %}

It will set horizontal layouts in all the pages.

In order to add, change or remove any ui elements from the topbar, simply edit in file templates/partials/horizontal.html The change would reflect in all the files automatically.

How to use pre-built layouts?

Each of the layout options is provided below with steps you would need to perform:

Topbar Light

Keep your body element with data attribute data-topbar="light" data-layout="horizontal" E.g. <body data-topbar="light" data-layout="horizontal"> to have Dark topbar and Light Menubar.

Boxed Layout

Keep your body element with data attribute data-layout-size="boxed" data-layout="horizontal" E.g. <body data-layout-size="boxed" data-layout="horizontal"> to have boxed layout.

Scrollable Layout

Keep your body element with data attribute data-layout="horizontal" data-layout-scrollable="true" E.g. <body data-layout-scrollable="true" data-layout="horizontal"> to have Scrollable Layout.

Description
Use pre-built layouts