44r0n7/privacy.sexy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix bad highlighting of selected nodes when using keyboard navigation

Browse Source
This commit is contained in:
undergroundwires
2020-09-04 01:24:35 +01:00
parent db74531cd4
commit 255133af4d
1 changed files with 35 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
src/presentation/styles/tree.scss
View File

@@ -2,42 +2,40 @@
@import "@/presentation/styles/colors.scss"; @import "@/presentation/styles/colors.scss";
.tree { .tree {
background-color: $slate; background: $slate;
} &-node {
white-space: normal !important;
.tree-node > .tree-content > .tree-anchor > span { > .tree-content {
color: $white !important; > .tree-anchor > span {
text-transform: uppercase; color: $white;
color: $light-gray; text-transform: uppercase;
font-size: 1.5em; font-size: 1.5em;
} }
&:hover {
.tree-node { background: $dark-gray !important;
white-space: normal !important; }
} }
&.selected { // When using keyboard navigation it higlights current item and its child items
.tree-arrow.has-child { background: $gray;
&.rtl:after, &:after { .tree-text {
border-color: $white !important; color: $black !important;
}
}
}
&-checkbox {
&.checked {
background: $accent !important;
}
&.indeterminate {
border-color: $gray !important;
}
background: $dark-slate !important;
}
&-arrow {
&.has-child {
&.rtl:after, &:after {
border-color: $white !important;
}
}
} }
} }
.tree-node.selected > .tree-content {
> .tree-anchor > span {
font-weight: bolder;
}
}
.tree-content:hover {
background: $dark-gray !important;
}
.tree-checkbox {
&.checked {
background: $accent !important;
}
&.indeterminate {
border-color: $gray !important;
}
background: $dark-slate !important;
}