2025-04-02 13:24:56 +05:30

124 lines
4.8 KiB
SCSS

@import '../../../scss/_bootstrap-extended/include'; // imported for media query mixin
// Light Style
@if $enable-light-style {
$theme-name: 'default';
$throbber-bg: "url('./themes/default/throbber.gif')";
$small-bg: "url('./themes/default/32px.png')";
$big-bg: "url('./themes/default/40px.png')";
.jstree-#{$theme-name} {
background: transparent;
}
.jstree-#{$theme-name} > .jstree-container-ul .jstree-loading > .jstree-ocl,
.jstree-#{$theme-name}-small > .jstree-container-ul .jstree-loading > .jstree-ocl,
.jstree-#{$theme-name}-large > .jstree-container-ul .jstree-loading > .jstree-ocl {
background-image: #{$throbber-bg};
}
.jstree-#{$theme-name} .jstree-node,
.jstree-#{$theme-name} .jstree-icon,
.jstree-#{$theme-name} .jstree-file,
.jstree-#{$theme-name} .jstree-folder,
#jstree-dnd.jstree-#{$theme-name} .jstree-ok,
#jstree-dnd.jstree-#{$theme-name} .jstree-er,
.jstree-#{$theme-name}-small .jstree-node,
.jstree-#{$theme-name}-small .jstree-icon,
.jstree-#{$theme-name}-small .jstree-file,
.jstree-#{$theme-name}-small .jstree-folder,
#jstree-dnd.jstree-#{$theme-name}-small .jstree-ok,
#jstree-dnd.jstree-#{$theme-name}-small .jstree-er,
.jstree-#{$theme-name}-large .jstree-node,
.jstree-#{$theme-name}-large .jstree-icon,
.jstree-#{$theme-name}-large .jstree-file,
.jstree-#{$theme-name}-large .jstree-folder,
#jstree-dnd.jstree-#{$theme-name}-large .jstree-ok,
#jstree-dnd.jstree-#{$theme-name}-large .jstree-er {
background-image: #{$small-bg};
}
@include media-breakpoint-down(md) {
#jstree-dnd.jstree-dnd-responsive > .jstree-ok,
#jstree-dnd.jstree-dnd-responsive > .jstree-er,
.jstree-#{$theme-name}-responsive .jstree-icon,
.jstree-#{$theme-name}-responsive .jstree-node,
.jstree-#{$theme-name}-responsive .jstree-icon,
.jstree-#{$theme-name}-responsive .jstree-node > .jstree-ocl,
.jstree-#{$theme-name}-responsive .jstree-themeicon,
.jstree-#{$theme-name}-responsive .jstree-checkbox,
.jstree-#{$theme-name}-responsive .jstree-file,
.jstree-#{$theme-name}-responsive .jstree-folder {
background-image: #{$big-bg};
}
}
.jstree-#{$theme-name} .jstree-last,
.jstree-#{$theme-name} > .jstree-no-dots .jstree-node,
.jstree-#{$theme-name} > .jstree-no-dots .jstree-leaf > .jstree-ocl,
.jstree-#{$theme-name} .jstree-disabled,
.jstree-#{$theme-name} .jstree-themeicon-custom:not(.jstree-file):not(.jstree-folder) {
background: transparent !important;
}
}
// Dark Style
@if $enable-dark-style {
$theme-name: 'default-dark';
$throbber-bg: "url('./themes/default-dark/throbber.gif')";
$small-bg: "url('./themes/default-dark/32px.png')";
$big-bg: "url('./themes/default-dark/40px.png')";
.jstree-#{$theme-name} {
background: transparent;
}
.jstree-#{$theme-name} > .jstree-container-ul .jstree-loading > .jstree-ocl,
.jstree-#{$theme-name}-small > .jstree-container-ul .jstree-loading > .jstree-ocl,
.jstree-#{$theme-name}-large > .jstree-container-ul .jstree-loading > .jstree-ocl {
background-image: #{$throbber-bg};
}
.jstree-#{$theme-name} .jstree-node,
.jstree-#{$theme-name} .jstree-icon,
.jstree-#{$theme-name} .jstree-file,
.jstree-#{$theme-name} .jstree-folder,
#jstree-dnd.jstree-#{$theme-name} .jstree-ok,
#jstree-dnd.jstree-#{$theme-name} .jstree-er,
.jstree-#{$theme-name}-small .jstree-node,
.jstree-#{$theme-name}-small .jstree-icon,
.jstree-#{$theme-name}-small .jstree-file,
.jstree-#{$theme-name}-small .jstree-folder,
#jstree-dnd.jstree-#{$theme-name}-small .jstree-ok,
#jstree-dnd.jstree-#{$theme-name}-small .jstree-er,
.jstree-#{$theme-name}-large .jstree-node,
.jstree-#{$theme-name}-large .jstree-icon,
.jstree-#{$theme-name}-large .jstree-file,
.jstree-#{$theme-name}-large .jstree-folder,
#jstree-dnd.jstree-#{$theme-name}-large .jstree-ok,
#jstree-dnd.jstree-#{$theme-name}-large .jstree-er {
background-image: #{$small-bg};
}
@include media-breakpoint-down(md) {
#jstree-dnd.jstree-dnd-responsive > .jstree-ok,
#jstree-dnd.jstree-dnd-responsive > .jstree-er,
.jstree-#{$theme-name}-responsive .jstree-icon,
.jstree-#{$theme-name}-responsive .jstree-node,
.jstree-#{$theme-name}-responsive .jstree-icon,
.jstree-#{$theme-name}-responsive .jstree-node > .jstree-ocl,
.jstree-#{$theme-name}-responsive .jstree-themeicon,
.jstree-#{$theme-name}-responsive .jstree-checkbox,
.jstree-#{$theme-name}-responsive .jstree-file,
.jstree-#{$theme-name}-responsive .jstree-folder {
background-image: #{$big-bg};
}
}
.jstree-#{$theme-name} .jstree-last,
.jstree-#{$theme-name} > .jstree-no-dots .jstree-node,
.jstree-#{$theme-name} > .jstree-no-dots .jstree-leaf > .jstree-ocl,
.jstree-#{$theme-name} .jstree-disabled,
.jstree-#{$theme-name} .jstree-themeicon-custom:not(.jstree-file):not(.jstree-folder) {
background: transparent !important;
}
}