Snippets/Treeview

How to use Snippets
List of Snippets
Treeview
Language(s): CSS
Compatible with: MediaWiki ?+ (All skins)

Description

edit

Enables formatting lists as a hierarchical tree-style list.

/**
 * Tree style lists
 * @source mediawiki.org/wiki/Snippets/Treeview
 * @revision 2.0 (2021-09-05)
 * @author (unknown)
 */
.treeview ul {
    padding: 0;
    margin: 0;
}
.treeview li {
    padding: 0;
    margin: 0;
    list-style-type: none;
    list-style-image: none;
}
.treeview li li {
    background: url("//upload.wikimedia.org/wikipedia/commons/f/f2/Treeview-grey-line.png") no-repeat 0 -2981px;
    /* @noflip */
    padding-left: 20px;
    text-indent: 0.3em;
}
.treeview li li.lastline {
    background-position: 0 -5971px
}
.treeview li.emptyline > ul {
    /* @noflip */
    margin-left: -1px;
}
.treeview li.emptyline > ul > li:first-child {
    background-position: 0 9px
}