Navigations

The Right Way - Admin Template

Basic navigation can be used everywhere you want and need.

Wrap your navigation list with .navigation container to get basic navigation.

Use li.title for list title and li.openable for dropdown list.

Add .no-icon to link to use element without icon.

Use navigation--condensed to use condensed navigation.

This example works better inside container without spaces(paddings) and rounded corners.

Use navigation--quick to use simple navigation list without icons.

Simple example of quick navigation list. Supports li.active element.

Wrap navigation with .navigation--minimized to use minimized navigation.

It's possible to use fontawesome icon package in navigation.

All examples supports invert style.

This is horizontal navigation example, also can be used everywhere.

Basicaly the same structure as default navigation. Use .vertical-navigation instead of .navigation to get vertical navigation.

Important! li.title is not alowed.

Supports invert style.

Basic file tree. Can be used wherever you want. Can be combined with default navigation.

Use li.folder to set list as container for sublevel tree.

Unlimited sublevel supported.

Supports invert style.