webroot.static.tree.tree.css Maven / Gradle / Ivy
/*
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
tree {
display: block;
font-family: serif;
}
tree-node {
display: block;
border-left: 1px solid #777;
position: relative;
}
tree > tree-node {
border-left: 0px;
}
tree-node:last-child:after {
border-left: 1px solid white;
display: block;
height: 50%;
position: absolute;
left: -1px;
top: 50%;
content: '';
}
tree-node:before {
position: absolute;
display: block;
top: 50%;
height: 1px;
width: 10px;
background-color: #777;
content: '';
}
tree > tree-node:before {
display: none;
}
tree-face {
display: flex;
justify-content: space-between;
padding: 2px 0 2px 4px;
}
tree-children tree-face {
padding: 2px 0 2px 8px;
}
tree-node-open-close {
display: block;
flex-shrink: 0;
align-self: center;
background: gray;
color: white;
width: 16px;
height: 16px;
border-radius: 16px;
line-height: 16px;
text-align: center;
}
tree-node-open-close:before {
content: "+";
}
tree-node[expanded=true] > tree-face > tree-node-open-close:before {
content: "";
display: block;
width: 8px;
height: 1px;
margin: 8px 0 0 4px;
background-color: white;
}
tree-node[expanded=false] > tree-children {
display: none;
}
tree-label {
display: block;
width: 100%;
margin-left: 4px;
cursor: pointer;
word-break: break-all;
}
tree-label:hover {
color: #888;
}
tree-node.active > tree-face > tree-label {
background-color: #ccc;
}
tree-children {
margin-left: 10px;
display: block;
}
© 2015 - 2024 Weber Informatics LLC | Privacy Policy