plate-tool/plate-tool-web/assets/scss/default_theme/components/_tree.scss

56 lines
865 B
SCSS
Raw Normal View History

2023-06-02 20:26:20 +00:00
@use "sass:color";
@use "../variables" as *;
$selection-border-width: 2px;
div.tree {
position: relative;
grid-column: left / left;
grid-row: upper / upper;
width: 100%;
height: 100%;
border: 2px solid $color-dark;
h3 {
margin-left: 0.5rem;
}
div#controls {
position: absolute;
bottom: 2%;
right: 2%;
}
}
div.tree ul {
width: 80%;
margin-left: 10%;
padding: 0;
display: flex;
flex-direction: column;
align-items: stretch;
overflow: scroll;
}
div.tree li {
display: inline;
margin-left: 0;
margin-bottom: 0.4rem;
border: 2px solid transparent;
user-select: none;
list-style: none;
line-height: 1em;
&:hover {
background: color.change($color-light, $alpha: 0.08);
border: $selection-border-width solid color.change($color-light, $alpha:0.3);
}
&.selected {
background: color.change($color-light, $alpha: 0.2);
}
}