Style jsTree
This commit is contained in:
parent
2777c37085
commit
278eebd235
@ -1,8 +1,8 @@
|
||||
/* jsTree overrides */
|
||||
$tree-color-text: $color-text-dark-primary
|
||||
$tree-color-highlight: $color-primary-accent
|
||||
$tree-color-highlight-background: $color-primary-accent
|
||||
$tree-color-highlight-background-text: $white
|
||||
$tree-color-highlight-background: $white
|
||||
$tree-color-highlight-background-text: $primary
|
||||
|
||||
.jstree-default
|
||||
/* list item */
|
||||
@ -62,48 +62,48 @@ $tree-color-highlight-background-text: $white
|
||||
&.jstree-open
|
||||
/* Text of children for an open tree (like a folder) */
|
||||
.jstree-children > .jstree-node
|
||||
padding-left: 15px !important
|
||||
padding-left: 16px !important
|
||||
|
||||
.jstree-icon:empty
|
||||
left: 20px !important
|
||||
|
||||
// Tweaks for specific icons
|
||||
&.pi-file-archive
|
||||
left: 22px !important
|
||||
left: 25px !important
|
||||
&.pi-folder
|
||||
left: 21px !important
|
||||
left: 20px !important
|
||||
font-size: .9em !important
|
||||
&.pi-film-thick
|
||||
left: 22px !important
|
||||
&.pi-splay
|
||||
left: 20px !important
|
||||
font-size: .85em !important
|
||||
|
||||
.jstree-anchor
|
||||
box-shadow: inset 1px 0 0 0 rgba($tree-color-text, .2)
|
||||
// box-shadow: inset 1px 0 0 0 $color-background
|
||||
|
||||
/* Closed Folder */
|
||||
// &.jstree-closed
|
||||
|
||||
&.jstree-open .jstree-icon.jstree-ocl,
|
||||
&.jstree-closed .jstree-icon.jstree-ocl
|
||||
float: left
|
||||
min-width: 30px
|
||||
opacity: 0
|
||||
position: absolute
|
||||
z-index: 1
|
||||
opacity: 0
|
||||
min-width: 30px
|
||||
float: left
|
||||
|
||||
/* The text of the last level item */
|
||||
.jstree-anchor
|
||||
+media-xs
|
||||
width: 98%
|
||||
padding: 0 !important
|
||||
width: 98%
|
||||
border: none
|
||||
font-size: 13px
|
||||
height: inherit
|
||||
line-height: 26px
|
||||
line-height: 24px
|
||||
overflow: hidden
|
||||
padding-left: 28px
|
||||
padding-right: 10px
|
||||
text-overflow: ellipsis
|
||||
transition: background-color 100ms ease-in-out
|
||||
white-space: nowrap
|
||||
width: 100%
|
||||
|
||||
@ -111,7 +111,7 @@ $tree-color-highlight-background-text: $white
|
||||
&:after
|
||||
content: '\e83a' !important
|
||||
font-family: 'pillar-font'
|
||||
color: white
|
||||
color: $tree-color-highlight-background-text
|
||||
display: none
|
||||
position: absolute
|
||||
right: 7px
|
||||
@ -119,31 +119,31 @@ $tree-color-highlight-background-text: $white
|
||||
|
||||
// Icon, not selected
|
||||
.jstree-icon
|
||||
color: $color-text-dark-secondary
|
||||
font-size: 95% !important
|
||||
color: $tree-color-text
|
||||
margin: 0 !important
|
||||
|
||||
/* Selected item */
|
||||
&.jstree-clicked
|
||||
background-color: $tree-color-highlight-background !important
|
||||
color: white !important
|
||||
color: $tree-color-highlight-background-text !important
|
||||
font-weight: bold
|
||||
|
||||
&:after
|
||||
display: block
|
||||
color: white !important
|
||||
color: $tree-color-highlight-background-text !important
|
||||
|
||||
.jstree-ocl,
|
||||
.jstree-icon
|
||||
color: white
|
||||
color: $tree-color-highlight-background-text
|
||||
|
||||
/* hover an active item */
|
||||
&.jstree-hovered
|
||||
background-color: lighten($tree-color-highlight-background, 10%) !important
|
||||
box-shadow: none
|
||||
color: white !important
|
||||
color: $tree-color-highlight-background-text !important
|
||||
|
||||
&.jstree-hovered .jstree-icon
|
||||
color: white !important
|
||||
color: $tree-color-highlight-background-text !important
|
||||
|
||||
.jstree-hovered
|
||||
background-color: rgba($tree-color-highlight, .1) !important
|
||||
@ -182,8 +182,8 @@ $tree-color-highlight-background-text: $white
|
||||
position: absolute
|
||||
|
||||
&:empty
|
||||
line-height: 26px
|
||||
left: 5px
|
||||
line-height: 24px
|
||||
left: 3px
|
||||
|
||||
&.is_subscriber
|
||||
.jstree-node
|
||||
@ -267,7 +267,7 @@ $tree-color-highlight-background-text: $white
|
||||
|
||||
.jstree-default .jstree-node.jstree-closed .jstree-icon.jstree-ocl + .jstree-anchor,
|
||||
.jstree-default .jstree-node.jstree-open .jstree-icon.jstree-ocl + .jstree-anchor
|
||||
padding-left: 28px !important
|
||||
padding-left: 24px !important
|
||||
|
||||
/* hovered text */
|
||||
.jstree-default .jstree-hovered,
|
||||
@ -278,11 +278,11 @@ $tree-color-highlight-background-text: $white
|
||||
|
||||
a.jstree-anchor.jstree-clicked+ul li a.jstree-anchor.jstree-clicked
|
||||
background-color: rgba($tree-color-highlight-background, .8) !important
|
||||
color: white !important
|
||||
color: $tree-color-highlight-background-text !important
|
||||
|
||||
a.jstree-anchor.jstree-clicked+ul li a.jstree-anchor.jstree-clicked+ul li a.jstree-anchor.jstree-clicked
|
||||
background-color: rgba($tree-color-highlight-background, .8) !important
|
||||
color: white !important
|
||||
color: $tree-color-highlight-background-text !important
|
||||
|
||||
i.jstree-icon.jstree-ocl
|
||||
color: rgba($tree-color-text, .5) !important
|
||||
|
Loading…
x
Reference in New Issue
Block a user