How to use horizontal layouts?

Set horizontal in the store/layout.js file.

export const state = () => ({
    layoutType: "horizontal"
});

You can also update to "detached" and "two-column" if you want.

You need do the below changes in the components/horizontal-navbar.vue file in the mounted method.

Dark

document.body.setAttribute("data-topbar-color", "dark");

Light

document.body.setAttribute("data-topbar-color", "light");

Fluid

document.body.setAttribute("data-topbar-color", "fluid");

boxed

document.body.setAttribute("data-topbar-color", "boxed");