From: edward Date: Fri, 24 Nov 2017 13:50:38 +0000 (+0800) Subject: less/roojs-bootstrap/sidebar-nav.less X-Git-Url: http://git.roojs.org/?a=commitdiff_plain;h=c0944f1ca36e7ae119d4a1ea851ae8a7d5579dd5;p=roojs1 less/roojs-bootstrap/sidebar-nav.less --- diff --git a/less/roojs-bootstrap/sidebar-nav.less b/less/roojs-bootstrap/sidebar-nav.less new file mode 100644 index 0000000000..2b62a4fa5b --- /dev/null +++ b/less/roojs-bootstrap/sidebar-nav.less @@ -0,0 +1,197 @@ +.sidebar { + margin-bottom: 5px; +} + +/* override boostrap a:hover */ +.sidebar a:hover { + text-decoration: none; +} + +.sidebar .sidebar-menu { + list-style: none; + margin: 0; + padding: 0; +} + +/* GREY BG */ +.sidebar .sidebar-menu > li, +.sidebar .sidebar-menu li.active li.treeview-menu +{ + margin: 0; + padding: 0; + border-bottom: 1px solid #ccc; + background-color: #eee; +} +/* active child menu - white BG */ +.sidebar .sidebar-menu li.active li.treeview-menu { + background-color: #ddd; +} + +.sidebar .sidebar-menu > li > a , +.sidebar .sidebar-menu li.open li.treeview-menu > a +{ + padding: 12px 5px 12px 15px; + display: block; + color: #333; +} + +.sidebar .sidebar-menu > li > a > .fa, +.sidebar .sidebar-menu > li > a > .glyphicon, +.sidebar .sidebar-menu > li > a > .ion { + width: 20px; +} + +.sidebar .sidebar-menu li:hover, +.sidebar .sidebar-menu li:focus, +.sidebar .sidebar-menu li:active, +.sidebar .sidebar-menu li.active li.treeview-menu:hover, +.sidebar .sidebar-menu li.active li.treeview-menu:focus, +.sidebar .sidebar-menu li.active li.treeview-menu:active +{ + background-color: #fff; +} + + +.sidebar .sidebar-menu li:hover a, +.sidebar .sidebar-menu li:focus a, +.sidebar .sidebar-menu li:active a, +.sidebar .sidebar-menu li.oepn li.treeview-menu a:hover, +.sidebar .sidebar-menu li.open li.treeview-menu a:focus, +.sidebar .sidebar-menu li.open li.treeview-menu a:active +{ + color: #000; + text-decoration: none; +} + + +/* BLUE ACTIVE */ +.sidebar .sidebar-menu li.active { + color: #fff; + background-color: #337ab7; + border-color: #2e6da4; +} + +.sidebar .sidebar-menu li.active:hover, +.sidebar .sidebar-menu li.active:focus, +.sidebar .sidebar-menu li.active.focus +{ + color: #fff; + background-color: #204d74; + border-color: #122b40; +} + +.sidebar .sidebar-menu li.active a { + color: #fff; +} + +.sidebar .sidebar-menu li.disabled { + color: #ccc; + background-color: #fff; + border-color: #ccc; +} + +.sidebar .sidebar-menu li.disabled a { + color: #ccc; + cursor: default; +} + +.sidebar .sidebar-menu li.danger, +.sidebar .sidebar-menu li.danger.active { + color: #fff; + background-color: #d9534f; + border-color: #d43f3a; +} + +.sidebar .sidebar-menu li.danger:hover, +.sidebar .sidebar-menu li.danger:focus, +.sidebar .sidebar-menu li.danger.active:focus +{ + color: #fff; + background-color: #c9302c; + border-color: #ac2925; + border-bottom: 1px solid #ac2925; +} + +.sidebar .sidebar-menu li.danger a, +.sidebar .sidebar-menu li.danger.active a{ + color: #fff; +} + +/* --- open */ +.sidebar .sidebar-menu li.open ul { + display:block; +} + +.sidebar .sidebar-menu li.open .treeview-menu { + display: block; +} + +/* --- treeview menu */ + +.sidebar .sidebar-menu .treeview-menu { + display: none; + list-style: none; + padding: 0; + margin: 0; +} +.sidebar .sidebar-menu .treeview-menu > li { + margin: 0; +} +.sidebar .sidebar-menu li.open li.treeview-menu > a { + padding: 5px 5px 5px 20px; + display: block; + font-size: 14px; + margin: 0px 0px; +} +.sidebar .sidebar-menu .treeview-menu > li > a > .fa, +.sidebar .sidebar-menu .treeview-menu > li > a > .glyphicon, +.sidebar .sidebar-menu .treeview-menu > li > a > .ion { + width: 20px; +} +/* background to highlighted treeview node +.sidebar .sidebar-menu li li.treeview-menu.active { + background: #fff; +} +*/ + +.sidebar .sidebar-menu li li.treeview-menu.active > a { + font-weight: bold; +} +/* active sidebard... */ + + + +.badge-default { + background-color: #777; + color: #fff; +} + +.badge-primary { + background-color: #337ab7; + color: #fff; +} + +.badge-success { + background-color: #5cb85c; + color: #fff; +} + +.badge-info { + background-color: #5bc0de; + color: #fff; +} + +.badge-warning { + background-color: #f0ad4e; + color: #fff; +} + +.badge-danger { + background-color: #d9534f; + color: #fff; +} + +.sidebar .sidebar-menu > li.active .badge-info { + background-color: #fff; + color: #5bc0de; +} \ No newline at end of file