1/* style for collapsable tree */ 2 3.tree { 4 min-height:20px; 5 padding:19px; 6 margin-bottom:20px; 7 background-color:#fbfbfb; 8 border:1px solid #999; 9 -webkit-border-radius:4px; 10 -moz-border-radius:4px; 11 border-radius:4px; 12 -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05); 13 -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05); 14 box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05) 15} 16.tree li { 17 list-style-type:none; 18 margin:0; 19 padding:10px 5px 0 5px; 20 position:relative 21} 22.tree li::before, .tree li::after { 23 content:''; 24 left:-20px; 25 position:absolute; 26 right:auto 27} 28.tree li::before { 29 border-left:1px solid #999; 30 bottom:50px; 31 height:100%; 32 top:0; 33 width:1px 34} 35.tree li::after { 36 border-top:1px solid #999; 37 height:20px; 38 top:25px; 39 width:25px 40} 41.tree li span { 42 -moz-border-radius:5px; 43 -webkit-border-radius:5px; 44 border:1px solid #999; 45 border-radius:5px; 46 display:inline-block; 47 padding:3px 8px; 48 text-decoration:none 49} 50.tree li.parent_li>span { 51 cursor:pointer 52} 53.tree>ul>li::before, .tree>ul>li::after { 54 border:0 55} 56.tree li:last-child::before { 57 height:30px 58} 59.tree li.parent_li>span:hover, .tree li.parent_li>span:hover+ul li span { 60 background:#eee; 61 border:1px solid #94a0b4; 62 color:#000 63}