Adding indexmenu version 2024-01-05 (ed06f21).
Signed-off-by: Daniel Baumann <daniel@debian.org>
This commit is contained in:
parent
92cc8375f2
commit
f339727d60
GPG key ID:
FBB4F0E80A80222F
766 changed files with 83299 additions and 0 deletions
429
plugins/55/indexmenu/scripts/contextmenu.js
Normal file
429
plugins/55/indexmenu/scripts/contextmenu.js
Normal file
|
|
@ -0,0 +1,429 @@
|
|||
/**
|
||||
* Right Context Menu configuration
|
||||
*
|
||||
* Some usefull variables:
|
||||
* node.hns = headpage id;
|
||||
* node.isdir = node is namespace;
|
||||
* node.dokuid = the DW id (namespace parent in case of headpage);
|
||||
* id = the DW id of the selected node (headpage id in case of headpage);
|
||||
* index.config.urlbase = Url Base;
|
||||
* index.config.sepchar = Url separator;
|
||||
*
|
||||
* HOWTO EDIT:
|
||||
*
|
||||
* To override menu entries or add a menu entry:
|
||||
* - PLEASE EDIT ONLY the scripts/contextmenu.local.js file
|
||||
* - DON'T EDIT this file, it is overwritten at plugin update
|
||||
*
|
||||
* Base structure of the context menu is displayed below.
|
||||
* The entries with 'pg' are shown for page noded, these with 'ns' only for namespaces.
|
||||
*
|
||||
* Current available for everybody:
|
||||
* indexmenu_contextmenu['all']['pg']['view'] = [...array with menu description here... ];
|
||||
* indexmenu_contextmenu['all']['pg']['edit'] = [ ... ];
|
||||
* indexmenu_contextmenu['all']['ns']['view'] = [ ... ];
|
||||
*
|
||||
* Current available for admins:
|
||||
* indexmenu_contextmenu['pg']['view'] = [ ... ];
|
||||
* indexmenu_contextmenu['ns']['view'] = [ ... ];
|
||||
*
|
||||
* Current available for authenticated users:
|
||||
* indexmenu_contextmenu['pg']['view'] = [ ... ];
|
||||
* indexmenu_contextmenu['ns']['view'] = [ ... ];
|
||||
*
|
||||
* A menu description may contain four kind of entries:
|
||||
* - section title: array with one entry e.g.:
|
||||
* ['Section title (html allowed)']
|
||||
* - menu action: array with two entries e.g.:
|
||||
* ['Title of action 1 (html allowed)', 'javascript here ... see for examples scripts/contextmenu.js']
|
||||
* - menu action with custom tooltip: array with three entries e.g.:
|
||||
* ['Title of action 1 (html allowed)', 'javascript here ... see for examples scripts/contextmenu.js', 'Customized title']
|
||||
* - submenu: array with two entries where second entry is an array that describes again a menu e.g.:
|
||||
* ['title of submenu (html allowed)', [ ...array with menu actions... ]]
|
||||
*
|
||||
*
|
||||
* Examples:
|
||||
* A menu description array:
|
||||
* ... = [
|
||||
* ['section title'],
|
||||
* ['title of action 1', 'javascript here'],
|
||||
* ['title of submenu', [['title of subaction 1', 'javascript here'], ['title of subaction 1', 'javascript here', 'Click here for action']] ]
|
||||
* ];
|
||||
*
|
||||
* To Override the common menu title:
|
||||
* indexmenu_contextmenu['all']['pg']['view'][0] = ['customtitle'];
|
||||
*
|
||||
* To override a menu entry, for example the menu title:
|
||||
* indexmenu_contextmenu['all']['pg']['view'][0] = ['Custom Title'];
|
||||
*
|
||||
* To add option to page menu:
|
||||
* Array.splice(index, howManyToRemove, description1)
|
||||
* index = position to start (start counting at zero)
|
||||
* howManyToRemove = number of elements that are removed (set to 1 to replace a element)
|
||||
* description1 = array with menu entry description
|
||||
* -> optional: description2 = optional you can add more elements at once by splice(index, howManyToRemove, description1, description2, etc)
|
||||
*
|
||||
* indexmenu_contextmenu['all']['pg']['view'].splice(1, 0, ['Input new page', '"javascript: IndexmenuContextmenu.reqpage(\'"+index.config.urlbase+"\',\'"+index.config.sepchar+"\',\'"+node.dokuid+"\');"']);
|
||||
*/
|
||||
|
||||
/* global LANG */
|
||||
/* global DOKU_BASE */
|
||||
/* global JSINFO */
|
||||
|
||||
|
||||
// IMPORTANT: DON'T MODIFY THIS FILE, BUT EDIT contextmenu.local.js PLEASE!
|
||||
// THIS FILE IS OVERWRITTEN WHEN PLUGIN IS UPDATED
|
||||
|
||||
/**
|
||||
* Right Context Menu configuration for all users:
|
||||
*/
|
||||
indexmenu_contextmenu['all']['pg'] = {
|
||||
'view': [
|
||||
['<span class="indexmenu_titlemenu"><b>'+LANG.plugins.indexmenu.page+'</b></span>'],
|
||||
[LANG.plugins.indexmenu.revs, 'IndexmenuContextmenu.getid(index.config.urlbase,id)+"do=revisions"'],
|
||||
[LANG.plugins.indexmenu.tocpreview, '"javascript: IndexmenuContextmenu.createTocMenu(\'call=indexmenu&req=toc&id="+id+"\',\'picker_"+index.treeName+"\',\'s"+index.treeName+node.id+"\');"']
|
||||
],
|
||||
//Menu items in edit mode, when previewing
|
||||
'edit': [
|
||||
['<span class="indexmenu_titlemenu"><b>'+LANG.plugins.indexmenu.editmode+'</b></span>'],
|
||||
[LANG.plugins.indexmenu.insertdwlink, '"javascript: IndexmenuContextmenu.insertTags(\'"+id+"\',\'"+index.config.sepchar+"\');"+index.treeName+".divdisplay(\'r\',0);"', LANG.plugins.indexmenu.insertdwlinktooltip]
|
||||
]
|
||||
};
|
||||
|
||||
indexmenu_contextmenu['all']['ns'] = {
|
||||
'view': [
|
||||
['<span class="indexmenu_titlemenu"><b>'+LANG.plugins.indexmenu.ns+'</b></span>'],
|
||||
[LANG.plugins.indexmenu.search, '"javascript: IndexmenuContextmenu.srchpage(\'"+index.config.urlbase+"\',\'"+index.config.sepchar+"\',\'"+node.isdir+"\',\'"+node.dokuid+"\');"', LANG.plugins.indexmenu.searchtooltip]
|
||||
]
|
||||
};
|
||||
|
||||
|
||||
if (JSINFO && JSINFO.isadmin) {
|
||||
/**
|
||||
* Right Context Menu configuration for admin users:
|
||||
*/
|
||||
indexmenu_contextmenu['pg'] = {
|
||||
'view': [
|
||||
[LANG.plugins.indexmenu.edit, 'IndexmenuContextmenu.getid(index.config.urlbase,id)+"do=edit"'],
|
||||
['<em>'+LANG.plugins.indexmenu.create+'--></em>', [
|
||||
[LANG.plugins.indexmenu.headpage, '"javascript: IndexmenuContextmenu.reqpage(\'"+index.config.urlbase+"\',\'"+index.config.sepchar+"\',\'"+node.dokuid+"\',\'"+node.name+"\');"', LANG.plugins.indexmenu.headpagetooltip],
|
||||
[LANG.plugins.indexmenu.startpage, 'IndexmenuContextmenu.getid(index.config.urlbase,id+index.config.sepchar+"start")+"do=edit"', LANG.plugins.indexmenu.startpagetooltip],
|
||||
[LANG.plugins.indexmenu.custompage, '"javascript: IndexmenuContextmenu.reqpage(\'"+index.config.urlbase+"\',\'"+index.config.sepchar+"\',\'"+node.dokuid+"\');"', LANG.plugins.indexmenu.custompagetooltip]
|
||||
]],
|
||||
['<em>'+LANG.plugins.indexmenu.more+'--></em>', [
|
||||
[LANG.plugins.indexmenu.acls, 'IndexmenuContextmenu.getid(index.config.urlbase,id)+"do=admin&page=acl"'],
|
||||
[LANG.plugins.indexmenu.purgecache, 'IndexmenuContextmenu.getid(index.config.urlbase,id)+"purge=true"'],
|
||||
[LANG.plugins.indexmenu.exporthtml, 'IndexmenuContextmenu.getid(index.config.urlbase,id)+"do=export_xhtml"'],
|
||||
[LANG.plugins.indexmenu.exporttext, 'IndexmenuContextmenu.getid(index.config.urlbase,id)+"do=export_raw"']
|
||||
]]
|
||||
]
|
||||
};
|
||||
|
||||
indexmenu_contextmenu['ns'] = {
|
||||
'view': [
|
||||
[LANG.plugins.indexmenu.newpage, '"javascript: IndexmenuContextmenu.reqpage(\'"+index.config.urlbase+"\',\'"+index.config.sepchar+"\',\'"+node.dokuid+"\');"', LANG.plugins.indexmenu.newpagetooltip],
|
||||
['<em>'+LANG.plugins.indexmenu.more+'--></em>', [
|
||||
[LANG.plugins.indexmenu.headpagehere, '"javascript: IndexmenuContextmenu.reqpage(\'"+index.config.urlbase+"\',\'"+index.config.sepchar+"\',\'"+node.dokuid+"\',\'"+node.name+"\');"', LANG.plugins.indexmenu.headpageheretooltip],
|
||||
[LANG.plugins.indexmenu.acls, 'IndexmenuContextmenu.getid(index.config.urlbase,node.dokuid)+"do=admin&page=acl"']
|
||||
]]
|
||||
]
|
||||
};
|
||||
|
||||
} else if (JSINFO && JSINFO.isauth) {
|
||||
/**
|
||||
* Right Context Menu configuration for authenticated users:
|
||||
*/
|
||||
indexmenu_contextmenu['pg'] = {
|
||||
'view': [
|
||||
[LANG.plugins.indexmenu.newpagehere, '"javascript: IndexmenuContextmenu.reqpage(\'"+index.config.urlbase+"\',\'"+index.config.sepchar+"\',\'"+node.dokuid+"\');"'],
|
||||
['Edit', 'IndexmenuContextmenu.getid(index.config.urlbase,id)+"do=edit"', 1, 0 ],
|
||||
['<em>'+LANG.plugins.indexmenu.more+'--></em>', [
|
||||
[LANG.plugins.indexmenu.headpagehere, '"javascript: IndexmenuContextmenu.reqpage(\'"+index.config.urlbase+"\',\'"+index.config.sepchar+"\',\'"+node.dokuid+"\',\'"+node.name+"\');"'],
|
||||
[LANG.plugins.indexmenu.purgecache, 'IndexmenuContextmenu.getid(index.config.urlbase,id)+"purge=true"'],
|
||||
[LANG.plugins.indexmenu.exporthtml, 'IndexmenuContextmenu.getid(index.config.urlbase,id)+"do=export_xhtml"']
|
||||
]]
|
||||
]
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
var IndexmenuContextmenu = {
|
||||
|
||||
/**
|
||||
* Common functions
|
||||
* Insert your custom functions (available for all users) here.
|
||||
*/
|
||||
|
||||
/**
|
||||
* Navigate to the search page
|
||||
*
|
||||
* @param {string} urlbase index.config.urlbase
|
||||
* @param {string} sepchar index.config.sepchar
|
||||
* @param {boolean} isdir whether a directory (probably boolean, might be string)
|
||||
* @param {string} nid page id of node (dokuid mentioned in indexmenu.js)
|
||||
*/
|
||||
|
||||
srchpage: function (urlbase, sepchar, isdir, nid) {
|
||||
const enteredText = prompt(LANG.plugins.indexmenu.insertkeywords, "");
|
||||
if (enteredText) {
|
||||
let fnid = nid;
|
||||
if (isdir == "0") {
|
||||
fnid = fnid.substring(0, nid.lastIndexOf(sepchar));
|
||||
}
|
||||
let b = urlbase, re = new RegExp(sepchar, 'g');
|
||||
fnid = fnid.replace(re, ":");
|
||||
b += (urlbase.indexOf("?id=") < 0) ? '?id=' : '';
|
||||
window.location.href = IndexmenuContextmenu.getid(b, enteredText + " @" + fnid) + "do=search";
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Build a url to a wiki page
|
||||
*
|
||||
* @param {string} urlbase
|
||||
* @param {string} id
|
||||
* @returns {string}
|
||||
*/
|
||||
getid: function (urlbase, id) {
|
||||
let url = (urlbase || '') + encodeURIComponent(id || '');
|
||||
url += (urlbase.indexOf("?") < 0) ? '?' : '&';
|
||||
return url;
|
||||
},
|
||||
|
||||
/**
|
||||
* Navigate to the editor window
|
||||
*
|
||||
* @param {string} urlbase
|
||||
* @param {string} sepchar
|
||||
* @param {string} id
|
||||
* @param {string} pagename
|
||||
*/
|
||||
reqpage: function (urlbase, sepchar, id, pagename) {
|
||||
let newpageid;
|
||||
if (pagename) {
|
||||
newpageid = id + sepchar + pagename;
|
||||
} else {
|
||||
newpageid = prompt(LANG.plugins.indexmenu.insertpagename, "");
|
||||
if (!newpageid) {
|
||||
return;
|
||||
}
|
||||
newpageid = id + sepchar + newpageid;
|
||||
}
|
||||
if (newpageid) {
|
||||
window.location.href = IndexmenuContextmenu.getid(urlbase, newpageid) + "do=edit";
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Insert link syntax with given id in current editor window
|
||||
*
|
||||
* @param {string} lnk page id
|
||||
* @param {string} sepchar
|
||||
*/
|
||||
insertTags: function (lnk, sepchar) {
|
||||
let r, l = lnk;
|
||||
if (sepchar) {
|
||||
r = new RegExp(sepchar, "g");
|
||||
l = lnk.replace(r, ':');
|
||||
}
|
||||
insertTags('wiki__text', '[[', ']]', l);
|
||||
},
|
||||
|
||||
/**
|
||||
* Create or catch the picker and hide it, next call the ajax content loading to get the ToC
|
||||
*
|
||||
* @param {string} get query string
|
||||
* @param {string} picker id of picker
|
||||
* @param {string} btn id of button
|
||||
*/
|
||||
createTocMenu: function (get, picker, btn) {
|
||||
var $toc_picker = jQuery('#' + picker);
|
||||
if (!$toc_picker.length) {
|
||||
$toc_picker = IndexmenuUtils.createPicker(picker, 'indexmenu_toc');
|
||||
$toc_picker
|
||||
.html('<a href="#"><img src="' + DOKU_BASE + 'lib/plugins/indexmenu/images/close.gif" class="indexmenu_close" /></a><div />')
|
||||
.children().first().click(function (event) {
|
||||
event.stopPropagation();
|
||||
return IndexmenuContextmenu.togglePicker($toc_picker, jQuery('#' + btn));
|
||||
});
|
||||
} else {
|
||||
$toc_picker.hide();
|
||||
}
|
||||
IndexmenuContextmenu.ajaxmenu(get, $toc_picker, jQuery('#' + btn), $toc_picker.children().last(), null);
|
||||
},
|
||||
|
||||
/**
|
||||
* Shows the picker and adds to it or to an internal containter the ajax content
|
||||
*
|
||||
* @param {string} get query string
|
||||
* @param {jQuery} $picker
|
||||
* @param {jQuery} $btn
|
||||
* @param {jQuery} $container if defined ajax result is added to it, otherwise to $picker
|
||||
* @param {function} oncomplete called when defined to handle ajax result
|
||||
*/
|
||||
ajaxmenu: function (get, $picker, $btn, $container, oncomplete) {
|
||||
var $indx_list;
|
||||
$indx_list = $container || $picker;
|
||||
|
||||
if (!IndexmenuContextmenu.togglePicker($picker, $btn)) return;
|
||||
|
||||
var onComplete = function (data) {
|
||||
$indx_list.html('');
|
||||
if (typeof oncomplete == 'function') {
|
||||
oncomplete(data, $indx_list);
|
||||
} else {
|
||||
$indx_list.html(data);
|
||||
}
|
||||
};
|
||||
|
||||
//get content for picker/container
|
||||
jQuery.ajax({
|
||||
type: "POST",
|
||||
url: DOKU_BASE + 'lib/exe/ajax.php',
|
||||
data: get,
|
||||
beforeSend: function () {
|
||||
$indx_list.html('<div class="tocheader">'+LANG.plugins.indexmenu.loading+'</div>');
|
||||
},
|
||||
success: onComplete,
|
||||
dataType: 'html'
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* Hide/show picker, will be shown beside btn
|
||||
*
|
||||
* @param {string|jQuery} $picker
|
||||
* @param {jQuery} $btn
|
||||
* @return {Boolean} true if open, false closed
|
||||
*/
|
||||
togglePicker: function ($picker, $btn) {
|
||||
var x = 8, y = 0;
|
||||
|
||||
if (!$picker.is(':visible')) {
|
||||
var pos = $btn.offset();
|
||||
//position + width of button
|
||||
x += pos.left + $btn[0].offsetWidth;
|
||||
y += pos.top;
|
||||
|
||||
$picker
|
||||
.show()
|
||||
.offset({
|
||||
left: x,
|
||||
top: y
|
||||
});
|
||||
|
||||
return true;
|
||||
} else {
|
||||
$picker.hide();
|
||||
return false;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Fills the contextmenu by creating entries from the given configuration arrays and concatenating these
|
||||
* to the #r<id> picker
|
||||
*
|
||||
* @param {any[]} amenu (part of) the configuration array
|
||||
* @param {dTree} index the indexmenu object
|
||||
* @param {int} n node id
|
||||
*/
|
||||
arrconcat: function (amenu, index, n) {
|
||||
var html, id, item, a, li;
|
||||
if (typeof amenu == 'undefined' || typeof amenu['view'] == 'undefined') {
|
||||
return;
|
||||
}
|
||||
var cmenu = amenu['view'];
|
||||
if (jQuery('#tool__bar')[0] && amenu['edit'] instanceof Array) {
|
||||
cmenu = amenu['edit'].concat(cmenu);
|
||||
}
|
||||
var node = index.aNodes[n];
|
||||
id = node.hns || node.dokuid;
|
||||
|
||||
var createCMenuEntry = function (entry) {
|
||||
return '<a title="' + ((entry[2]) ? entry[2] : entry[0]) + '" href="' + eval(entry[1]) + '">' + entry[0] + '</a>';
|
||||
};
|
||||
|
||||
jQuery.each(cmenu, function (i, cmenuentry) {
|
||||
if (cmenuentry == '') {
|
||||
return true;
|
||||
}
|
||||
item = document.createElement('li');
|
||||
var $cmenu = jQuery('#r' + index.treeName);
|
||||
if (cmenuentry[1]) {
|
||||
if (cmenuentry[1] instanceof Array) {
|
||||
html = document.createElement('ul');
|
||||
jQuery.each(cmenuentry[1], function (a, subcmenuentry) {
|
||||
li = document.createElement('li');
|
||||
li.innerHTML = createCMenuEntry(subcmenuentry);
|
||||
html.appendChild(li);
|
||||
});
|
||||
|
||||
//}
|
||||
item.innerHTML = '<span class="indexmenu_submenu">' + cmenuentry[0] + '</span>';
|
||||
html.left = $cmenu[0].width;
|
||||
item.appendChild(html);
|
||||
} else {
|
||||
item.innerHTML = createCMenuEntry(cmenuentry);
|
||||
}
|
||||
} else {
|
||||
item.innerHTML = cmenuentry;
|
||||
}
|
||||
$cmenu.children().last().append(item);
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* Absolute positioning of the div at place of mouseclick
|
||||
*
|
||||
* @param obj div element
|
||||
* @param e
|
||||
*/
|
||||
mouseposition: function (obj, e) {
|
||||
//http://www.quirksmode.org/js/events_properties.html
|
||||
var X = 0, Y = 0;
|
||||
if (!e) e = window.event;
|
||||
if (e.pageX || e.pageY) {
|
||||
X = e.pageX;
|
||||
Y = e.pageY;
|
||||
}
|
||||
else if (e.clientX || e.clientY) {
|
||||
X = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
|
||||
Y = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
|
||||
}
|
||||
obj.style.left = X - 5 + 'px';
|
||||
obj.style.top = Y - 5 + 'px';
|
||||
},
|
||||
|
||||
/**
|
||||
* Check mouse button onmousedown event, only for middle and right mouse button contextmenu is shown
|
||||
*
|
||||
* @param {int} n node id
|
||||
* @param {string|dTree} obj the unique name of a dTree object
|
||||
* @param {event} e
|
||||
*/
|
||||
checkcontextm: function (n, obj, e) {
|
||||
e = e || event;
|
||||
// mouse clicks: which 3 === right, button 2 === right button
|
||||
if ((e.which === 3 || e.button === 2) || (window.opera && e.which === 1 && e.ctrlKey)) {
|
||||
obj.contextmenu(n, e);
|
||||
IndexmenuContextmenu.stopevt(e);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Prevent default oncontextmenu event
|
||||
*
|
||||
* @param {event} e
|
||||
* @returns {boolean}
|
||||
*/
|
||||
stopevt: function (e) {
|
||||
if (!window.indexmenu_contextmenu) {
|
||||
return true;
|
||||
}
|
||||
e = e || event;
|
||||
e.preventDefault ? e.preventDefault() : e.returnValue = false;
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
70
plugins/55/indexmenu/scripts/contextmenu.local.js.example
Normal file
70
plugins/55/indexmenu/scripts/contextmenu.local.js.example
Normal file
|
|
@ -0,0 +1,70 @@
|
|||
/**
|
||||
* Right Context Menu local configuration -- RENAME THIS FILE TO contextmenu.local.js --
|
||||
* How to change:
|
||||
* - Rename this file to contextmenu.local.js
|
||||
* - Make in this file your modifications
|
||||
* - and go to the Configuration Manager and save the config again (this clears the cached javascript)
|
||||
*
|
||||
* See for information about available variables, menu structure, override and adding menu entries in the scripts/contextmenu.js
|
||||
*/
|
||||
|
||||
/**
|
||||
* Right Context Menu configuration for all users:
|
||||
*/
|
||||
if (!indexmenu_contextmenu['all']['pg']) indexmenu_contextmenu['all']['pg'] = {'view': [] };
|
||||
if (!indexmenu_contextmenu['all']['ns']) indexmenu_contextmenu['all']['ns'] = {'view': [] };
|
||||
|
||||
|
||||
// Override title of page menu
|
||||
//indexmenu_contextmenu['all']['pg']['view'][0] = ['Custom Title'];
|
||||
|
||||
// add option to page menu
|
||||
//indexmenu_contextmenu['all']['pg']['view'].splice(1, 0, ['Input new page', '"javascript: IndexmenuContextmenu.reqpage(\'"+index.config.urlbase+"\',\'"+index.config.sepchar+"\',\'"+node.dokuid+"\');"']);
|
||||
|
||||
|
||||
if (JSINFO && JSINFO.isadmin) {
|
||||
if (!indexmenu_contextmenu['pg']) indexmenu_contextmenu['pg'] = {'view': []};
|
||||
if (!indexmenu_contextmenu['ns']) indexmenu_contextmenu['ns'] = {'view': []};
|
||||
/**
|
||||
* Right Context Menu configuration for admin users:
|
||||
*/
|
||||
|
||||
//override or add here the menu entries for admin, see for examples above
|
||||
|
||||
|
||||
} else if (JSINFO && JSINFO.isauth) {
|
||||
if (!indexmenu_contextmenu['pg']) indexmenu_contextmenu['pg'] = {'view': []};
|
||||
if (!indexmenu_contextmenu['ns']) indexmenu_contextmenu['ns'] = {'view': []};
|
||||
/**
|
||||
* Right Context Menu configuration for authenticated users:
|
||||
*/
|
||||
|
||||
//override or add here the menu entries for authenticated users, see for examples above
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Common available functions:
|
||||
*
|
||||
* Some common functions are added by [indexmenu plugin folder]/scripts/contextmenu.js
|
||||
* - IndexmenuContextmenu.srchpage(urlbase, sepchar, isdir, dokuid)
|
||||
* - IndexmenuContextmenu.getid(urlbase, dokuid)
|
||||
* - IndexmenuContextmenu.reqpage(urlbase, sepchar, dokuid, pagename)
|
||||
* - IndexmenuContextmenu.insertTags(dokuid, sepchar)
|
||||
*
|
||||
* Insert your custom functions (available for all users) at the bottom of this file.
|
||||
*/
|
||||
|
||||
/**
|
||||
* Random Example function do something
|
||||
*
|
||||
* @param {string} id
|
||||
* @param {Boolean} isdir
|
||||
* @return {*} ...
|
||||
*/
|
||||
/*
|
||||
function indexmenu_custom_dosomething(a, isdir) {
|
||||
//do something
|
||||
return false;
|
||||
}
|
||||
*/
|
||||
|
|
@ -0,0 +1,634 @@
|
|||
/*******************************************************************************
|
||||
* jquery.ui-contextmenu.js plugin.
|
||||
*
|
||||
* jQuery plugin that provides a context menu (based on the jQueryUI menu widget).
|
||||
*
|
||||
* @see https://github.com/mar10/jquery-ui-contextmenu
|
||||
*
|
||||
* Copyright (c) 2013-2018, Martin Wendt (http://wwWendt.de). Licensed MIT.
|
||||
*/
|
||||
|
||||
(function( factory ) {
|
||||
"use strict";
|
||||
if ( typeof define === "function" && define.amd ) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define([ "jquery", "jquery-ui/ui/widgets/menu" ], factory );
|
||||
} else {
|
||||
// Browser globals
|
||||
factory( jQuery );
|
||||
}
|
||||
}(function( $ ) {
|
||||
|
||||
"use strict";
|
||||
|
||||
var supportSelectstart = "onselectstart" in document.createElement("div"),
|
||||
match = $.ui.menu.version.match(/^(\d)\.(\d+)/),
|
||||
uiVersion = {
|
||||
major: parseInt(match[1], 10),
|
||||
minor: parseInt(match[2], 10)
|
||||
},
|
||||
isLTE110 = ( uiVersion.major < 2 && uiVersion.minor <= 10 ),
|
||||
isLTE111 = ( uiVersion.major < 2 && uiVersion.minor <= 11 );
|
||||
|
||||
$.widget("moogle.contextmenu", {
|
||||
version: "@VERSION",
|
||||
options: {
|
||||
addClass: "ui-contextmenu", // Add this class to the outer <ul>
|
||||
closeOnWindowBlur: true, // Close menu when window loses focus
|
||||
appendTo: "body", // Set keyboard focus to first entry on open
|
||||
autoFocus: false, // Set keyboard focus to first entry on open
|
||||
autoTrigger: true, // open menu on browser's `contextmenu` event
|
||||
delegate: null, // selector
|
||||
hide: { effect: "fadeOut", duration: "fast" },
|
||||
ignoreParentSelect: true, // Don't trigger 'select' for sub-menu parents
|
||||
menu: null, // selector or jQuery pointing to <UL>, or a definition hash
|
||||
position: null, // popup positon
|
||||
preventContextMenuForPopup: false, // prevent opening the browser's system
|
||||
// context menu on menu entries
|
||||
preventSelect: false, // disable text selection of target
|
||||
show: { effect: "slideDown", duration: "fast" },
|
||||
taphold: false, // open menu on taphold events (requires external plugins)
|
||||
uiMenuOptions: {}, // Additional options, used when UI Menu is created
|
||||
// Events:
|
||||
beforeOpen: $.noop, // menu about to open; return `false` to prevent opening
|
||||
blur: $.noop, // menu option lost focus
|
||||
close: $.noop, // menu was closed
|
||||
create: $.noop, // menu was initialized
|
||||
createMenu: $.noop, // menu was initialized (original UI Menu)
|
||||
focus: $.noop, // menu option got focus
|
||||
open: $.noop, // menu was opened
|
||||
select: $.noop // menu option was selected; return `false` to prevent closing
|
||||
},
|
||||
/** Constructor */
|
||||
_create: function() {
|
||||
var cssText, eventNames, targetId,
|
||||
opts = this.options;
|
||||
|
||||
this.$headStyle = null;
|
||||
this.$menu = null;
|
||||
this.menuIsTemp = false;
|
||||
this.currentTarget = null;
|
||||
this.extraData = {};
|
||||
this.previousFocus = null;
|
||||
|
||||
if (opts.delegate == null) {
|
||||
$.error("ui-contextmenu: Missing required option `delegate`.");
|
||||
}
|
||||
if (opts.preventSelect) {
|
||||
// Create a global style for all potential menu targets
|
||||
// If the contextmenu was bound to `document`, we apply the
|
||||
// selector relative to the <body> tag instead
|
||||
targetId = ($(this.element).is(document) ? $("body")
|
||||
: this.element).uniqueId().attr("id");
|
||||
cssText = "#" + targetId + " " + opts.delegate + " { " +
|
||||
"-webkit-user-select: none; " +
|
||||
"-khtml-user-select: none; " +
|
||||
"-moz-user-select: none; " +
|
||||
"-ms-user-select: none; " +
|
||||
"user-select: none; " +
|
||||
"}";
|
||||
this.$headStyle = $("<style class='moogle-contextmenu-style' />")
|
||||
.prop("type", "text/css")
|
||||
.appendTo("head");
|
||||
|
||||
try {
|
||||
this.$headStyle.html(cssText);
|
||||
} catch ( e ) {
|
||||
// issue #47: fix for IE 6-8
|
||||
this.$headStyle[0].styleSheet.cssText = cssText;
|
||||
}
|
||||
// TODO: the selectstart is not supported by FF?
|
||||
if (supportSelectstart) {
|
||||
this.element.on("selectstart" + this.eventNamespace, opts.delegate,
|
||||
function(event) {
|
||||
event.preventDefault();
|
||||
});
|
||||
}
|
||||
}
|
||||
this._createUiMenu(opts.menu);
|
||||
|
||||
eventNames = "contextmenu" + this.eventNamespace;
|
||||
if (opts.taphold) {
|
||||
eventNames += " taphold" + this.eventNamespace;
|
||||
}
|
||||
this.element.on(eventNames, opts.delegate, $.proxy(this._openMenu, this));
|
||||
},
|
||||
/** Destructor, called on $().contextmenu("destroy"). */
|
||||
_destroy: function() {
|
||||
this.element.off(this.eventNamespace);
|
||||
|
||||
this._createUiMenu(null);
|
||||
|
||||
if (this.$headStyle) {
|
||||
this.$headStyle.remove();
|
||||
this.$headStyle = null;
|
||||
}
|
||||
},
|
||||
/** (Re)Create jQuery UI Menu. */
|
||||
_createUiMenu: function(menuDef) {
|
||||
var ct, ed,
|
||||
opts = this.options;
|
||||
|
||||
// Remove temporary <ul> if any
|
||||
if (this.isOpen()) {
|
||||
// #58: 'replaceMenu' in beforeOpen causing select: to lose ui.target
|
||||
ct = this.currentTarget;
|
||||
ed = this.extraData;
|
||||
// close without animation, to force async mode
|
||||
this._closeMenu(true);
|
||||
this.currentTarget = ct;
|
||||
this.extraData = ed;
|
||||
}
|
||||
if (this.menuIsTemp) {
|
||||
this.$menu.remove(); // this will also destroy ui.menu
|
||||
} else if (this.$menu) {
|
||||
this.$menu
|
||||
.menu("destroy")
|
||||
.removeClass(opts.addClass)
|
||||
.hide();
|
||||
}
|
||||
this.$menu = null;
|
||||
this.menuIsTemp = false;
|
||||
// If a menu definition array was passed, create a hidden <ul>
|
||||
// and generate the structure now
|
||||
if ( !menuDef ) {
|
||||
return;
|
||||
} else if ($.isArray(menuDef)) {
|
||||
this.$menu = $.moogle.contextmenu.createMenuMarkup(menuDef, null, opts);
|
||||
this.menuIsTemp = true;
|
||||
}else if ( typeof menuDef === "string" ) {
|
||||
this.$menu = $(menuDef);
|
||||
} else {
|
||||
this.$menu = menuDef;
|
||||
}
|
||||
// Create - but hide - the jQuery UI Menu widget
|
||||
this.$menu
|
||||
.hide()
|
||||
.addClass(opts.addClass)
|
||||
// Create a menu instance that delegates events to our widget
|
||||
.menu($.extend(true, {}, opts.uiMenuOptions, {
|
||||
items: "> :not(.ui-widget-header)",
|
||||
blur: $.proxy(opts.blur, this),
|
||||
create: $.proxy(opts.createMenu, this),
|
||||
focus: $.proxy(opts.focus, this),
|
||||
select: $.proxy(function(event, ui) {
|
||||
// User selected a menu entry
|
||||
var retval,
|
||||
isParent = $.moogle.contextmenu.isMenu(ui.item),
|
||||
actionHandler = ui.item.data("actionHandler");
|
||||
|
||||
ui.cmd = ui.item.attr("data-command");
|
||||
ui.target = $(this.currentTarget);
|
||||
ui.extraData = this.extraData;
|
||||
// ignore clicks, if they only open a sub-menu
|
||||
if ( !isParent || !opts.ignoreParentSelect) {
|
||||
retval = this._trigger.call(this, "select", event, ui);
|
||||
if ( actionHandler ) {
|
||||
retval = actionHandler.call(this, event, ui);
|
||||
}
|
||||
if ( retval !== false ) {
|
||||
this._closeMenu.call(this);
|
||||
}
|
||||
event.preventDefault();
|
||||
}
|
||||
}, this)
|
||||
}));
|
||||
},
|
||||
/** Open popup (called on 'contextmenu' event). */
|
||||
_openMenu: function(event, recursive) {
|
||||
var res, promise, ui,
|
||||
opts = this.options,
|
||||
posOption = opts.position,
|
||||
self = this,
|
||||
manualTrigger = !!event.isTrigger;
|
||||
|
||||
if ( !opts.autoTrigger && !manualTrigger ) {
|
||||
// ignore browser's `contextmenu` events
|
||||
return;
|
||||
}
|
||||
// Prevent browser from opening the system context menu
|
||||
event.preventDefault();
|
||||
|
||||
this.currentTarget = event.target;
|
||||
this.extraData = event._extraData || {};
|
||||
|
||||
ui = { menu: this.$menu, target: $(this.currentTarget), extraData: this.extraData,
|
||||
originalEvent: event, result: null };
|
||||
|
||||
if ( !recursive ) {
|
||||
res = this._trigger("beforeOpen", event, ui);
|
||||
promise = (ui.result && $.isFunction(ui.result.promise)) ? ui.result : null;
|
||||
ui.result = null;
|
||||
if ( res === false ) {
|
||||
this.currentTarget = null;
|
||||
return false;
|
||||
} else if ( promise ) {
|
||||
// Handler returned a Deferred or Promise. Delay menu open until
|
||||
// the promise is resolved
|
||||
promise.done(function() {
|
||||
self._openMenu(event, true);
|
||||
});
|
||||
this.currentTarget = null;
|
||||
return false;
|
||||
}
|
||||
ui.menu = this.$menu; // Might have changed in beforeOpen
|
||||
}
|
||||
|
||||
// Register global event handlers that close the dropdown-menu
|
||||
$(document).on("keydown" + this.eventNamespace, function(event) {
|
||||
if ( event.which === $.ui.keyCode.ESCAPE ) {
|
||||
self._closeMenu();
|
||||
}
|
||||
}).on("mousedown" + this.eventNamespace + " touchstart" + this.eventNamespace,
|
||||
function(event) {
|
||||
// Close menu when clicked outside menu
|
||||
if ( !$(event.target).closest(".ui-menu-item").length ) {
|
||||
self._closeMenu();
|
||||
}
|
||||
});
|
||||
$(window).on("blur" + this.eventNamespace, function(event) {
|
||||
if ( opts.closeOnWindowBlur ) {
|
||||
self._closeMenu();
|
||||
}
|
||||
});
|
||||
|
||||
// required for custom positioning (issue #18 and #13).
|
||||
if ($.isFunction(posOption)) {
|
||||
posOption = posOption(event, ui);
|
||||
}
|
||||
posOption = $.extend({
|
||||
my: "left top",
|
||||
at: "left bottom",
|
||||
// if called by 'open' method, event does not have pageX/Y
|
||||
of: (event.pageX === undefined) ? event.target : event,
|
||||
collision: "fit"
|
||||
}, posOption);
|
||||
|
||||
// Update entry statuses from callbacks
|
||||
this._updateEntries(this.$menu);
|
||||
|
||||
// Finally display the popup
|
||||
this.$menu
|
||||
.show() // required to fix positioning error
|
||||
.css({
|
||||
position: "absolute",
|
||||
left: 0,
|
||||
top: 0
|
||||
}).position(posOption)
|
||||
.hide(); // hide again, so we can apply nice effects
|
||||
|
||||
if ( opts.preventContextMenuForPopup ) {
|
||||
this.$menu.on("contextmenu" + this.eventNamespace, function(event) {
|
||||
event.preventDefault();
|
||||
});
|
||||
}
|
||||
this._show(this.$menu, opts.show, function() {
|
||||
var $first;
|
||||
|
||||
// Set focus to first active menu entry
|
||||
if ( opts.autoFocus ) {
|
||||
self.previousFocus = $(event.target);
|
||||
// self.$menu.focus();
|
||||
$first = self.$menu
|
||||
.children("li.ui-menu-item")
|
||||
.not(".ui-state-disabled")
|
||||
.first();
|
||||
self.$menu.menu("focus", null, $first).focus();
|
||||
}
|
||||
self._trigger.call(self, "open", event, ui);
|
||||
});
|
||||
},
|
||||
/** Close popup. */
|
||||
_closeMenu: function(immediately) {
|
||||
var self = this,
|
||||
hideOpts = immediately ? false : this.options.hide,
|
||||
ui = { menu: this.$menu, target: $(this.currentTarget), extraData: this.extraData };
|
||||
|
||||
// Note: we don't want to unbind the 'contextmenu' event
|
||||
$(document)
|
||||
.off("mousedown" + this.eventNamespace)
|
||||
.off("touchstart" + this.eventNamespace)
|
||||
.off("keydown" + this.eventNamespace);
|
||||
$(window)
|
||||
.off("blur" + this.eventNamespace);
|
||||
|
||||
self.currentTarget = null; // issue #44 after hide animation is too late
|
||||
self.extraData = {};
|
||||
if ( this.$menu ) { // #88: widget might have been destroyed already
|
||||
this.$menu
|
||||
.off("contextmenu" + this.eventNamespace);
|
||||
this._hide(this.$menu, hideOpts, function() {
|
||||
if ( self.previousFocus ) {
|
||||
self.previousFocus.focus();
|
||||
self.previousFocus = null;
|
||||
}
|
||||
self._trigger("close", null, ui);
|
||||
});
|
||||
} else {
|
||||
self._trigger("close", null, ui);
|
||||
}
|
||||
},
|
||||
/** Handle $().contextmenu("option", key, value) calls. */
|
||||
_setOption: function(key, value) {
|
||||
switch (key) {
|
||||
case "menu":
|
||||
this.replaceMenu(value);
|
||||
break;
|
||||
}
|
||||
$.Widget.prototype._setOption.apply(this, arguments);
|
||||
},
|
||||
/** Return ui-menu entry (<LI> tag). */
|
||||
_getMenuEntry: function(cmd) {
|
||||
return this.$menu.find("li[data-command=" + cmd + "]");
|
||||
},
|
||||
/** Close context menu. */
|
||||
close: function() {
|
||||
if (this.isOpen()) {
|
||||
this._closeMenu();
|
||||
}
|
||||
},
|
||||
/* Apply status callbacks when menu is opened. */
|
||||
_updateEntries: function() {
|
||||
var self = this,
|
||||
ui = {
|
||||
menu: this.$menu, target: $(this.currentTarget), extraData: this.extraData };
|
||||
|
||||
$.each(this.$menu.find(".ui-menu-item"), function(i, o) {
|
||||
var $entry = $(o),
|
||||
fn = $entry.data("disabledHandler"),
|
||||
res = fn ? fn({ type: "disabled" }, ui) : null;
|
||||
|
||||
ui.item = $entry;
|
||||
ui.cmd = $entry.attr("data-command");
|
||||
// Evaluate `disabled()` callback
|
||||
if ( res != null ) {
|
||||
self.enableEntry(ui.cmd, !res);
|
||||
self.showEntry(ui.cmd, res !== "hide");
|
||||
}
|
||||
// Evaluate `title()` callback
|
||||
fn = $entry.data("titleHandler"),
|
||||
res = fn ? fn({ type: "title" }, ui) : null;
|
||||
if ( res != null ) {
|
||||
self.setTitle(ui.cmd, "" + res);
|
||||
}
|
||||
// Evaluate `tooltip()` callback
|
||||
fn = $entry.data("tooltipHandler"),
|
||||
res = fn ? fn({ type: "tooltip" }, ui) : null;
|
||||
if ( res != null ) {
|
||||
$entry.attr("title", "" + res);
|
||||
}
|
||||
});
|
||||
},
|
||||
/** Enable or disable the menu command. */
|
||||
enableEntry: function(cmd, flag) {
|
||||
this._getMenuEntry(cmd).toggleClass("ui-state-disabled", (flag === false));
|
||||
},
|
||||
/** Return ui-menu entry (LI tag) as jQuery object. */
|
||||
getEntry: function(cmd) {
|
||||
return this._getMenuEntry(cmd);
|
||||
},
|
||||
/** Return ui-menu entry wrapper as jQuery object.
|
||||
UI 1.10: this is the <a> tag inside the LI
|
||||
UI 1.11: this is the LI istself
|
||||
UI 1.12: this is the <div> tag inside the LI
|
||||
*/
|
||||
getEntryWrapper: function(cmd) {
|
||||
return this._getMenuEntry(cmd).find(">[role=menuitem]").addBack("[role=menuitem]");
|
||||
},
|
||||
/** Return Menu element (UL). */
|
||||
getMenu: function() {
|
||||
return this.$menu;
|
||||
},
|
||||
/** Return true if menu is open. */
|
||||
isOpen: function() {
|
||||
// return this.$menu && this.$menu.is(":visible");
|
||||
return !!this.$menu && !!this.currentTarget;
|
||||
},
|
||||
/** Open context menu on a specific target (must match options.delegate)
|
||||
* Optional `extraData` is passed to event handlers as `ui.extraData`.
|
||||
*/
|
||||
open: function(targetOrEvent, extraData) {
|
||||
// Fake a 'contextmenu' event
|
||||
extraData = extraData || {};
|
||||
|
||||
var isEvent = (targetOrEvent && targetOrEvent.type && targetOrEvent.target),
|
||||
event = isEvent ? targetOrEvent : {},
|
||||
target = isEvent ? targetOrEvent.target : targetOrEvent,
|
||||
e = jQuery.Event("contextmenu", {
|
||||
target: $(target).get(0),
|
||||
pageX: event.pageX,
|
||||
pageY: event.pageY,
|
||||
originalEvent: isEvent ? targetOrEvent : undefined,
|
||||
_extraData: extraData
|
||||
});
|
||||
return this.element.trigger(e);
|
||||
},
|
||||
/** Replace the menu altogether. */
|
||||
replaceMenu: function(data) {
|
||||
this._createUiMenu(data);
|
||||
},
|
||||
/** Redefine a whole menu entry. */
|
||||
setEntry: function(cmd, entry) {
|
||||
var $ul,
|
||||
$entryLi = this._getMenuEntry(cmd);
|
||||
|
||||
if (typeof entry === "string") {
|
||||
window.console && window.console.warn(
|
||||
"setEntry(cmd, t) with a plain string title is deprecated since v1.18." +
|
||||
"Use setTitle(cmd, '" + entry + "') instead.");
|
||||
return this.setTitle(cmd, entry);
|
||||
}
|
||||
$entryLi.empty();
|
||||
entry.cmd = entry.cmd || cmd;
|
||||
$.moogle.contextmenu.createEntryMarkup(entry, $entryLi);
|
||||
if ($.isArray(entry.children)) {
|
||||
$ul = $("<ul/>").appendTo($entryLi);
|
||||
$.moogle.contextmenu.createMenuMarkup(entry.children, $ul);
|
||||
}
|
||||
// #110: jQuery UI 1.12: refresh only works when this class is not set:
|
||||
$entryLi.removeClass("ui-menu-item");
|
||||
this.getMenu().menu("refresh");
|
||||
},
|
||||
/** Set icon (pass null to remove). */
|
||||
setIcon: function(cmd, icon) {
|
||||
return this.updateEntry(cmd, { uiIcon: icon });
|
||||
},
|
||||
/** Set title. */
|
||||
setTitle: function(cmd, title) {
|
||||
return this.updateEntry(cmd, { title: title });
|
||||
},
|
||||
// /** Set tooltip (pass null to remove). */
|
||||
// setTooltip: function(cmd, tooltip) {
|
||||
// this._getMenuEntry(cmd).attr("title", tooltip);
|
||||
// },
|
||||
/** Show or hide the menu command. */
|
||||
showEntry: function(cmd, flag) {
|
||||
this._getMenuEntry(cmd).toggle(flag !== false);
|
||||
},
|
||||
/** Redefine selective attributes of a menu entry. */
|
||||
updateEntry: function(cmd, entry) {
|
||||
var $icon, $wrapper,
|
||||
$entryLi = this._getMenuEntry(cmd);
|
||||
|
||||
if ( entry.title !== undefined ) {
|
||||
$.moogle.contextmenu.updateTitle($entryLi, "" + entry.title);
|
||||
}
|
||||
if ( entry.tooltip !== undefined ) {
|
||||
if ( entry.tooltip === null ) {
|
||||
$entryLi.removeAttr("title");
|
||||
} else {
|
||||
$entryLi.attr("title", entry.tooltip);
|
||||
}
|
||||
}
|
||||
if ( entry.uiIcon !== undefined ) {
|
||||
$wrapper = this.getEntryWrapper(cmd),
|
||||
$icon = $wrapper.find("span.ui-icon").not(".ui-menu-icon");
|
||||
$icon.remove();
|
||||
if ( entry.uiIcon ) {
|
||||
$wrapper.append($("<span class='ui-icon' />").addClass(entry.uiIcon));
|
||||
}
|
||||
}
|
||||
if ( entry.hide !== undefined ) {
|
||||
$entryLi.toggle(!entry.hide);
|
||||
} else if ( entry.show !== undefined ) {
|
||||
// Note: `show` is an undocumented variant. `hide: false` is preferred
|
||||
$entryLi.toggle(!!entry.show);
|
||||
}
|
||||
// if ( entry.isHeader !== undefined ) {
|
||||
// $entryLi.toggleClass("ui-widget-header", !!entry.isHeader);
|
||||
// }
|
||||
if ( entry.data !== undefined ) {
|
||||
$entryLi.data(entry.data);
|
||||
}
|
||||
|
||||
// Set/clear class names, but handle ui-state-disabled separately
|
||||
if ( entry.disabled === undefined ) {
|
||||
entry.disabled = $entryLi.hasClass("ui-state-disabled");
|
||||
}
|
||||
if ( entry.setClass ) {
|
||||
if ( $entryLi.hasClass("ui-menu-item") ) {
|
||||
entry.setClass += " ui-menu-item";
|
||||
}
|
||||
$entryLi.removeClass();
|
||||
$entryLi.addClass(entry.setClass);
|
||||
} else if ( entry.addClass ) {
|
||||
$entryLi.addClass(entry.addClass);
|
||||
}
|
||||
$entryLi.toggleClass("ui-state-disabled", !!entry.disabled);
|
||||
// // #110: jQuery UI 1.12: refresh only works when this class is not set:
|
||||
// $entryLi.removeClass("ui-menu-item");
|
||||
// this.getMenu().menu("refresh");
|
||||
}
|
||||
});
|
||||
|
||||
/*
|
||||
* Global functions
|
||||
*/
|
||||
$.extend($.moogle.contextmenu, {
|
||||
/** Convert a menu description into a into a <li> content. */
|
||||
createEntryMarkup: function(entry, $parentLi) {
|
||||
var $wrapper = null;
|
||||
|
||||
$parentLi.attr("data-command", entry.cmd);
|
||||
|
||||
if ( !/[^\-\u2014\u2013\s]/.test( entry.title ) ) {
|
||||
// hyphen, em dash, en dash: separator as defined by UI Menu 1.10
|
||||
$parentLi.text(entry.title);
|
||||
} else {
|
||||
if ( isLTE110 ) {
|
||||
// jQuery UI Menu 1.10 or before required an `<a>` tag
|
||||
$wrapper = $("<a/>", {
|
||||
html: "" + entry.title,
|
||||
href: "#"
|
||||
}).appendTo($parentLi);
|
||||
|
||||
} else if ( isLTE111 ) {
|
||||
// jQuery UI Menu 1.11 preferes to avoid `<a>` tags or <div> wrapper
|
||||
$parentLi.html("" + entry.title);
|
||||
$wrapper = $parentLi;
|
||||
|
||||
} else {
|
||||
// jQuery UI Menu 1.12 introduced `<div>` wrappers
|
||||
$wrapper = $("<div/>", {
|
||||
html: "" + entry.title
|
||||
}).appendTo($parentLi);
|
||||
}
|
||||
if ( entry.uiIcon ) {
|
||||
$wrapper.append($("<span class='ui-icon' />").addClass(entry.uiIcon));
|
||||
}
|
||||
// Store option callbacks in entry's data
|
||||
$.each( [ "action", "disabled", "title", "tooltip" ], function(i, attr) {
|
||||
if ( $.isFunction(entry[attr]) ) {
|
||||
$parentLi.data(attr + "Handler", entry[attr]);
|
||||
}
|
||||
});
|
||||
if ( entry.disabled === true ) {
|
||||
$parentLi.addClass("ui-state-disabled");
|
||||
}
|
||||
if ( entry.isHeader ) {
|
||||
$parentLi.addClass("ui-widget-header");
|
||||
}
|
||||
if ( entry.addClass ) {
|
||||
$parentLi.addClass(entry.addClass);
|
||||
}
|
||||
if ( $.isPlainObject(entry.data) ) {
|
||||
$parentLi.data(entry.data);
|
||||
}
|
||||
if ( typeof entry.tooltip === "string" ) {
|
||||
$parentLi.attr("title", entry.tooltip);
|
||||
}
|
||||
}
|
||||
},
|
||||
/** Convert a nested array of command objects into a <ul> structure. */
|
||||
createMenuMarkup: function(options, $parentUl, opts) {
|
||||
var i, menu, $ul, $li,
|
||||
appendTo = (opts && opts.appendTo) ? opts.appendTo : "body";
|
||||
|
||||
if ( $parentUl == null ) {
|
||||
$parentUl = $("<ul class='ui-helper-hidden' />").appendTo(appendTo);
|
||||
}
|
||||
for (i = 0; i < options.length; i++) {
|
||||
menu = options[i];
|
||||
$li = $("<li/>").appendTo($parentUl);
|
||||
|
||||
$.moogle.contextmenu.createEntryMarkup(menu, $li);
|
||||
|
||||
if ( $.isArray(menu.children) ) {
|
||||
$ul = $("<ul/>").appendTo($li);
|
||||
$.moogle.contextmenu.createMenuMarkup(menu.children, $ul);
|
||||
}
|
||||
}
|
||||
return $parentUl;
|
||||
},
|
||||
/** Returns true if the menu item has child menu items */
|
||||
isMenu: function(item) {
|
||||
if ( isLTE110 ) {
|
||||
return item.has(">a[aria-haspopup='true']").length > 0;
|
||||
} else if ( isLTE111 ) { // jQuery UI 1.11 used no tag wrappers
|
||||
return item.is("[aria-haspopup='true']");
|
||||
} else {
|
||||
return item.has(">div[aria-haspopup='true']").length > 0;
|
||||
}
|
||||
},
|
||||
/** Replace the title of elem', but retain icons andchild entries. */
|
||||
replaceFirstTextNodeChild: function(elem, html) {
|
||||
var $icons = elem.find(">span.ui-icon,>ul.ui-menu").detach();
|
||||
|
||||
elem
|
||||
.empty()
|
||||
.html(html)
|
||||
.append($icons);
|
||||
},
|
||||
/** Updates the menu item's title */
|
||||
updateTitle: function(item, title) {
|
||||
if ( isLTE110 ) { // jQuery UI 1.10 and before used <a> tags
|
||||
$.moogle.contextmenu.replaceFirstTextNodeChild($("a", item), title);
|
||||
} else if ( isLTE111 ) { // jQuery UI 1.11 used no tag wrappers
|
||||
$.moogle.contextmenu.replaceFirstTextNodeChild(item, title);
|
||||
} else { // jQuery UI 1.12+ introduced <div> tag wrappers
|
||||
$.moogle.contextmenu.replaceFirstTextNodeChild($("div", item), title);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
}));
|
||||
4
plugins/55/indexmenu/scripts/contextmenu/jquery.ui-contextmenu.min.js
vendored
Normal file
4
plugins/55/indexmenu/scripts/contextmenu/jquery.ui-contextmenu.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
21
plugins/55/indexmenu/scripts/fancytree/LICENSE.txt
Normal file
21
plugins/55/indexmenu/scripts/fancytree/LICENSE.txt
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
Copyright 2008-2023 Martin Wendt,
|
||||
https://wwWendt.de/
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of this software and associated documentation files (the
|
||||
"Software"), to deal in the Software without restriction, including
|
||||
without limitation the rights to use, copy, modify, merge, publish,
|
||||
distribute, sublicense, and/or sell copies of the Software, and to
|
||||
permit persons to whom the Software is furnished to do so, subject to
|
||||
the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be
|
||||
included in all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
||||
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
||||
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
||||
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
||||
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
13856
plugins/55/indexmenu/scripts/fancytree/jquery.fancytree-all-deps.js
Normal file
13856
plugins/55/indexmenu/scripts/fancytree/jquery.fancytree-all-deps.js
Normal file
File diff suppressed because it is too large
Load diff
2
plugins/55/indexmenu/scripts/fancytree/jquery.fancytree-all-deps.min.js
vendored
Normal file
2
plugins/55/indexmenu/scripts/fancytree/jquery.fancytree-all-deps.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
13178
plugins/55/indexmenu/scripts/fancytree/jquery.fancytree-all.js
Normal file
13178
plugins/55/indexmenu/scripts/fancytree/jquery.fancytree-all.js
Normal file
File diff suppressed because it is too large
Load diff
62
plugins/55/indexmenu/scripts/fancytree/jquery.fancytree-all.min.js
vendored
Normal file
62
plugins/55/indexmenu/scripts/fancytree/jquery.fancytree-all.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
plugins/55/indexmenu/scripts/fancytree/jquery.fancytree.min.js
vendored
Normal file
1
plugins/55/indexmenu/scripts/fancytree/jquery.fancytree.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,714 @@
|
|||
/*!
|
||||
* jquery.fancytree.ariagrid.js
|
||||
*
|
||||
* Support ARIA compliant markup and keyboard navigation for tree grids with
|
||||
* embedded input controls.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* @requires ext-table
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define([
|
||||
"jquery",
|
||||
"./jquery.fancytree",
|
||||
"./jquery.fancytree.table",
|
||||
], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree.table"); // core + table
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/*******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
|
||||
// Allow these navigation keys even when input controls are focused
|
||||
|
||||
var FT = $.ui.fancytree,
|
||||
clsFancytreeActiveCell = "fancytree-active-cell",
|
||||
clsFancytreeCellMode = "fancytree-cell-mode",
|
||||
clsFancytreeCellNavMode = "fancytree-cell-nav-mode",
|
||||
VALID_MODES = ["allow", "force", "start", "off"],
|
||||
// Define which keys are handled by embedded <input> control, and should
|
||||
// *not* be passed to tree navigation handler in cell-edit mode:
|
||||
INPUT_KEYS = {
|
||||
text: ["left", "right", "home", "end", "backspace"],
|
||||
number: ["up", "down", "left", "right", "home", "end", "backspace"],
|
||||
checkbox: [],
|
||||
link: [],
|
||||
radiobutton: ["up", "down"],
|
||||
"select-one": ["up", "down"],
|
||||
"select-multiple": ["up", "down"],
|
||||
},
|
||||
NAV_KEYS = ["up", "down", "left", "right", "home", "end"];
|
||||
|
||||
/* Set aria-activedescendant on container to active cell's ID (generate one if required).*/
|
||||
function setActiveDescendant(tree, $target) {
|
||||
var id = $target ? $target.uniqueId().attr("id") : "";
|
||||
|
||||
tree.$container.attr("aria-activedescendant", id);
|
||||
}
|
||||
|
||||
/* Calculate TD column index (considering colspans).*/
|
||||
function getColIdx($tr, $td) {
|
||||
var colspan,
|
||||
td = $td.get(0),
|
||||
idx = 0;
|
||||
|
||||
$tr.children().each(function () {
|
||||
if (this === td) {
|
||||
return false;
|
||||
}
|
||||
colspan = $(this).prop("colspan");
|
||||
idx += colspan ? colspan : 1;
|
||||
});
|
||||
return idx;
|
||||
}
|
||||
|
||||
/* Find TD at given column index (considering colspans).*/
|
||||
function findTdAtColIdx($tr, colIdx) {
|
||||
var colspan,
|
||||
res = null,
|
||||
idx = 0;
|
||||
|
||||
$tr.children().each(function () {
|
||||
if (idx >= colIdx) {
|
||||
res = $(this);
|
||||
return false;
|
||||
}
|
||||
colspan = $(this).prop("colspan");
|
||||
idx += colspan ? colspan : 1;
|
||||
});
|
||||
return res;
|
||||
}
|
||||
|
||||
/* Find adjacent cell for a given direction. Skip empty cells and consider merged cells */
|
||||
function findNeighbourTd(tree, $target, keyCode) {
|
||||
var nextNode,
|
||||
node,
|
||||
navMap = { "ctrl+home": "first", "ctrl+end": "last" },
|
||||
$td = $target.closest("td"),
|
||||
$tr = $td.parent(),
|
||||
treeOpts = tree.options,
|
||||
colIdx = getColIdx($tr, $td),
|
||||
$tdNext = null;
|
||||
|
||||
keyCode = navMap[keyCode] || keyCode;
|
||||
|
||||
switch (keyCode) {
|
||||
case "left":
|
||||
$tdNext = treeOpts.rtl ? $td.next() : $td.prev();
|
||||
break;
|
||||
case "right":
|
||||
$tdNext = treeOpts.rtl ? $td.prev() : $td.next();
|
||||
break;
|
||||
case "up":
|
||||
case "down":
|
||||
case "ctrl+home":
|
||||
case "ctrl+end":
|
||||
node = $tr[0].ftnode;
|
||||
nextNode = tree.findRelatedNode(node, keyCode);
|
||||
if (nextNode) {
|
||||
nextNode.makeVisible();
|
||||
nextNode.setActive();
|
||||
$tdNext = findTdAtColIdx($(nextNode.tr), colIdx);
|
||||
}
|
||||
break;
|
||||
case "home":
|
||||
$tdNext = treeOpts.rtl
|
||||
? $tr.children("td").last()
|
||||
: $tr.children("td").first();
|
||||
break;
|
||||
case "end":
|
||||
$tdNext = treeOpts.rtl
|
||||
? $tr.children("td").first()
|
||||
: $tr.children("td").last();
|
||||
break;
|
||||
}
|
||||
return $tdNext && $tdNext.length ? $tdNext : null;
|
||||
}
|
||||
|
||||
/* Return a descriptive string of the current mode. */
|
||||
function getGridNavMode(tree) {
|
||||
if (tree.$activeTd) {
|
||||
return tree.forceNavMode ? "cell-nav" : "cell-edit";
|
||||
}
|
||||
return "row";
|
||||
}
|
||||
|
||||
/* .*/
|
||||
function activateEmbeddedLink($td) {
|
||||
// $td.find( "a" )[ 0 ].trigger("click"); // does not work (always)?
|
||||
// $td.find( "a" ).trigger("click");
|
||||
var event = document.createEvent("MouseEvent"),
|
||||
a = $td.find("a")[0]; // document.getElementById('nameOfID');
|
||||
|
||||
event = new CustomEvent("click");
|
||||
a.dispatchEvent(event);
|
||||
}
|
||||
|
||||
/**
|
||||
* [ext-ariagrid] Set active cell and activate cell-nav or cell-edit mode if needed.
|
||||
* Pass $td=null to enter row-mode.
|
||||
*
|
||||
* See also FancytreeNode#setActive(flag, {cell: idx})
|
||||
*
|
||||
* @param {jQuery | Element | integer} [$td]
|
||||
* @param {Event|null} [orgEvent=null]
|
||||
* @alias Fancytree#activateCell
|
||||
* @requires jquery.fancytree.ariagrid.js
|
||||
* @since 2.23
|
||||
*/
|
||||
$.ui.fancytree._FancytreeClass.prototype.activateCell = function (
|
||||
$td,
|
||||
orgEvent
|
||||
) {
|
||||
var colIdx,
|
||||
$input,
|
||||
$tr,
|
||||
res,
|
||||
tree = this,
|
||||
$prevTd = this.$activeTd || null,
|
||||
newNode = $td ? FT.getNode($td) : null,
|
||||
prevNode = $prevTd ? FT.getNode($prevTd) : null,
|
||||
anyNode = newNode || prevNode,
|
||||
$prevTr = $prevTd ? $prevTd.closest("tr") : null;
|
||||
|
||||
anyNode.debug(
|
||||
"activateCell(" +
|
||||
($prevTd ? $prevTd.text() : "null") +
|
||||
") -> " +
|
||||
($td ? $td.text() : "OFF")
|
||||
);
|
||||
|
||||
// Make available as event
|
||||
|
||||
if ($td) {
|
||||
FT.assert($td.length, "Invalid active cell");
|
||||
colIdx = getColIdx($(newNode.tr), $td);
|
||||
res = this._triggerNodeEvent("activateCell", newNode, orgEvent, {
|
||||
activeTd: tree.$activeTd,
|
||||
colIdx: colIdx,
|
||||
mode: null, // editMode ? "cell-edit" : "cell-nav"
|
||||
});
|
||||
if (res === false) {
|
||||
return false;
|
||||
}
|
||||
this.$container.addClass(clsFancytreeCellMode);
|
||||
this.$container.toggleClass(
|
||||
clsFancytreeCellNavMode,
|
||||
!!this.forceNavMode
|
||||
);
|
||||
$tr = $td.closest("tr");
|
||||
if ($prevTd) {
|
||||
// cell-mode => cell-mode
|
||||
if ($prevTd.is($td)) {
|
||||
return;
|
||||
}
|
||||
$prevTd
|
||||
.removeAttr("tabindex")
|
||||
.removeClass(clsFancytreeActiveCell);
|
||||
|
||||
if (!$prevTr.is($tr)) {
|
||||
// We are moving to a different row: only the inputs in the
|
||||
// active row should be tabbable
|
||||
$prevTr.find(">td :input,a").attr("tabindex", "-1");
|
||||
}
|
||||
}
|
||||
$tr.find(">td :input:enabled,a").attr("tabindex", "0");
|
||||
newNode.setActive();
|
||||
$td.addClass(clsFancytreeActiveCell);
|
||||
this.$activeTd = $td;
|
||||
|
||||
$input = $td.find(":input:enabled,a");
|
||||
this.debug("Focus input", $input);
|
||||
if ($input.length) {
|
||||
$input.focus();
|
||||
setActiveDescendant(this, $input);
|
||||
} else {
|
||||
$td.attr("tabindex", "-1").focus();
|
||||
setActiveDescendant(this, $td);
|
||||
}
|
||||
} else {
|
||||
res = this._triggerNodeEvent("activateCell", prevNode, orgEvent, {
|
||||
activeTd: null,
|
||||
colIdx: null,
|
||||
mode: "row",
|
||||
});
|
||||
if (res === false) {
|
||||
return false;
|
||||
}
|
||||
// $td == null: switch back to row-mode
|
||||
this.$container.removeClass(
|
||||
clsFancytreeCellMode + " " + clsFancytreeCellNavMode
|
||||
);
|
||||
// console.log("activateCell: set row-mode for " + this.activeNode, $prevTd);
|
||||
if ($prevTd) {
|
||||
// cell-mode => row-mode
|
||||
$prevTd
|
||||
.removeAttr("tabindex")
|
||||
.removeClass(clsFancytreeActiveCell);
|
||||
// In row-mode, only embedded inputs of the active row are tabbable
|
||||
$prevTr
|
||||
.find("td")
|
||||
.blur() // we need to blur first, because otherwise the focus frame is not reliably removed(?)
|
||||
.removeAttr("tabindex");
|
||||
$prevTr.find(">td :input,a").attr("tabindex", "-1");
|
||||
this.$activeTd = null;
|
||||
// The cell lost focus, but the tree still needs to capture keys:
|
||||
this.activeNode.setFocus();
|
||||
setActiveDescendant(this, $tr);
|
||||
} else {
|
||||
// row-mode => row-mode (nothing to do)
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/*******************************************************************************
|
||||
* Extension code
|
||||
*/
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "ariagrid",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
// Internal behavior flags
|
||||
activateCellOnDoubelclick: true,
|
||||
cellFocus: "allow",
|
||||
// TODO: use a global tree option `name` or `title` instead?:
|
||||
label: "Tree Grid", // Added as `aria-label` attribute
|
||||
},
|
||||
|
||||
treeInit: function (ctx) {
|
||||
var tree = ctx.tree,
|
||||
treeOpts = ctx.options,
|
||||
opts = treeOpts.ariagrid;
|
||||
|
||||
// ariagrid requires the table extension to be loaded before itself
|
||||
if (tree.ext.grid) {
|
||||
this._requireExtension("grid", true, true);
|
||||
} else {
|
||||
this._requireExtension("table", true, true);
|
||||
}
|
||||
if (!treeOpts.aria) {
|
||||
$.error("ext-ariagrid requires `aria: true`");
|
||||
}
|
||||
if ($.inArray(opts.cellFocus, VALID_MODES) < 0) {
|
||||
$.error("Invalid `cellFocus` option");
|
||||
}
|
||||
this._superApply(arguments);
|
||||
|
||||
// The combination of $activeTd and forceNavMode determines the current
|
||||
// navigation mode:
|
||||
this.$activeTd = null; // active cell (null in row-mode)
|
||||
this.forceNavMode = true;
|
||||
|
||||
this.$container
|
||||
.addClass("fancytree-ext-ariagrid")
|
||||
.toggleClass(clsFancytreeCellNavMode, !!this.forceNavMode)
|
||||
.attr("aria-label", "" + opts.label);
|
||||
this.$container
|
||||
.find("thead > tr > th")
|
||||
.attr("role", "columnheader");
|
||||
|
||||
// Store table options for easier evaluation of default actions
|
||||
// depending of active cell column
|
||||
this.nodeColumnIdx = treeOpts.table.nodeColumnIdx;
|
||||
this.checkboxColumnIdx = treeOpts.table.checkboxColumnIdx;
|
||||
if (this.checkboxColumnIdx == null) {
|
||||
this.checkboxColumnIdx = this.nodeColumnIdx;
|
||||
}
|
||||
|
||||
this.$container
|
||||
.on("focusin", function (event) {
|
||||
// Activate node if embedded input gets focus (due to a click)
|
||||
var node = FT.getNode(event.target),
|
||||
$td = $(event.target).closest("td");
|
||||
|
||||
// tree.debug( "focusin: " + ( node ? node.title : "null" ) +
|
||||
// ", target: " + ( $td ? $td.text() : null ) +
|
||||
// ", node was active: " + ( node && node.isActive() ) +
|
||||
// ", last cell: " + ( tree.$activeTd ? tree.$activeTd.text() : null ) );
|
||||
// tree.debug( "focusin: target", event.target );
|
||||
|
||||
// TODO: add ":input" as delegate filter instead of testing here
|
||||
if (
|
||||
node &&
|
||||
!$td.is(tree.$activeTd) &&
|
||||
$(event.target).is(":input")
|
||||
) {
|
||||
node.debug("Activate cell on INPUT focus event");
|
||||
tree.activateCell($td);
|
||||
}
|
||||
})
|
||||
.on("fancytreeinit", function (event, data) {
|
||||
if (
|
||||
opts.cellFocus === "start" ||
|
||||
opts.cellFocus === "force"
|
||||
) {
|
||||
tree.debug("Enforce cell-mode on init");
|
||||
tree.debug(
|
||||
"init",
|
||||
tree.getActiveNode() || tree.getFirstChild()
|
||||
);
|
||||
(
|
||||
tree.getActiveNode() || tree.getFirstChild()
|
||||
).setActive(true, { cell: tree.nodeColumnIdx });
|
||||
tree.debug(
|
||||
"init2",
|
||||
tree.getActiveNode() || tree.getFirstChild()
|
||||
);
|
||||
}
|
||||
})
|
||||
.on("fancytreefocustree", function (event, data) {
|
||||
// Enforce cell-mode when container gets focus
|
||||
if (opts.cellFocus === "force" && !tree.$activeTd) {
|
||||
var node = tree.getActiveNode() || tree.getFirstChild();
|
||||
tree.debug("Enforce cell-mode on focusTree event");
|
||||
node.setActive(true, { cell: 0 });
|
||||
}
|
||||
})
|
||||
// .on("fancytreeupdateviewport", function(event, data) {
|
||||
// tree.debug(event.type, data);
|
||||
// })
|
||||
.on("fancytreebeforeupdateviewport", function (event, data) {
|
||||
// When scrolling, the TR may be re-used by another node, so the
|
||||
// active cell marker an
|
||||
// tree.debug(event.type, data);
|
||||
if (tree.viewport && tree.$activeTd) {
|
||||
tree.info("Cancel cell-mode due to scroll event.");
|
||||
tree.activateCell(null);
|
||||
}
|
||||
});
|
||||
},
|
||||
nodeClick: function (ctx) {
|
||||
var targetType = ctx.targetType,
|
||||
tree = ctx.tree,
|
||||
node = ctx.node,
|
||||
event = ctx.originalEvent,
|
||||
$target = $(event.target),
|
||||
$td = $target.closest("td");
|
||||
|
||||
tree.debug(
|
||||
"nodeClick: node: " +
|
||||
(node ? node.title : "null") +
|
||||
", targetType: " +
|
||||
targetType +
|
||||
", target: " +
|
||||
($td.length ? $td.text() : null) +
|
||||
", node was active: " +
|
||||
(node && node.isActive()) +
|
||||
", last cell: " +
|
||||
(tree.$activeTd ? tree.$activeTd.text() : null)
|
||||
);
|
||||
|
||||
if (tree.$activeTd) {
|
||||
// If already in cell-mode, activate new cell
|
||||
tree.activateCell($td);
|
||||
if ($target.is(":input")) {
|
||||
return;
|
||||
} else if (
|
||||
$target.is(".fancytree-checkbox") ||
|
||||
$target.is(".fancytree-expander")
|
||||
) {
|
||||
return this._superApply(arguments);
|
||||
}
|
||||
return false;
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
nodeDblclick: function (ctx) {
|
||||
var tree = ctx.tree,
|
||||
treeOpts = ctx.options,
|
||||
opts = treeOpts.ariagrid,
|
||||
event = ctx.originalEvent,
|
||||
$td = $(event.target).closest("td");
|
||||
|
||||
// console.log("nodeDblclick", tree.$activeTd, ctx.options.ariagrid.cellFocus)
|
||||
if (
|
||||
opts.activateCellOnDoubelclick &&
|
||||
!tree.$activeTd &&
|
||||
opts.cellFocus === "allow"
|
||||
) {
|
||||
// If in row-mode, activate new cell
|
||||
tree.activateCell($td);
|
||||
return false;
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
nodeRenderStatus: function (ctx) {
|
||||
// Set classes for current status
|
||||
var res,
|
||||
node = ctx.node,
|
||||
$tr = $(node.tr);
|
||||
|
||||
res = this._super(ctx);
|
||||
|
||||
if (node.parent) {
|
||||
$tr.attr("aria-level", node.getLevel())
|
||||
.attr("aria-setsize", node.parent.children.length)
|
||||
.attr("aria-posinset", node.getIndex() + 1);
|
||||
|
||||
// 2018-06-24: not required according to
|
||||
// https://github.com/w3c/aria-practices/issues/132#issuecomment-397698250
|
||||
// if ( $tr.is( ":hidden" ) ) {
|
||||
// $tr.attr( "aria-hidden", true );
|
||||
// } else {
|
||||
// $tr.removeAttr( "aria-hidden" );
|
||||
// }
|
||||
|
||||
// this.debug("nodeRenderStatus: " + this.$activeTd + ", " + $tr.attr("aria-expanded"));
|
||||
// In cell-mode, move aria-expanded attribute from TR to first child TD
|
||||
if (this.$activeTd && $tr.attr("aria-expanded") != null) {
|
||||
$tr.remove("aria-expanded");
|
||||
$tr.find("td")
|
||||
.eq(this.nodeColumnIdx)
|
||||
.attr("aria-expanded", node.isExpanded());
|
||||
} else {
|
||||
$tr.find("td")
|
||||
.eq(this.nodeColumnIdx)
|
||||
.removeAttr("aria-expanded");
|
||||
}
|
||||
}
|
||||
return res;
|
||||
},
|
||||
nodeSetActive: function (ctx, flag, callOpts) {
|
||||
var $td,
|
||||
node = ctx.node,
|
||||
tree = ctx.tree,
|
||||
$tr = $(node.tr);
|
||||
|
||||
flag = flag !== false;
|
||||
node.debug("nodeSetActive(" + flag + ")", callOpts);
|
||||
// Support custom `cell` option
|
||||
if (flag && callOpts && callOpts.cell != null) {
|
||||
// `cell` may be a col-index, <td>, or `$(td)`
|
||||
if (typeof callOpts.cell === "number") {
|
||||
$td = findTdAtColIdx($tr, callOpts.cell);
|
||||
} else {
|
||||
$td = $(callOpts.cell);
|
||||
}
|
||||
tree.activateCell($td);
|
||||
return;
|
||||
}
|
||||
// tree.debug( "nodeSetActive: activeNode " + this.activeNode );
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
nodeKeydown: function (ctx) {
|
||||
var handleKeys,
|
||||
inputType,
|
||||
res,
|
||||
$td,
|
||||
$embeddedCheckbox = null,
|
||||
tree = ctx.tree,
|
||||
node = ctx.node,
|
||||
treeOpts = ctx.options,
|
||||
opts = treeOpts.ariagrid,
|
||||
event = ctx.originalEvent,
|
||||
eventString = FT.eventToString(event),
|
||||
$target = $(event.target),
|
||||
$activeTd = this.$activeTd,
|
||||
$activeTr = $activeTd ? $activeTd.closest("tr") : null,
|
||||
colIdx = $activeTd ? getColIdx($activeTr, $activeTd) : -1,
|
||||
forceNav =
|
||||
$activeTd &&
|
||||
tree.forceNavMode &&
|
||||
$.inArray(eventString, NAV_KEYS) >= 0;
|
||||
|
||||
if (opts.cellFocus === "off") {
|
||||
return this._superApply(arguments);
|
||||
}
|
||||
|
||||
if ($target.is(":input:enabled")) {
|
||||
inputType = $target.prop("type");
|
||||
} else if ($target.is("a")) {
|
||||
inputType = "link";
|
||||
}
|
||||
if ($activeTd && $activeTd.find(":checkbox:enabled").length === 1) {
|
||||
$embeddedCheckbox = $activeTd.find(":checkbox:enabled");
|
||||
inputType = "checkbox";
|
||||
}
|
||||
tree.debug(
|
||||
"nodeKeydown(" +
|
||||
eventString +
|
||||
"), activeTd: '" +
|
||||
($activeTd && $activeTd.text()) +
|
||||
"', inputType: " +
|
||||
inputType
|
||||
);
|
||||
|
||||
if (inputType && eventString !== "esc" && !forceNav) {
|
||||
handleKeys = INPUT_KEYS[inputType];
|
||||
if (handleKeys && $.inArray(eventString, handleKeys) >= 0) {
|
||||
return; // Let input control handle the key
|
||||
}
|
||||
}
|
||||
|
||||
switch (eventString) {
|
||||
case "right":
|
||||
if ($activeTd) {
|
||||
// Cell mode: move to neighbour (stop on right border)
|
||||
$td = findNeighbourTd(tree, $activeTd, eventString);
|
||||
if ($td) {
|
||||
tree.activateCell($td);
|
||||
}
|
||||
} else if (
|
||||
node &&
|
||||
!node.isExpanded() &&
|
||||
node.hasChildren() !== false
|
||||
) {
|
||||
// Row mode and current node can be expanded:
|
||||
// default handling will expand.
|
||||
break;
|
||||
} else {
|
||||
// Row mode: switch to cell-mode
|
||||
$td = $(node.tr).find(">td").first();
|
||||
tree.activateCell($td);
|
||||
}
|
||||
return false; // no default handling
|
||||
|
||||
case "left":
|
||||
case "home":
|
||||
case "end":
|
||||
case "ctrl+home":
|
||||
case "ctrl+end":
|
||||
case "up":
|
||||
case "down":
|
||||
if ($activeTd) {
|
||||
// Cell mode: move to neighbour
|
||||
$td = findNeighbourTd(tree, $activeTd, eventString);
|
||||
// Note: $td may be null if we move outside bounds. In this case
|
||||
// we switch back to row-mode (i.e. call activateCell(null) ).
|
||||
if (!$td && "left right".indexOf(eventString) < 0) {
|
||||
// Only switch to row-mode if left/right hits the bounds
|
||||
return false;
|
||||
}
|
||||
if ($td || opts.cellFocus !== "force") {
|
||||
tree.activateCell($td);
|
||||
}
|
||||
return false;
|
||||
}
|
||||
break;
|
||||
|
||||
case "esc":
|
||||
if ($activeTd && !tree.forceNavMode) {
|
||||
// Switch from cell-edit-mode to cell-nav-mode
|
||||
// $target.closest( "td" ).focus();
|
||||
tree.forceNavMode = true;
|
||||
tree.debug("Enter cell-nav-mode");
|
||||
tree.$container.toggleClass(
|
||||
clsFancytreeCellNavMode,
|
||||
!!tree.forceNavMode
|
||||
);
|
||||
return false;
|
||||
} else if ($activeTd && opts.cellFocus !== "force") {
|
||||
// Switch back from cell-mode to row-mode
|
||||
tree.activateCell(null);
|
||||
return false;
|
||||
}
|
||||
// tree.$container.toggleClass( clsFancytreeCellNavMode, !!tree.forceNavMode );
|
||||
break;
|
||||
|
||||
case "return":
|
||||
// Let user override the default action.
|
||||
// This event is triggered in row-mode and cell-mode
|
||||
res = tree._triggerNodeEvent(
|
||||
"defaultGridAction",
|
||||
node,
|
||||
event,
|
||||
{
|
||||
activeTd: tree.$activeTd ? tree.$activeTd[0] : null,
|
||||
colIdx: colIdx,
|
||||
mode: getGridNavMode(tree),
|
||||
}
|
||||
);
|
||||
if (res === false) {
|
||||
return false;
|
||||
}
|
||||
// Implement default actions (for cell-mode only).
|
||||
if ($activeTd) {
|
||||
// Apply 'default action' for embedded cell control
|
||||
if (colIdx === this.nodeColumnIdx) {
|
||||
node.toggleExpanded();
|
||||
} else if (colIdx === this.checkboxColumnIdx) {
|
||||
// TODO: only in checkbox mode!
|
||||
node.toggleSelected();
|
||||
} else if ($embeddedCheckbox) {
|
||||
// Embedded checkboxes are always toggled (ignoring `autoFocusInput`)
|
||||
$embeddedCheckbox.prop(
|
||||
"checked",
|
||||
!$embeddedCheckbox.prop("checked")
|
||||
);
|
||||
} else if (tree.forceNavMode && $target.is(":input")) {
|
||||
tree.forceNavMode = false;
|
||||
tree.$container.removeClass(
|
||||
clsFancytreeCellNavMode
|
||||
);
|
||||
tree.debug("enable cell-edit-mode");
|
||||
} else if ($activeTd.find("a").length === 1) {
|
||||
activateEmbeddedLink($activeTd);
|
||||
}
|
||||
} else {
|
||||
// ENTER in row-mode: Switch from row-mode to cell-mode
|
||||
// TODO: it was also suggested to expand/collapse instead
|
||||
// https://github.com/w3c/aria-practices/issues/132#issuecomment-407634891
|
||||
$td = $(node.tr).find(">td").nth(this.nodeColumnIdx);
|
||||
tree.activateCell($td);
|
||||
}
|
||||
return false; // no default handling
|
||||
|
||||
case "space":
|
||||
if ($activeTd) {
|
||||
if (colIdx === this.checkboxColumnIdx) {
|
||||
node.toggleSelected();
|
||||
} else if ($embeddedCheckbox) {
|
||||
$embeddedCheckbox.prop(
|
||||
"checked",
|
||||
!$embeddedCheckbox.prop("checked")
|
||||
);
|
||||
}
|
||||
return false; // no default handling
|
||||
}
|
||||
break;
|
||||
|
||||
default:
|
||||
// Allow to focus input by typing alphanum keys
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
treeSetOption: function (ctx, key, value) {
|
||||
var tree = ctx.tree,
|
||||
opts = tree.options.ariagrid;
|
||||
|
||||
if (key === "ariagrid") {
|
||||
// User called `$().fancytree("option", "ariagrid.SUBKEY", VALUE)`
|
||||
if (value.cellFocus !== opts.cellFocus) {
|
||||
if ($.inArray(value.cellFocus, VALID_MODES) < 0) {
|
||||
$.error("Invalid `cellFocus` option");
|
||||
}
|
||||
// TODO: fix current focus and mode
|
||||
}
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,241 @@
|
|||
// Extending Fancytree
|
||||
// ===================
|
||||
//
|
||||
// See also the [live demo](https://wwWendt.de/tech/fancytree/demo/sample-ext-childcounter.html) of this code.
|
||||
//
|
||||
// Every extension should have a comment header containing some information
|
||||
// about the author, copyright and licensing. Also a pointer to the latest
|
||||
// source code.
|
||||
// Prefix with `/*!` so the comment is not removed by the minifier.
|
||||
|
||||
/*!
|
||||
* jquery.fancytree.childcounter.js
|
||||
*
|
||||
* Add a child counter bubble to tree nodes.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
// To keep the global namespace clean, we wrap everything in a closure.
|
||||
// The UMD wrapper pattern defines the dependencies on jQuery and the
|
||||
// Fancytree core module, and makes sure that we can use the `require()`
|
||||
// syntax with package loaders.
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
// Consider to use [strict mode](http://ejohn.org/blog/ecmascript-5-strict-mode-json-and-more/)
|
||||
"use strict";
|
||||
|
||||
// The [coding guidelines](http://contribute.jquery.org/style-guide/js/)
|
||||
// require jshint /eslint compliance.
|
||||
// But for this sample, we want to allow unused variables for demonstration purpose.
|
||||
|
||||
/*eslint-disable no-unused-vars */
|
||||
|
||||
// Adding methods
|
||||
// --------------
|
||||
|
||||
// New member functions can be added to the `Fancytree` class.
|
||||
// This function will be available for every tree instance:
|
||||
//
|
||||
// var tree = $.ui.fancytree.getTree("#tree");
|
||||
// tree.countSelected(false);
|
||||
|
||||
$.ui.fancytree._FancytreeClass.prototype.countSelected = function (
|
||||
topOnly
|
||||
) {
|
||||
var tree = this,
|
||||
treeOptions = tree.options;
|
||||
|
||||
return tree.getSelectedNodes(topOnly).length;
|
||||
};
|
||||
|
||||
// The `FancytreeNode` class can also be easily extended. This would be called
|
||||
// like
|
||||
// node.updateCounters();
|
||||
//
|
||||
// It is also good practice to add a docstring comment.
|
||||
/**
|
||||
* [ext-childcounter] Update counter badges for `node` and its parents.
|
||||
* May be called in the `loadChildren` event, to update parents of lazy loaded
|
||||
* nodes.
|
||||
* @alias FancytreeNode#updateCounters
|
||||
* @requires jquery.fancytree.childcounters.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeNodeClass.prototype.updateCounters = function () {
|
||||
var node = this,
|
||||
$badge = $("span.fancytree-childcounter", node.span),
|
||||
extOpts = node.tree.options.childcounter,
|
||||
count = node.countChildren(extOpts.deep);
|
||||
|
||||
node.data.childCounter = count;
|
||||
if (
|
||||
(count || !extOpts.hideZeros) &&
|
||||
(!node.isExpanded() || !extOpts.hideExpanded)
|
||||
) {
|
||||
if (!$badge.length) {
|
||||
$badge = $("<span class='fancytree-childcounter'/>").appendTo(
|
||||
$(
|
||||
"span.fancytree-icon,span.fancytree-custom-icon",
|
||||
node.span
|
||||
)
|
||||
);
|
||||
}
|
||||
$badge.text(count);
|
||||
} else {
|
||||
$badge.remove();
|
||||
}
|
||||
if (extOpts.deep && !node.isTopLevel() && !node.isRootNode()) {
|
||||
node.parent.updateCounters();
|
||||
}
|
||||
};
|
||||
|
||||
// Finally, we can extend the widget API and create functions that are called
|
||||
// like so:
|
||||
//
|
||||
// $("#tree").fancytree("widgetMethod1", "abc");
|
||||
|
||||
$.ui.fancytree.prototype.widgetMethod1 = function (arg1) {
|
||||
var tree = this.tree;
|
||||
return arg1;
|
||||
};
|
||||
|
||||
// Register a Fancytree extension
|
||||
// ------------------------------
|
||||
// A full blown extension, extension is available for all trees and can be
|
||||
// enabled like so (see also the [live demo](https://wwWendt.de/tech/fancytree/demo/sample-ext-childcounter.html)):
|
||||
//
|
||||
// <script src="../src/jquery.fancytree.js"></script>
|
||||
// <script src="../src/jquery.fancytree.childcounter.js"></script>
|
||||
// ...
|
||||
//
|
||||
// $("#tree").fancytree({
|
||||
// extensions: ["childcounter"],
|
||||
// childcounter: {
|
||||
// hideExpanded: true
|
||||
// },
|
||||
// ...
|
||||
// });
|
||||
//
|
||||
|
||||
/* 'childcounter' extension */
|
||||
$.ui.fancytree.registerExtension({
|
||||
// Every extension must be registered by a unique name.
|
||||
name: "childcounter",
|
||||
// Version information should be compliant with [semver](http://semver.org)
|
||||
version: "2.38.3",
|
||||
|
||||
// Extension specific options and their defaults.
|
||||
// This options will be available as `tree.options.childcounter.hideExpanded`
|
||||
|
||||
options: {
|
||||
deep: true,
|
||||
hideZeros: true,
|
||||
hideExpanded: false,
|
||||
},
|
||||
|
||||
// Attributes other than `options` (or functions) can be defined here, and
|
||||
// will be added to the tree.ext.EXTNAME namespace, in this case `tree.ext.childcounter.foo`.
|
||||
// They can also be accessed as `this._local.foo` from within the extension
|
||||
// methods.
|
||||
foo: 42,
|
||||
|
||||
// Local functions are prefixed with an underscore '_'.
|
||||
// Callable as `this._local._appendCounter()`.
|
||||
|
||||
_appendCounter: function (bar) {
|
||||
var tree = this;
|
||||
},
|
||||
|
||||
// **Override virtual methods for this extension.**
|
||||
//
|
||||
// Fancytree implements a number of 'hook methods', prefixed by 'node...' or 'tree...'.
|
||||
// with a `ctx` argument (see [EventData](https://wwWendt.de/tech/fancytree/doc/jsdoc/global.html#EventData)
|
||||
// for details) and an extended calling context:<br>
|
||||
// `this` : the Fancytree instance<br>
|
||||
// `this._local`: the namespace that contains extension attributes and private methods (same as this.ext.EXTNAME)<br>
|
||||
// `this._super`: the virtual function that was overridden (member of previous extension or Fancytree)
|
||||
//
|
||||
// See also the [complete list of available hook functions](https://wwWendt.de/tech/fancytree/doc/jsdoc/Fancytree_Hooks.html).
|
||||
|
||||
/* Init */
|
||||
// `treeInit` is triggered when a tree is initalized. We can set up classes or
|
||||
// bind event handlers here...
|
||||
treeInit: function (ctx) {
|
||||
var tree = this, // same as ctx.tree,
|
||||
opts = ctx.options,
|
||||
extOpts = ctx.options.childcounter;
|
||||
// Optionally check for dependencies with other extensions
|
||||
/* this._requireExtension("glyph", false, false); */
|
||||
// Call the base implementation
|
||||
this._superApply(arguments);
|
||||
// Add a class to the tree container
|
||||
this.$container.addClass("fancytree-ext-childcounter");
|
||||
},
|
||||
|
||||
// Destroy this tree instance (we only call the default implementation, so
|
||||
// this method could as well be omitted).
|
||||
|
||||
treeDestroy: function (ctx) {
|
||||
this._superApply(arguments);
|
||||
},
|
||||
|
||||
// Overload the `renderTitle` hook, to append a counter badge
|
||||
nodeRenderTitle: function (ctx, title) {
|
||||
var node = ctx.node,
|
||||
extOpts = ctx.options.childcounter,
|
||||
count =
|
||||
node.data.childCounter == null
|
||||
? node.countChildren(extOpts.deep)
|
||||
: +node.data.childCounter;
|
||||
// Let the base implementation render the title
|
||||
// We use `_super()` instead of `_superApply()` here, since it is a little bit
|
||||
// more performant when called often
|
||||
this._super(ctx, title);
|
||||
// Append a counter badge
|
||||
if (
|
||||
(count || !extOpts.hideZeros) &&
|
||||
(!node.isExpanded() || !extOpts.hideExpanded)
|
||||
) {
|
||||
$(
|
||||
"span.fancytree-icon,span.fancytree-custom-icon",
|
||||
node.span
|
||||
).append(
|
||||
$("<span class='fancytree-childcounter'/>").text(count)
|
||||
);
|
||||
}
|
||||
},
|
||||
// Overload the `setExpanded` hook, so the counters are updated
|
||||
nodeSetExpanded: function (ctx, flag, callOpts) {
|
||||
var tree = ctx.tree,
|
||||
node = ctx.node;
|
||||
// Let the base implementation expand/collapse the node, then redraw the title
|
||||
// after the animation has finished
|
||||
return this._superApply(arguments).always(function () {
|
||||
tree.nodeRenderTitle(ctx);
|
||||
});
|
||||
},
|
||||
|
||||
// End of extension definition
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,514 @@
|
|||
/*!
|
||||
*
|
||||
* jquery.fancytree.clones.js
|
||||
* Support faster lookup of nodes by key and shared ref-ids.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/*******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
|
||||
var _assert = $.ui.fancytree.assert;
|
||||
|
||||
/* Return first occurrence of member from array. */
|
||||
function _removeArrayMember(arr, elem) {
|
||||
// TODO: use Array.indexOf for IE >= 9
|
||||
var i;
|
||||
for (i = arr.length - 1; i >= 0; i--) {
|
||||
if (arr[i] === elem) {
|
||||
arr.splice(i, 1);
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* JS Implementation of MurmurHash3 (r136) (as of May 20, 2011)
|
||||
*
|
||||
* @author <a href="mailto:gary.court@gmail.com">Gary Court</a>
|
||||
* @see http://github.com/garycourt/murmurhash-js
|
||||
* @author <a href="mailto:aappleby@gmail.com">Austin Appleby</a>
|
||||
* @see http://sites.google.com/site/murmurhash/
|
||||
*
|
||||
* @param {string} key ASCII only
|
||||
* @param {boolean} [asString=false]
|
||||
* @param {number} seed Positive integer only
|
||||
* @return {number} 32-bit positive integer hash
|
||||
*/
|
||||
function hashMurmur3(key, asString, seed) {
|
||||
/*eslint-disable no-bitwise */
|
||||
var h1b,
|
||||
k1,
|
||||
remainder = key.length & 3,
|
||||
bytes = key.length - remainder,
|
||||
h1 = seed,
|
||||
c1 = 0xcc9e2d51,
|
||||
c2 = 0x1b873593,
|
||||
i = 0;
|
||||
|
||||
while (i < bytes) {
|
||||
k1 =
|
||||
(key.charCodeAt(i) & 0xff) |
|
||||
((key.charCodeAt(++i) & 0xff) << 8) |
|
||||
((key.charCodeAt(++i) & 0xff) << 16) |
|
||||
((key.charCodeAt(++i) & 0xff) << 24);
|
||||
++i;
|
||||
|
||||
k1 =
|
||||
((k1 & 0xffff) * c1 + ((((k1 >>> 16) * c1) & 0xffff) << 16)) &
|
||||
0xffffffff;
|
||||
k1 = (k1 << 15) | (k1 >>> 17);
|
||||
k1 =
|
||||
((k1 & 0xffff) * c2 + ((((k1 >>> 16) * c2) & 0xffff) << 16)) &
|
||||
0xffffffff;
|
||||
|
||||
h1 ^= k1;
|
||||
h1 = (h1 << 13) | (h1 >>> 19);
|
||||
h1b =
|
||||
((h1 & 0xffff) * 5 + ((((h1 >>> 16) * 5) & 0xffff) << 16)) &
|
||||
0xffffffff;
|
||||
h1 =
|
||||
(h1b & 0xffff) +
|
||||
0x6b64 +
|
||||
((((h1b >>> 16) + 0xe654) & 0xffff) << 16);
|
||||
}
|
||||
|
||||
k1 = 0;
|
||||
|
||||
switch (remainder) {
|
||||
case 3:
|
||||
k1 ^= (key.charCodeAt(i + 2) & 0xff) << 16;
|
||||
// fall through
|
||||
case 2:
|
||||
k1 ^= (key.charCodeAt(i + 1) & 0xff) << 8;
|
||||
// fall through
|
||||
case 1:
|
||||
k1 ^= key.charCodeAt(i) & 0xff;
|
||||
|
||||
k1 =
|
||||
((k1 & 0xffff) * c1 +
|
||||
((((k1 >>> 16) * c1) & 0xffff) << 16)) &
|
||||
0xffffffff;
|
||||
k1 = (k1 << 15) | (k1 >>> 17);
|
||||
k1 =
|
||||
((k1 & 0xffff) * c2 +
|
||||
((((k1 >>> 16) * c2) & 0xffff) << 16)) &
|
||||
0xffffffff;
|
||||
h1 ^= k1;
|
||||
}
|
||||
|
||||
h1 ^= key.length;
|
||||
|
||||
h1 ^= h1 >>> 16;
|
||||
h1 =
|
||||
((h1 & 0xffff) * 0x85ebca6b +
|
||||
((((h1 >>> 16) * 0x85ebca6b) & 0xffff) << 16)) &
|
||||
0xffffffff;
|
||||
h1 ^= h1 >>> 13;
|
||||
h1 =
|
||||
((h1 & 0xffff) * 0xc2b2ae35 +
|
||||
((((h1 >>> 16) * 0xc2b2ae35) & 0xffff) << 16)) &
|
||||
0xffffffff;
|
||||
h1 ^= h1 >>> 16;
|
||||
|
||||
if (asString) {
|
||||
// Convert to 8 digit hex string
|
||||
return ("0000000" + (h1 >>> 0).toString(16)).substr(-8);
|
||||
}
|
||||
return h1 >>> 0;
|
||||
/*eslint-enable no-bitwise */
|
||||
}
|
||||
|
||||
/*
|
||||
* Return a unique key for node by calculating the hash of the parents refKey-list.
|
||||
*/
|
||||
function calcUniqueKey(node) {
|
||||
var key,
|
||||
h1,
|
||||
path = $.map(node.getParentList(false, true), function (e) {
|
||||
return e.refKey || e.key;
|
||||
});
|
||||
|
||||
path = path.join("/");
|
||||
// 32-bit has a high probability of collisions, so we pump up to 64-bit
|
||||
// https://security.stackexchange.com/q/209882/207588
|
||||
|
||||
h1 = hashMurmur3(path, true);
|
||||
key = "id_" + h1 + hashMurmur3(h1 + path, true);
|
||||
|
||||
return key;
|
||||
}
|
||||
|
||||
/**
|
||||
* [ext-clones] Return a list of clone-nodes (i.e. same refKey) or null.
|
||||
* @param {boolean} [includeSelf=false]
|
||||
* @returns {FancytreeNode[] | null}
|
||||
*
|
||||
* @alias FancytreeNode#getCloneList
|
||||
* @requires jquery.fancytree.clones.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeNodeClass.prototype.getCloneList = function (
|
||||
includeSelf
|
||||
) {
|
||||
var key,
|
||||
tree = this.tree,
|
||||
refList = tree.refMap[this.refKey] || null,
|
||||
keyMap = tree.keyMap;
|
||||
|
||||
if (refList) {
|
||||
key = this.key;
|
||||
// Convert key list to node list
|
||||
if (includeSelf) {
|
||||
refList = $.map(refList, function (val) {
|
||||
return keyMap[val];
|
||||
});
|
||||
} else {
|
||||
refList = $.map(refList, function (val) {
|
||||
return val === key ? null : keyMap[val];
|
||||
});
|
||||
if (refList.length < 1) {
|
||||
refList = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
return refList;
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-clones] Return true if this node has at least another clone with same refKey.
|
||||
* @returns {boolean}
|
||||
*
|
||||
* @alias FancytreeNode#isClone
|
||||
* @requires jquery.fancytree.clones.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeNodeClass.prototype.isClone = function () {
|
||||
var refKey = this.refKey || null,
|
||||
refList = (refKey && this.tree.refMap[refKey]) || null;
|
||||
return !!(refList && refList.length > 1);
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-clones] Update key and/or refKey for an existing node.
|
||||
* @param {string} key
|
||||
* @param {string} refKey
|
||||
* @returns {boolean}
|
||||
*
|
||||
* @alias FancytreeNode#reRegister
|
||||
* @requires jquery.fancytree.clones.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeNodeClass.prototype.reRegister = function (
|
||||
key,
|
||||
refKey
|
||||
) {
|
||||
key = key == null ? null : "" + key;
|
||||
refKey = refKey == null ? null : "" + refKey;
|
||||
// this.debug("reRegister", key, refKey);
|
||||
|
||||
var tree = this.tree,
|
||||
prevKey = this.key,
|
||||
prevRefKey = this.refKey,
|
||||
keyMap = tree.keyMap,
|
||||
refMap = tree.refMap,
|
||||
refList = refMap[prevRefKey] || null,
|
||||
// curCloneKeys = refList ? node.getCloneList(true),
|
||||
modified = false;
|
||||
|
||||
// Key has changed: update all references
|
||||
if (key != null && key !== this.key) {
|
||||
if (keyMap[key]) {
|
||||
$.error(
|
||||
"[ext-clones] reRegister(" +
|
||||
key +
|
||||
"): already exists: " +
|
||||
this
|
||||
);
|
||||
}
|
||||
// Update keyMap
|
||||
delete keyMap[prevKey];
|
||||
keyMap[key] = this;
|
||||
// Update refMap
|
||||
if (refList) {
|
||||
refMap[prevRefKey] = $.map(refList, function (e) {
|
||||
return e === prevKey ? key : e;
|
||||
});
|
||||
}
|
||||
this.key = key;
|
||||
modified = true;
|
||||
}
|
||||
|
||||
// refKey has changed
|
||||
if (refKey != null && refKey !== this.refKey) {
|
||||
// Remove previous refKeys
|
||||
if (refList) {
|
||||
if (refList.length === 1) {
|
||||
delete refMap[prevRefKey];
|
||||
} else {
|
||||
refMap[prevRefKey] = $.map(refList, function (e) {
|
||||
return e === prevKey ? null : e;
|
||||
});
|
||||
}
|
||||
}
|
||||
// Add refKey
|
||||
if (refMap[refKey]) {
|
||||
refMap[refKey].append(key);
|
||||
} else {
|
||||
refMap[refKey] = [this.key];
|
||||
}
|
||||
this.refKey = refKey;
|
||||
modified = true;
|
||||
}
|
||||
return modified;
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-clones] Define a refKey for an existing node.
|
||||
* @param {string} refKey
|
||||
* @returns {boolean}
|
||||
*
|
||||
* @alias FancytreeNode#setRefKey
|
||||
* @requires jquery.fancytree.clones.js
|
||||
* @since 2.16
|
||||
*/
|
||||
$.ui.fancytree._FancytreeNodeClass.prototype.setRefKey = function (refKey) {
|
||||
return this.reRegister(null, refKey);
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-clones] Return all nodes with a given refKey (null if not found).
|
||||
* @param {string} refKey
|
||||
* @param {FancytreeNode} [rootNode] optionally restrict results to descendants of this node
|
||||
* @returns {FancytreeNode[] | null}
|
||||
* @alias Fancytree#getNodesByRef
|
||||
* @requires jquery.fancytree.clones.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeClass.prototype.getNodesByRef = function (
|
||||
refKey,
|
||||
rootNode
|
||||
) {
|
||||
var keyMap = this.keyMap,
|
||||
refList = this.refMap[refKey] || null;
|
||||
|
||||
if (refList) {
|
||||
// Convert key list to node list
|
||||
if (rootNode) {
|
||||
refList = $.map(refList, function (val) {
|
||||
var node = keyMap[val];
|
||||
return node.isDescendantOf(rootNode) ? node : null;
|
||||
});
|
||||
} else {
|
||||
refList = $.map(refList, function (val) {
|
||||
return keyMap[val];
|
||||
});
|
||||
}
|
||||
if (refList.length < 1) {
|
||||
refList = null;
|
||||
}
|
||||
}
|
||||
return refList;
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-clones] Replace a refKey with a new one.
|
||||
* @param {string} oldRefKey
|
||||
* @param {string} newRefKey
|
||||
* @alias Fancytree#changeRefKey
|
||||
* @requires jquery.fancytree.clones.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeClass.prototype.changeRefKey = function (
|
||||
oldRefKey,
|
||||
newRefKey
|
||||
) {
|
||||
var i,
|
||||
node,
|
||||
keyMap = this.keyMap,
|
||||
refList = this.refMap[oldRefKey] || null;
|
||||
|
||||
if (refList) {
|
||||
for (i = 0; i < refList.length; i++) {
|
||||
node = keyMap[refList[i]];
|
||||
node.refKey = newRefKey;
|
||||
}
|
||||
delete this.refMap[oldRefKey];
|
||||
this.refMap[newRefKey] = refList;
|
||||
}
|
||||
};
|
||||
|
||||
/*******************************************************************************
|
||||
* Extension code
|
||||
*/
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "clones",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
highlightActiveClones: true, // set 'fancytree-active-clone' on active clones and all peers
|
||||
highlightClones: false, // set 'fancytree-clone' class on any node that has at least one clone
|
||||
},
|
||||
|
||||
treeCreate: function (ctx) {
|
||||
this._superApply(arguments);
|
||||
ctx.tree.refMap = {};
|
||||
ctx.tree.keyMap = {};
|
||||
},
|
||||
treeInit: function (ctx) {
|
||||
this.$container.addClass("fancytree-ext-clones");
|
||||
_assert(ctx.options.defaultKey == null);
|
||||
// Generate unique / reproducible default keys
|
||||
ctx.options.defaultKey = function (node) {
|
||||
return calcUniqueKey(node);
|
||||
};
|
||||
// The default implementation loads initial data
|
||||
this._superApply(arguments);
|
||||
},
|
||||
treeClear: function (ctx) {
|
||||
ctx.tree.refMap = {};
|
||||
ctx.tree.keyMap = {};
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
treeRegisterNode: function (ctx, add, node) {
|
||||
var refList,
|
||||
len,
|
||||
tree = ctx.tree,
|
||||
keyMap = tree.keyMap,
|
||||
refMap = tree.refMap,
|
||||
key = node.key,
|
||||
refKey = node && node.refKey != null ? "" + node.refKey : null;
|
||||
|
||||
// ctx.tree.debug("clones.treeRegisterNode", add, node);
|
||||
|
||||
if (node.isStatusNode()) {
|
||||
return this._super(ctx, add, node);
|
||||
}
|
||||
|
||||
if (add) {
|
||||
if (keyMap[node.key] != null) {
|
||||
var other = keyMap[node.key],
|
||||
msg =
|
||||
"clones.treeRegisterNode: duplicate key '" +
|
||||
node.key +
|
||||
"': /" +
|
||||
node.getPath(true) +
|
||||
" => " +
|
||||
other.getPath(true);
|
||||
// Sometimes this exception is not visible in the console,
|
||||
// so we also write it:
|
||||
tree.error(msg);
|
||||
$.error(msg);
|
||||
}
|
||||
keyMap[key] = node;
|
||||
|
||||
if (refKey) {
|
||||
refList = refMap[refKey];
|
||||
if (refList) {
|
||||
refList.push(key);
|
||||
if (
|
||||
refList.length === 2 &&
|
||||
ctx.options.clones.highlightClones
|
||||
) {
|
||||
// Mark peer node, if it just became a clone (no need to
|
||||
// mark current node, since it will be rendered later anyway)
|
||||
keyMap[refList[0]].renderStatus();
|
||||
}
|
||||
} else {
|
||||
refMap[refKey] = [key];
|
||||
}
|
||||
// node.debug("clones.treeRegisterNode: add clone =>", refMap[refKey]);
|
||||
}
|
||||
} else {
|
||||
if (keyMap[key] == null) {
|
||||
$.error(
|
||||
"clones.treeRegisterNode: node.key not registered: " +
|
||||
node.key
|
||||
);
|
||||
}
|
||||
delete keyMap[key];
|
||||
if (refKey) {
|
||||
refList = refMap[refKey];
|
||||
// node.debug("clones.treeRegisterNode: remove clone BEFORE =>", refMap[refKey]);
|
||||
if (refList) {
|
||||
len = refList.length;
|
||||
if (len <= 1) {
|
||||
_assert(len === 1);
|
||||
_assert(refList[0] === key);
|
||||
delete refMap[refKey];
|
||||
} else {
|
||||
_removeArrayMember(refList, key);
|
||||
// Unmark peer node, if this was the only clone
|
||||
if (
|
||||
len === 2 &&
|
||||
ctx.options.clones.highlightClones
|
||||
) {
|
||||
// node.debug("clones.treeRegisterNode: last =>", node.getCloneList());
|
||||
keyMap[refList[0]].renderStatus();
|
||||
}
|
||||
}
|
||||
// node.debug("clones.treeRegisterNode: remove clone =>", refMap[refKey]);
|
||||
}
|
||||
}
|
||||
}
|
||||
return this._super(ctx, add, node);
|
||||
},
|
||||
nodeRenderStatus: function (ctx) {
|
||||
var $span,
|
||||
res,
|
||||
node = ctx.node;
|
||||
|
||||
res = this._super(ctx);
|
||||
|
||||
if (ctx.options.clones.highlightClones) {
|
||||
$span = $(node[ctx.tree.statusClassPropName]);
|
||||
// Only if span already exists
|
||||
if ($span.length && node.isClone()) {
|
||||
// node.debug("clones.nodeRenderStatus: ", ctx.options.clones.highlightClones);
|
||||
$span.addClass("fancytree-clone");
|
||||
}
|
||||
}
|
||||
return res;
|
||||
},
|
||||
nodeSetActive: function (ctx, flag, callOpts) {
|
||||
var res,
|
||||
scpn = ctx.tree.statusClassPropName,
|
||||
node = ctx.node;
|
||||
|
||||
res = this._superApply(arguments);
|
||||
|
||||
if (ctx.options.clones.highlightActiveClones && node.isClone()) {
|
||||
$.each(node.getCloneList(true), function (idx, n) {
|
||||
// n.debug("clones.nodeSetActive: ", flag !== false);
|
||||
$(n[scpn]).toggleClass(
|
||||
"fancytree-active-clone",
|
||||
flag !== false
|
||||
);
|
||||
});
|
||||
}
|
||||
return res;
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,205 @@
|
|||
/*!
|
||||
* jquery.fancytree.columnview.js
|
||||
*
|
||||
* Render tree like a Mac Finder's column view.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/*******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
var _assert = $.ui.fancytree.assert,
|
||||
FT = $.ui.fancytree;
|
||||
|
||||
/*******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "columnview",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {},
|
||||
// Overide virtual methods for this extension.
|
||||
// `this` : is this extension object
|
||||
// `this._base` : the Fancytree instance
|
||||
// `this._super`: the virtual function that was overriden (member of prev. extension or Fancytree)
|
||||
treeInit: function (ctx) {
|
||||
var $tdFirst,
|
||||
$ul,
|
||||
tree = ctx.tree,
|
||||
$table = tree.widget.element;
|
||||
|
||||
tree.tr = $("tbody tr", $table)[0];
|
||||
tree.$tdList = $(">td", tree.tr);
|
||||
tree.columnCount = tree.$tdList.length;
|
||||
// Perform default behavior
|
||||
this._superApply(arguments);
|
||||
// Standard Fancytree created a root <ul>. Now move this into first table cell
|
||||
$ul = $(tree.rootNode.ul);
|
||||
$tdFirst = tree.$tdList.eq(0);
|
||||
|
||||
_assert(
|
||||
$.inArray("table", this.options.extensions) < 0,
|
||||
"columnview extensions must not use ext-table"
|
||||
);
|
||||
_assert(
|
||||
tree.columnCount >= 2,
|
||||
"columnview target must be a table with at least two columns"
|
||||
);
|
||||
|
||||
$ul.removeClass("fancytree-container").removeAttr("tabindex");
|
||||
tree.$container = $table;
|
||||
$table
|
||||
.addClass("fancytree-container fancytree-ext-columnview")
|
||||
.attr("tabindex", "0");
|
||||
|
||||
$tdFirst.empty();
|
||||
$ul.detach().appendTo($tdFirst);
|
||||
|
||||
// Force some required options
|
||||
tree.widget.options.autoCollapse = true;
|
||||
// tree.widget.options.autoActivate = true;
|
||||
tree.widget.options.toggleEffect = false;
|
||||
tree.widget.options.clickFolderMode = 1;
|
||||
|
||||
$table
|
||||
// Make sure that only active path is expanded when a node is activated:
|
||||
.on("fancytreeactivate", function (event, data) {
|
||||
var node = data.node,
|
||||
tree = data.tree,
|
||||
level = node.getLevel();
|
||||
|
||||
tree._callHook("nodeCollapseSiblings", node);
|
||||
// Clear right neighbours
|
||||
if (!node.expanded) {
|
||||
tree.$tdList.eq(level).nextAll().empty();
|
||||
}
|
||||
// Expand nodes on activate, so we populate the right neighbor cell
|
||||
if (!node.expanded && (node.children || node.lazy)) {
|
||||
node.setExpanded();
|
||||
}
|
||||
})
|
||||
// Adjust keyboard behaviour:
|
||||
.on("fancytreekeydown", function (event, data) {
|
||||
var next = null,
|
||||
handled = true,
|
||||
node = data.node || data.tree.getFirstChild();
|
||||
|
||||
if (node.getLevel() >= tree.columnCount) {
|
||||
return;
|
||||
}
|
||||
switch (FT.eventToString(event)) {
|
||||
case "down":
|
||||
next = node.getNextSibling();
|
||||
break;
|
||||
case "left":
|
||||
if (!node.isTopLevel()) {
|
||||
next = node.getParent();
|
||||
}
|
||||
break;
|
||||
case "right":
|
||||
next = node.getFirstChild();
|
||||
if (!next) {
|
||||
// default processing: expand or ignore
|
||||
return;
|
||||
}
|
||||
// Prefer an expanded child if any
|
||||
next.visitSiblings(function (n) {
|
||||
if (n.expanded) {
|
||||
next = n;
|
||||
return false;
|
||||
}
|
||||
}, true);
|
||||
break;
|
||||
case "up":
|
||||
next = node.getPrevSibling();
|
||||
break;
|
||||
default:
|
||||
handled = false;
|
||||
}
|
||||
if (next) {
|
||||
next.setActive();
|
||||
}
|
||||
return !handled;
|
||||
});
|
||||
},
|
||||
nodeSetExpanded: function (ctx, flag, callOpts) {
|
||||
var $wait,
|
||||
node = ctx.node,
|
||||
tree = ctx.tree,
|
||||
level = node.getLevel();
|
||||
|
||||
if (flag !== false && !node.expanded && node.isUndefined()) {
|
||||
$wait = $(
|
||||
"<span class='fancytree-icon fancytree-icon-loading'>"
|
||||
);
|
||||
tree.$tdList.eq(level).empty().append($wait);
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
nodeRemoveChildren: function (ctx) {
|
||||
// #899: node's children removed: remove child marker...
|
||||
$(ctx.node.span).find("span.fancytree-cv-right").remove();
|
||||
// ...and clear right columns
|
||||
ctx.tree.$tdList.eq(ctx.node.getLevel()).nextAll().empty();
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
nodeRender: function (ctx, force, deep, collapsed, _recursive) {
|
||||
// Render standard nested <ul> - <li> hierarchy
|
||||
this._super(ctx, force, deep, collapsed, _recursive);
|
||||
// Remove expander and add a trailing triangle instead
|
||||
var level,
|
||||
$tdChild,
|
||||
$ul,
|
||||
tree = ctx.tree,
|
||||
node = ctx.node,
|
||||
$span = $(node.span);
|
||||
|
||||
$span.find("span.fancytree-expander").remove();
|
||||
if (
|
||||
node.hasChildren() !== false &&
|
||||
!$span.find("span.fancytree-cv-right").length
|
||||
) {
|
||||
$span.append(
|
||||
$("<span class='fancytree-icon fancytree-cv-right'>")
|
||||
);
|
||||
}
|
||||
// Move <ul> with children into the appropriate <td>
|
||||
if (node.ul && node.expanded) {
|
||||
node.ul.style.display = ""; // might be hidden if RIGHT was pressed
|
||||
level = node.getLevel();
|
||||
if (level < tree.columnCount) {
|
||||
// only if we are not in the last column
|
||||
$tdChild = tree.$tdList.eq(level);
|
||||
$ul = $(node.ul).detach();
|
||||
$tdChild.empty().append($ul);
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,798 @@
|
|||
/*!
|
||||
* jquery.fancytree.dnd.js
|
||||
*
|
||||
* Drag-and-drop support (jQuery UI draggable/droppable).
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define([
|
||||
"jquery",
|
||||
"jquery-ui/ui/widgets/draggable",
|
||||
"jquery-ui/ui/widgets/droppable",
|
||||
"./jquery.fancytree",
|
||||
], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
var didRegisterDnd = false,
|
||||
classDropAccept = "fancytree-drop-accept",
|
||||
classDropAfter = "fancytree-drop-after",
|
||||
classDropBefore = "fancytree-drop-before",
|
||||
classDropOver = "fancytree-drop-over",
|
||||
classDropReject = "fancytree-drop-reject",
|
||||
classDropTarget = "fancytree-drop-target";
|
||||
|
||||
/* Convert number to string and prepend +/-; return empty string for 0.*/
|
||||
function offsetString(n) {
|
||||
// eslint-disable-next-line no-nested-ternary
|
||||
return n === 0 ? "" : n > 0 ? "+" + n : "" + n;
|
||||
}
|
||||
|
||||
//--- Extend ui.draggable event handling --------------------------------------
|
||||
|
||||
function _registerDnd() {
|
||||
if (didRegisterDnd) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Register proxy-functions for draggable.start/drag/stop
|
||||
|
||||
$.ui.plugin.add("draggable", "connectToFancytree", {
|
||||
start: function (event, ui) {
|
||||
// 'draggable' was renamed to 'ui-draggable' since jQueryUI 1.10
|
||||
var draggable =
|
||||
$(this).data("ui-draggable") ||
|
||||
$(this).data("draggable"),
|
||||
sourceNode = ui.helper.data("ftSourceNode") || null;
|
||||
|
||||
if (sourceNode) {
|
||||
// Adjust helper offset, so cursor is slightly outside top/left corner
|
||||
draggable.offset.click.top = -2;
|
||||
draggable.offset.click.left = +16;
|
||||
// Trigger dragStart event
|
||||
// TODO: when called as connectTo..., the return value is ignored(?)
|
||||
return sourceNode.tree.ext.dnd._onDragEvent(
|
||||
"start",
|
||||
sourceNode,
|
||||
null,
|
||||
event,
|
||||
ui,
|
||||
draggable
|
||||
);
|
||||
}
|
||||
},
|
||||
drag: function (event, ui) {
|
||||
var ctx,
|
||||
isHelper,
|
||||
logObject,
|
||||
// 'draggable' was renamed to 'ui-draggable' since jQueryUI 1.10
|
||||
draggable =
|
||||
$(this).data("ui-draggable") ||
|
||||
$(this).data("draggable"),
|
||||
sourceNode = ui.helper.data("ftSourceNode") || null,
|
||||
prevTargetNode = ui.helper.data("ftTargetNode") || null,
|
||||
targetNode = $.ui.fancytree.getNode(event.target),
|
||||
dndOpts = sourceNode && sourceNode.tree.options.dnd;
|
||||
|
||||
// logObject = sourceNode || prevTargetNode || $.ui.fancytree;
|
||||
// logObject.debug("Drag event:", event, event.shiftKey);
|
||||
if (event.target && !targetNode) {
|
||||
// We got a drag event, but the targetNode could not be found
|
||||
// at the event location. This may happen,
|
||||
// 1. if the mouse jumped over the drag helper,
|
||||
// 2. or if a non-fancytree element is dragged
|
||||
// We ignore it:
|
||||
isHelper =
|
||||
$(event.target).closest(
|
||||
"div.fancytree-drag-helper,#fancytree-drop-marker"
|
||||
).length > 0;
|
||||
if (isHelper) {
|
||||
logObject =
|
||||
sourceNode || prevTargetNode || $.ui.fancytree;
|
||||
logObject.debug("Drag event over helper: ignored.");
|
||||
return;
|
||||
}
|
||||
}
|
||||
ui.helper.data("ftTargetNode", targetNode);
|
||||
|
||||
if (dndOpts && dndOpts.updateHelper) {
|
||||
ctx = sourceNode.tree._makeHookContext(sourceNode, event, {
|
||||
otherNode: targetNode,
|
||||
ui: ui,
|
||||
draggable: draggable,
|
||||
dropMarker: $("#fancytree-drop-marker"),
|
||||
});
|
||||
dndOpts.updateHelper.call(sourceNode.tree, sourceNode, ctx);
|
||||
}
|
||||
|
||||
// Leaving a tree node
|
||||
if (prevTargetNode && prevTargetNode !== targetNode) {
|
||||
prevTargetNode.tree.ext.dnd._onDragEvent(
|
||||
"leave",
|
||||
prevTargetNode,
|
||||
sourceNode,
|
||||
event,
|
||||
ui,
|
||||
draggable
|
||||
);
|
||||
}
|
||||
if (targetNode) {
|
||||
if (!targetNode.tree.options.dnd.dragDrop) {
|
||||
// not enabled as drop target
|
||||
} else if (targetNode === prevTargetNode) {
|
||||
// Moving over same node
|
||||
targetNode.tree.ext.dnd._onDragEvent(
|
||||
"over",
|
||||
targetNode,
|
||||
sourceNode,
|
||||
event,
|
||||
ui,
|
||||
draggable
|
||||
);
|
||||
} else {
|
||||
// Entering this node first time
|
||||
targetNode.tree.ext.dnd._onDragEvent(
|
||||
"enter",
|
||||
targetNode,
|
||||
sourceNode,
|
||||
event,
|
||||
ui,
|
||||
draggable
|
||||
);
|
||||
targetNode.tree.ext.dnd._onDragEvent(
|
||||
"over",
|
||||
targetNode,
|
||||
sourceNode,
|
||||
event,
|
||||
ui,
|
||||
draggable
|
||||
);
|
||||
}
|
||||
}
|
||||
// else go ahead with standard event handling
|
||||
},
|
||||
stop: function (event, ui) {
|
||||
var logObject,
|
||||
// 'draggable' was renamed to 'ui-draggable' since jQueryUI 1.10:
|
||||
draggable =
|
||||
$(this).data("ui-draggable") ||
|
||||
$(this).data("draggable"),
|
||||
sourceNode = ui.helper.data("ftSourceNode") || null,
|
||||
targetNode = ui.helper.data("ftTargetNode") || null,
|
||||
dropped = event.type === "mouseup" && event.which === 1;
|
||||
|
||||
if (!dropped) {
|
||||
logObject = sourceNode || targetNode || $.ui.fancytree;
|
||||
logObject.debug("Drag was cancelled");
|
||||
}
|
||||
if (targetNode) {
|
||||
if (dropped) {
|
||||
targetNode.tree.ext.dnd._onDragEvent(
|
||||
"drop",
|
||||
targetNode,
|
||||
sourceNode,
|
||||
event,
|
||||
ui,
|
||||
draggable
|
||||
);
|
||||
}
|
||||
targetNode.tree.ext.dnd._onDragEvent(
|
||||
"leave",
|
||||
targetNode,
|
||||
sourceNode,
|
||||
event,
|
||||
ui,
|
||||
draggable
|
||||
);
|
||||
}
|
||||
if (sourceNode) {
|
||||
sourceNode.tree.ext.dnd._onDragEvent(
|
||||
"stop",
|
||||
sourceNode,
|
||||
null,
|
||||
event,
|
||||
ui,
|
||||
draggable
|
||||
);
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
didRegisterDnd = true;
|
||||
}
|
||||
|
||||
/******************************************************************************
|
||||
* Drag and drop support
|
||||
*/
|
||||
function _initDragAndDrop(tree) {
|
||||
var dnd = tree.options.dnd || null,
|
||||
glyph = tree.options.glyph || null;
|
||||
|
||||
// Register 'connectToFancytree' option with ui.draggable
|
||||
if (dnd) {
|
||||
_registerDnd();
|
||||
}
|
||||
// Attach ui.draggable to this Fancytree instance
|
||||
if (dnd && dnd.dragStart) {
|
||||
tree.widget.element.draggable(
|
||||
$.extend(
|
||||
{
|
||||
addClasses: false,
|
||||
// DT issue 244: helper should be child of scrollParent:
|
||||
appendTo: tree.$container,
|
||||
// appendTo: "body",
|
||||
containment: false,
|
||||
// containment: "parent",
|
||||
delay: 0,
|
||||
distance: 4,
|
||||
revert: false,
|
||||
scroll: true, // to disable, also set css 'position: inherit' on ul.fancytree-container
|
||||
scrollSpeed: 7,
|
||||
scrollSensitivity: 10,
|
||||
// Delegate draggable.start, drag, and stop events to our handler
|
||||
connectToFancytree: true,
|
||||
// Let source tree create the helper element
|
||||
helper: function (event) {
|
||||
var $helper,
|
||||
$nodeTag,
|
||||
opts,
|
||||
sourceNode = $.ui.fancytree.getNode(
|
||||
event.target
|
||||
);
|
||||
|
||||
if (!sourceNode) {
|
||||
// #405, DT issue 211: might happen, if dragging a table *header*
|
||||
return "<div>ERROR?: helper requested but sourceNode not found</div>";
|
||||
}
|
||||
opts = sourceNode.tree.options.dnd;
|
||||
$nodeTag = $(sourceNode.span);
|
||||
// Only event and node argument is available
|
||||
$helper = $(
|
||||
"<div class='fancytree-drag-helper'><span class='fancytree-drag-helper-img' /></div>"
|
||||
)
|
||||
.css({ zIndex: 3, position: "relative" }) // so it appears above ext-wide selection bar
|
||||
.append(
|
||||
$nodeTag
|
||||
.find("span.fancytree-title")
|
||||
.clone()
|
||||
);
|
||||
|
||||
// Attach node reference to helper object
|
||||
$helper.data("ftSourceNode", sourceNode);
|
||||
|
||||
// Support glyph symbols instead of icons
|
||||
if (glyph) {
|
||||
$helper
|
||||
.find(".fancytree-drag-helper-img")
|
||||
.addClass(
|
||||
glyph.map._addClass +
|
||||
" " +
|
||||
glyph.map.dragHelper
|
||||
);
|
||||
}
|
||||
// Allow to modify the helper, e.g. to add multi-node-drag feedback
|
||||
if (opts.initHelper) {
|
||||
opts.initHelper.call(
|
||||
sourceNode.tree,
|
||||
sourceNode,
|
||||
{
|
||||
node: sourceNode,
|
||||
tree: sourceNode.tree,
|
||||
originalEvent: event,
|
||||
ui: { helper: $helper },
|
||||
}
|
||||
);
|
||||
}
|
||||
// We return an unconnected element, so `draggable` will add this
|
||||
// to the parent specified as `appendTo` option
|
||||
return $helper;
|
||||
},
|
||||
start: function (event, ui) {
|
||||
var sourceNode = ui.helper.data("ftSourceNode");
|
||||
return !!sourceNode; // Abort dragging if no node could be found
|
||||
},
|
||||
},
|
||||
tree.options.dnd.draggable
|
||||
)
|
||||
);
|
||||
}
|
||||
// Attach ui.droppable to this Fancytree instance
|
||||
if (dnd && dnd.dragDrop) {
|
||||
tree.widget.element.droppable(
|
||||
$.extend(
|
||||
{
|
||||
addClasses: false,
|
||||
tolerance: "intersect",
|
||||
greedy: false,
|
||||
/*
|
||||
activate: function(event, ui) {
|
||||
tree.debug("droppable - activate", event, ui, this);
|
||||
},
|
||||
create: function(event, ui) {
|
||||
tree.debug("droppable - create", event, ui);
|
||||
},
|
||||
deactivate: function(event, ui) {
|
||||
tree.debug("droppable - deactivate", event, ui);
|
||||
},
|
||||
drop: function(event, ui) {
|
||||
tree.debug("droppable - drop", event, ui);
|
||||
},
|
||||
out: function(event, ui) {
|
||||
tree.debug("droppable - out", event, ui);
|
||||
},
|
||||
over: function(event, ui) {
|
||||
tree.debug("droppable - over", event, ui);
|
||||
}
|
||||
*/
|
||||
},
|
||||
tree.options.dnd.droppable
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/******************************************************************************
|
||||
*
|
||||
*/
|
||||
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "dnd",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
// Make tree nodes accept draggables
|
||||
autoExpandMS: 1000, // Expand nodes after n milliseconds of hovering.
|
||||
draggable: null, // Additional options passed to jQuery draggable
|
||||
droppable: null, // Additional options passed to jQuery droppable
|
||||
focusOnClick: false, // Focus, although draggable cancels mousedown event (#270)
|
||||
preventVoidMoves: true, // Prevent dropping nodes 'before self', etc.
|
||||
preventRecursiveMoves: true, // Prevent dropping nodes on own descendants
|
||||
smartRevert: true, // set draggable.revert = true if drop was rejected
|
||||
dropMarkerOffsetX: -24, // absolute position offset for .fancytree-drop-marker relatively to ..fancytree-title (icon/img near a node accepting drop)
|
||||
dropMarkerInsertOffsetX: -16, // additional offset for drop-marker with hitMode = "before"/"after"
|
||||
// Events (drag support)
|
||||
dragStart: null, // Callback(sourceNode, data), return true, to enable dnd
|
||||
dragStop: null, // Callback(sourceNode, data)
|
||||
initHelper: null, // Callback(sourceNode, data)
|
||||
updateHelper: null, // Callback(sourceNode, data)
|
||||
// Events (drop support)
|
||||
dragEnter: null, // Callback(targetNode, data)
|
||||
dragOver: null, // Callback(targetNode, data)
|
||||
dragExpand: null, // Callback(targetNode, data), return false to prevent autoExpand
|
||||
dragDrop: null, // Callback(targetNode, data)
|
||||
dragLeave: null, // Callback(targetNode, data)
|
||||
},
|
||||
|
||||
treeInit: function (ctx) {
|
||||
var tree = ctx.tree;
|
||||
this._superApply(arguments);
|
||||
// issue #270: draggable eats mousedown events
|
||||
if (tree.options.dnd.dragStart) {
|
||||
tree.$container.on("mousedown", function (event) {
|
||||
// if( !tree.hasFocus() && ctx.options.dnd.focusOnClick ) {
|
||||
if (ctx.options.dnd.focusOnClick) {
|
||||
// #270
|
||||
var node = $.ui.fancytree.getNode(event);
|
||||
if (node) {
|
||||
node.debug(
|
||||
"Re-enable focus that was prevented by jQuery UI draggable."
|
||||
);
|
||||
// node.setFocus();
|
||||
// $(node.span).closest(":tabbable").focus();
|
||||
// $(event.target).trigger("focus");
|
||||
// $(event.target).closest(":tabbable").trigger("focus");
|
||||
}
|
||||
setTimeout(function () {
|
||||
// #300
|
||||
$(event.target).closest(":tabbable").focus();
|
||||
}, 10);
|
||||
}
|
||||
});
|
||||
}
|
||||
_initDragAndDrop(tree);
|
||||
},
|
||||
/* Display drop marker according to hitMode ('after', 'before', 'over'). */
|
||||
_setDndStatus: function (
|
||||
sourceNode,
|
||||
targetNode,
|
||||
helper,
|
||||
hitMode,
|
||||
accept
|
||||
) {
|
||||
var markerOffsetX,
|
||||
pos,
|
||||
markerAt = "center",
|
||||
instData = this._local,
|
||||
dndOpt = this.options.dnd,
|
||||
glyphOpt = this.options.glyph,
|
||||
$source = sourceNode ? $(sourceNode.span) : null,
|
||||
$target = $(targetNode.span),
|
||||
$targetTitle = $target.find("span.fancytree-title");
|
||||
|
||||
if (!instData.$dropMarker) {
|
||||
instData.$dropMarker = $(
|
||||
"<div id='fancytree-drop-marker'></div>"
|
||||
)
|
||||
.hide()
|
||||
.css({ "z-index": 1000 })
|
||||
.prependTo($(this.$div).parent());
|
||||
// .prependTo("body");
|
||||
|
||||
if (glyphOpt) {
|
||||
instData.$dropMarker.addClass(
|
||||
glyphOpt.map._addClass + " " + glyphOpt.map.dropMarker
|
||||
);
|
||||
}
|
||||
}
|
||||
if (
|
||||
hitMode === "after" ||
|
||||
hitMode === "before" ||
|
||||
hitMode === "over"
|
||||
) {
|
||||
markerOffsetX = dndOpt.dropMarkerOffsetX || 0;
|
||||
switch (hitMode) {
|
||||
case "before":
|
||||
markerAt = "top";
|
||||
markerOffsetX += dndOpt.dropMarkerInsertOffsetX || 0;
|
||||
break;
|
||||
case "after":
|
||||
markerAt = "bottom";
|
||||
markerOffsetX += dndOpt.dropMarkerInsertOffsetX || 0;
|
||||
break;
|
||||
}
|
||||
|
||||
pos = {
|
||||
my: "left" + offsetString(markerOffsetX) + " center",
|
||||
at: "left " + markerAt,
|
||||
of: $targetTitle,
|
||||
};
|
||||
if (this.options.rtl) {
|
||||
pos.my = "right" + offsetString(-markerOffsetX) + " center";
|
||||
pos.at = "right " + markerAt;
|
||||
}
|
||||
instData.$dropMarker
|
||||
.toggleClass(classDropAfter, hitMode === "after")
|
||||
.toggleClass(classDropOver, hitMode === "over")
|
||||
.toggleClass(classDropBefore, hitMode === "before")
|
||||
.toggleClass("fancytree-rtl", !!this.options.rtl)
|
||||
.show()
|
||||
.position($.ui.fancytree.fixPositionOptions(pos));
|
||||
} else {
|
||||
instData.$dropMarker.hide();
|
||||
}
|
||||
if ($source) {
|
||||
$source
|
||||
.toggleClass(classDropAccept, accept === true)
|
||||
.toggleClass(classDropReject, accept === false);
|
||||
}
|
||||
$target
|
||||
.toggleClass(
|
||||
classDropTarget,
|
||||
hitMode === "after" ||
|
||||
hitMode === "before" ||
|
||||
hitMode === "over"
|
||||
)
|
||||
.toggleClass(classDropAfter, hitMode === "after")
|
||||
.toggleClass(classDropBefore, hitMode === "before")
|
||||
.toggleClass(classDropAccept, accept === true)
|
||||
.toggleClass(classDropReject, accept === false);
|
||||
|
||||
helper
|
||||
.toggleClass(classDropAccept, accept === true)
|
||||
.toggleClass(classDropReject, accept === false);
|
||||
},
|
||||
|
||||
/*
|
||||
* Handles drag'n'drop functionality.
|
||||
*
|
||||
* A standard jQuery drag-and-drop process may generate these calls:
|
||||
*
|
||||
* start:
|
||||
* _onDragEvent("start", sourceNode, null, event, ui, draggable);
|
||||
* drag:
|
||||
* _onDragEvent("leave", prevTargetNode, sourceNode, event, ui, draggable);
|
||||
* _onDragEvent("over", targetNode, sourceNode, event, ui, draggable);
|
||||
* _onDragEvent("enter", targetNode, sourceNode, event, ui, draggable);
|
||||
* stop:
|
||||
* _onDragEvent("drop", targetNode, sourceNode, event, ui, draggable);
|
||||
* _onDragEvent("leave", targetNode, sourceNode, event, ui, draggable);
|
||||
* _onDragEvent("stop", sourceNode, null, event, ui, draggable);
|
||||
*/
|
||||
_onDragEvent: function (
|
||||
eventName,
|
||||
node,
|
||||
otherNode,
|
||||
event,
|
||||
ui,
|
||||
draggable
|
||||
) {
|
||||
// if(eventName !== "over"){
|
||||
// this.debug("tree.ext.dnd._onDragEvent(%s, %o, %o) - %o", eventName, node, otherNode, this);
|
||||
// }
|
||||
var accept,
|
||||
nodeOfs,
|
||||
parentRect,
|
||||
rect,
|
||||
relPos,
|
||||
relPos2,
|
||||
enterResponse,
|
||||
hitMode,
|
||||
r,
|
||||
opts = this.options,
|
||||
dnd = opts.dnd,
|
||||
ctx = this._makeHookContext(node, event, {
|
||||
otherNode: otherNode,
|
||||
ui: ui,
|
||||
draggable: draggable,
|
||||
}),
|
||||
res = null,
|
||||
self = this,
|
||||
$nodeTag = $(node.span);
|
||||
|
||||
if (dnd.smartRevert) {
|
||||
draggable.options.revert = "invalid";
|
||||
}
|
||||
|
||||
switch (eventName) {
|
||||
case "start":
|
||||
if (node.isStatusNode()) {
|
||||
res = false;
|
||||
} else if (dnd.dragStart) {
|
||||
res = dnd.dragStart(node, ctx);
|
||||
}
|
||||
if (res === false) {
|
||||
this.debug("tree.dragStart() cancelled");
|
||||
//draggable._clear();
|
||||
// NOTE: the return value seems to be ignored (drag is not cancelled, when false is returned)
|
||||
// TODO: call this._cancelDrag()?
|
||||
ui.helper.trigger("mouseup").hide();
|
||||
} else {
|
||||
if (dnd.smartRevert) {
|
||||
// #567, #593: fix revert position
|
||||
// rect = node.li.getBoundingClientRect();
|
||||
rect =
|
||||
node[
|
||||
ctx.tree.nodeContainerAttrName
|
||||
].getBoundingClientRect();
|
||||
parentRect = $(
|
||||
draggable.options.appendTo
|
||||
)[0].getBoundingClientRect();
|
||||
draggable.originalPosition.left = Math.max(
|
||||
0,
|
||||
rect.left - parentRect.left
|
||||
);
|
||||
draggable.originalPosition.top = Math.max(
|
||||
0,
|
||||
rect.top - parentRect.top
|
||||
);
|
||||
}
|
||||
$nodeTag.addClass("fancytree-drag-source");
|
||||
// Register global handlers to allow cancel
|
||||
$(document).on(
|
||||
"keydown.fancytree-dnd,mousedown.fancytree-dnd",
|
||||
function (event) {
|
||||
// node.tree.debug("dnd global event", event.type, event.which);
|
||||
if (
|
||||
event.type === "keydown" &&
|
||||
event.which === $.ui.keyCode.ESCAPE
|
||||
) {
|
||||
self.ext.dnd._cancelDrag();
|
||||
} else if (event.type === "mousedown") {
|
||||
self.ext.dnd._cancelDrag();
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
break;
|
||||
|
||||
case "enter":
|
||||
if (
|
||||
dnd.preventRecursiveMoves &&
|
||||
node.isDescendantOf(otherNode)
|
||||
) {
|
||||
r = false;
|
||||
} else {
|
||||
r = dnd.dragEnter ? dnd.dragEnter(node, ctx) : null;
|
||||
}
|
||||
if (!r) {
|
||||
// convert null, undefined, false to false
|
||||
res = false;
|
||||
} else if (Array.isArray(r)) {
|
||||
// TODO: also accept passing an object of this format directly
|
||||
res = {
|
||||
over: $.inArray("over", r) >= 0,
|
||||
before: $.inArray("before", r) >= 0,
|
||||
after: $.inArray("after", r) >= 0,
|
||||
};
|
||||
} else {
|
||||
res = {
|
||||
over: r === true || r === "over",
|
||||
before: r === true || r === "before",
|
||||
after: r === true || r === "after",
|
||||
};
|
||||
}
|
||||
ui.helper.data("enterResponse", res);
|
||||
// this.debug("helper.enterResponse: %o", res);
|
||||
break;
|
||||
|
||||
case "over":
|
||||
enterResponse = ui.helper.data("enterResponse");
|
||||
hitMode = null;
|
||||
if (enterResponse === false) {
|
||||
// Don't call dragOver if onEnter returned false.
|
||||
// break;
|
||||
} else if (typeof enterResponse === "string") {
|
||||
// Use hitMode from onEnter if provided.
|
||||
hitMode = enterResponse;
|
||||
} else {
|
||||
// Calculate hitMode from relative cursor position.
|
||||
nodeOfs = $nodeTag.offset();
|
||||
relPos = {
|
||||
x: event.pageX - nodeOfs.left,
|
||||
y: event.pageY - nodeOfs.top,
|
||||
};
|
||||
relPos2 = {
|
||||
x: relPos.x / $nodeTag.width(),
|
||||
y: relPos.y / $nodeTag.height(),
|
||||
};
|
||||
|
||||
if (enterResponse.after && relPos2.y > 0.75) {
|
||||
hitMode = "after";
|
||||
} else if (
|
||||
!enterResponse.over &&
|
||||
enterResponse.after &&
|
||||
relPos2.y > 0.5
|
||||
) {
|
||||
hitMode = "after";
|
||||
} else if (enterResponse.before && relPos2.y <= 0.25) {
|
||||
hitMode = "before";
|
||||
} else if (
|
||||
!enterResponse.over &&
|
||||
enterResponse.before &&
|
||||
relPos2.y <= 0.5
|
||||
) {
|
||||
hitMode = "before";
|
||||
} else if (enterResponse.over) {
|
||||
hitMode = "over";
|
||||
}
|
||||
// Prevent no-ops like 'before source node'
|
||||
// TODO: these are no-ops when moving nodes, but not in copy mode
|
||||
if (dnd.preventVoidMoves) {
|
||||
if (node === otherNode) {
|
||||
this.debug(
|
||||
" drop over source node prevented"
|
||||
);
|
||||
hitMode = null;
|
||||
} else if (
|
||||
hitMode === "before" &&
|
||||
otherNode &&
|
||||
node === otherNode.getNextSibling()
|
||||
) {
|
||||
this.debug(
|
||||
" drop after source node prevented"
|
||||
);
|
||||
hitMode = null;
|
||||
} else if (
|
||||
hitMode === "after" &&
|
||||
otherNode &&
|
||||
node === otherNode.getPrevSibling()
|
||||
) {
|
||||
this.debug(
|
||||
" drop before source node prevented"
|
||||
);
|
||||
hitMode = null;
|
||||
} else if (
|
||||
hitMode === "over" &&
|
||||
otherNode &&
|
||||
otherNode.parent === node &&
|
||||
otherNode.isLastSibling()
|
||||
) {
|
||||
this.debug(
|
||||
" drop last child over own parent prevented"
|
||||
);
|
||||
hitMode = null;
|
||||
}
|
||||
}
|
||||
// this.debug("hitMode: %s - %s - %s", hitMode, (node.parent === otherNode), node.isLastSibling());
|
||||
ui.helper.data("hitMode", hitMode);
|
||||
}
|
||||
// Auto-expand node (only when 'over' the node, not 'before', or 'after')
|
||||
if (
|
||||
hitMode !== "before" &&
|
||||
hitMode !== "after" &&
|
||||
dnd.autoExpandMS &&
|
||||
node.hasChildren() !== false &&
|
||||
!node.expanded &&
|
||||
(!dnd.dragExpand || dnd.dragExpand(node, ctx) !== false)
|
||||
) {
|
||||
node.scheduleAction("expand", dnd.autoExpandMS);
|
||||
}
|
||||
if (hitMode && dnd.dragOver) {
|
||||
// TODO: http://code.google.com/p/dynatree/source/detail?r=625
|
||||
ctx.hitMode = hitMode;
|
||||
res = dnd.dragOver(node, ctx);
|
||||
}
|
||||
accept = res !== false && hitMode !== null;
|
||||
if (dnd.smartRevert) {
|
||||
draggable.options.revert = !accept;
|
||||
}
|
||||
this._local._setDndStatus(
|
||||
otherNode,
|
||||
node,
|
||||
ui.helper,
|
||||
hitMode,
|
||||
accept
|
||||
);
|
||||
break;
|
||||
|
||||
case "drop":
|
||||
hitMode = ui.helper.data("hitMode");
|
||||
if (hitMode && dnd.dragDrop) {
|
||||
ctx.hitMode = hitMode;
|
||||
dnd.dragDrop(node, ctx);
|
||||
}
|
||||
break;
|
||||
|
||||
case "leave":
|
||||
// Cancel pending expand request
|
||||
node.scheduleAction("cancel");
|
||||
ui.helper.data("enterResponse", null);
|
||||
ui.helper.data("hitMode", null);
|
||||
this._local._setDndStatus(
|
||||
otherNode,
|
||||
node,
|
||||
ui.helper,
|
||||
"out",
|
||||
undefined
|
||||
);
|
||||
if (dnd.dragLeave) {
|
||||
dnd.dragLeave(node, ctx);
|
||||
}
|
||||
break;
|
||||
|
||||
case "stop":
|
||||
$nodeTag.removeClass("fancytree-drag-source");
|
||||
$(document).off(".fancytree-dnd");
|
||||
if (dnd.dragStop) {
|
||||
dnd.dragStop(node, ctx);
|
||||
}
|
||||
break;
|
||||
|
||||
default:
|
||||
$.error("Unsupported drag event: " + eventName);
|
||||
}
|
||||
return res;
|
||||
},
|
||||
|
||||
_cancelDrag: function () {
|
||||
var dd = $.ui.ddmanager.current;
|
||||
if (dd) {
|
||||
dd.cancel();
|
||||
}
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
File diff suppressed because it is too large
Load diff
|
|
@ -0,0 +1,403 @@
|
|||
/*!
|
||||
* jquery.fancytree.edit.js
|
||||
*
|
||||
* Make node titles editable.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/*******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
|
||||
var isMac = /Mac/.test(navigator.platform),
|
||||
escapeHtml = $.ui.fancytree.escapeHtml,
|
||||
trim = $.ui.fancytree.trim,
|
||||
unescapeHtml = $.ui.fancytree.unescapeHtml;
|
||||
|
||||
/**
|
||||
* [ext-edit] Start inline editing of current node title.
|
||||
*
|
||||
* @alias FancytreeNode#editStart
|
||||
* @requires Fancytree
|
||||
*/
|
||||
$.ui.fancytree._FancytreeNodeClass.prototype.editStart = function () {
|
||||
var $input,
|
||||
node = this,
|
||||
tree = this.tree,
|
||||
local = tree.ext.edit,
|
||||
instOpts = tree.options.edit,
|
||||
$title = $(".fancytree-title", node.span),
|
||||
eventData = {
|
||||
node: node,
|
||||
tree: tree,
|
||||
options: tree.options,
|
||||
isNew: $(node[tree.statusClassPropName]).hasClass(
|
||||
"fancytree-edit-new"
|
||||
),
|
||||
orgTitle: node.title,
|
||||
input: null,
|
||||
dirty: false,
|
||||
};
|
||||
|
||||
// beforeEdit may want to modify the title before editing
|
||||
if (
|
||||
instOpts.beforeEdit.call(
|
||||
node,
|
||||
{ type: "beforeEdit" },
|
||||
eventData
|
||||
) === false
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
$.ui.fancytree.assert(!local.currentNode, "recursive edit");
|
||||
local.currentNode = this;
|
||||
local.eventData = eventData;
|
||||
|
||||
// Disable standard Fancytree mouse- and key handling
|
||||
tree.widget._unbind();
|
||||
|
||||
local.lastDraggableAttrValue = node.span.draggable;
|
||||
if (local.lastDraggableAttrValue) {
|
||||
node.span.draggable = false;
|
||||
}
|
||||
|
||||
// #116: ext-dnd prevents the blur event, so we have to catch outer clicks
|
||||
$(document).on("mousedown.fancytree-edit", function (event) {
|
||||
if (!$(event.target).hasClass("fancytree-edit-input")) {
|
||||
node.editEnd(true, event);
|
||||
}
|
||||
});
|
||||
|
||||
// Replace node with <input>
|
||||
$input = $("<input />", {
|
||||
class: "fancytree-edit-input",
|
||||
type: "text",
|
||||
value: tree.options.escapeTitles
|
||||
? eventData.orgTitle
|
||||
: unescapeHtml(eventData.orgTitle),
|
||||
});
|
||||
local.eventData.input = $input;
|
||||
if (instOpts.adjustWidthOfs != null) {
|
||||
$input.width($title.width() + instOpts.adjustWidthOfs);
|
||||
}
|
||||
if (instOpts.inputCss != null) {
|
||||
$input.css(instOpts.inputCss);
|
||||
}
|
||||
|
||||
$title.html($input);
|
||||
|
||||
// Focus <input> and bind keyboard handler
|
||||
$input
|
||||
.focus()
|
||||
.change(function (event) {
|
||||
$input.addClass("fancytree-edit-dirty");
|
||||
})
|
||||
.on("keydown", function (event) {
|
||||
switch (event.which) {
|
||||
case $.ui.keyCode.ESCAPE:
|
||||
node.editEnd(false, event);
|
||||
break;
|
||||
case $.ui.keyCode.ENTER:
|
||||
node.editEnd(true, event);
|
||||
return false; // so we don't start editmode on Mac
|
||||
}
|
||||
event.stopPropagation();
|
||||
})
|
||||
.blur(function (event) {
|
||||
return node.editEnd(true, event);
|
||||
});
|
||||
|
||||
instOpts.edit.call(node, { type: "edit" }, eventData);
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-edit] Stop inline editing.
|
||||
* @param {Boolean} [applyChanges=false] false: cancel edit, true: save (if modified)
|
||||
* @alias FancytreeNode#editEnd
|
||||
* @requires jquery.fancytree.edit.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeNodeClass.prototype.editEnd = function (
|
||||
applyChanges,
|
||||
_event
|
||||
) {
|
||||
var newVal,
|
||||
node = this,
|
||||
tree = this.tree,
|
||||
local = tree.ext.edit,
|
||||
eventData = local.eventData,
|
||||
instOpts = tree.options.edit,
|
||||
$title = $(".fancytree-title", node.span),
|
||||
$input = $title.find("input.fancytree-edit-input");
|
||||
|
||||
if (instOpts.trim) {
|
||||
$input.val(trim($input.val()));
|
||||
}
|
||||
newVal = $input.val();
|
||||
|
||||
eventData.dirty = newVal !== node.title;
|
||||
eventData.originalEvent = _event;
|
||||
|
||||
// Find out, if saving is required
|
||||
if (applyChanges === false) {
|
||||
// If true/false was passed, honor this (except in rename mode, if unchanged)
|
||||
eventData.save = false;
|
||||
} else if (eventData.isNew) {
|
||||
// In create mode, we save everything, except for empty text
|
||||
eventData.save = newVal !== "";
|
||||
} else {
|
||||
// In rename mode, we save everyting, except for empty or unchanged text
|
||||
eventData.save = eventData.dirty && newVal !== "";
|
||||
}
|
||||
// Allow to break (keep editor open), modify input, or re-define data.save
|
||||
if (
|
||||
instOpts.beforeClose.call(
|
||||
node,
|
||||
{ type: "beforeClose" },
|
||||
eventData
|
||||
) === false
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
if (
|
||||
eventData.save &&
|
||||
instOpts.save.call(node, { type: "save" }, eventData) === false
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
$input.removeClass("fancytree-edit-dirty").off();
|
||||
// Unbind outer-click handler
|
||||
$(document).off(".fancytree-edit");
|
||||
|
||||
if (eventData.save) {
|
||||
// # 171: escape user input (not required if global escaping is on)
|
||||
node.setTitle(
|
||||
tree.options.escapeTitles ? newVal : escapeHtml(newVal)
|
||||
);
|
||||
node.setFocus();
|
||||
} else {
|
||||
if (eventData.isNew) {
|
||||
node.remove();
|
||||
node = eventData.node = null;
|
||||
local.relatedNode.setFocus();
|
||||
} else {
|
||||
node.renderTitle();
|
||||
node.setFocus();
|
||||
}
|
||||
}
|
||||
local.eventData = null;
|
||||
local.currentNode = null;
|
||||
local.relatedNode = null;
|
||||
// Re-enable mouse and keyboard handling
|
||||
tree.widget._bind();
|
||||
|
||||
if (node && local.lastDraggableAttrValue) {
|
||||
node.span.draggable = true;
|
||||
}
|
||||
|
||||
// Set keyboard focus, even if setFocus() claims 'nothing to do'
|
||||
tree.$container.get(0).focus({ preventScroll: true });
|
||||
eventData.input = null;
|
||||
instOpts.close.call(node, { type: "close" }, eventData);
|
||||
return true;
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-edit] Create a new child or sibling node and start edit mode.
|
||||
*
|
||||
* @param {String} [mode='child'] 'before', 'after', or 'child'
|
||||
* @param {Object} [init] NodeData (or simple title string)
|
||||
* @alias FancytreeNode#editCreateNode
|
||||
* @requires jquery.fancytree.edit.js
|
||||
* @since 2.4
|
||||
*/
|
||||
$.ui.fancytree._FancytreeNodeClass.prototype.editCreateNode = function (
|
||||
mode,
|
||||
init
|
||||
) {
|
||||
var newNode,
|
||||
tree = this.tree,
|
||||
self = this;
|
||||
|
||||
mode = mode || "child";
|
||||
if (init == null) {
|
||||
init = { title: "" };
|
||||
} else if (typeof init === "string") {
|
||||
init = { title: init };
|
||||
} else {
|
||||
$.ui.fancytree.assert($.isPlainObject(init));
|
||||
}
|
||||
// Make sure node is expanded (and loaded) in 'child' mode
|
||||
if (
|
||||
mode === "child" &&
|
||||
!this.isExpanded() &&
|
||||
this.hasChildren() !== false
|
||||
) {
|
||||
this.setExpanded().done(function () {
|
||||
self.editCreateNode(mode, init);
|
||||
});
|
||||
return;
|
||||
}
|
||||
newNode = this.addNode(init, mode);
|
||||
|
||||
// #644: Don't filter new nodes.
|
||||
newNode.match = true;
|
||||
$(newNode[tree.statusClassPropName])
|
||||
.removeClass("fancytree-hide")
|
||||
.addClass("fancytree-match");
|
||||
|
||||
newNode.makeVisible(/*{noAnimation: true}*/).done(function () {
|
||||
$(newNode[tree.statusClassPropName]).addClass("fancytree-edit-new");
|
||||
self.tree.ext.edit.relatedNode = self;
|
||||
newNode.editStart();
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-edit] Check if any node in this tree in edit mode.
|
||||
*
|
||||
* @returns {FancytreeNode | null}
|
||||
* @alias Fancytree#isEditing
|
||||
* @requires jquery.fancytree.edit.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeClass.prototype.isEditing = function () {
|
||||
return this.ext.edit ? this.ext.edit.currentNode : null;
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-edit] Check if this node is in edit mode.
|
||||
* @returns {Boolean} true if node is currently beeing edited
|
||||
* @alias FancytreeNode#isEditing
|
||||
* @requires jquery.fancytree.edit.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeNodeClass.prototype.isEditing = function () {
|
||||
return this.tree.ext.edit
|
||||
? this.tree.ext.edit.currentNode === this
|
||||
: false;
|
||||
};
|
||||
|
||||
/*******************************************************************************
|
||||
* Extension code
|
||||
*/
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "edit",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
adjustWidthOfs: 4, // null: don't adjust input size to content
|
||||
allowEmpty: false, // Prevent empty input
|
||||
inputCss: { minWidth: "3em" },
|
||||
// triggerCancel: ["esc", "tab", "click"],
|
||||
triggerStart: ["f2", "mac+enter", "shift+click"],
|
||||
trim: true, // Trim whitespace before save
|
||||
// Events:
|
||||
beforeClose: $.noop, // Return false to prevent cancel/save (data.input is available)
|
||||
beforeEdit: $.noop, // Return false to prevent edit mode
|
||||
close: $.noop, // Editor was removed
|
||||
edit: $.noop, // Editor was opened (available as data.input)
|
||||
// keypress: $.noop, // Not yet implemented
|
||||
save: $.noop, // Save data.input.val() or return false to keep editor open
|
||||
},
|
||||
// Local attributes
|
||||
currentNode: null,
|
||||
|
||||
treeInit: function (ctx) {
|
||||
var tree = ctx.tree;
|
||||
|
||||
this._superApply(arguments);
|
||||
|
||||
this.$container
|
||||
.addClass("fancytree-ext-edit")
|
||||
.on("fancytreebeforeupdateviewport", function (event, data) {
|
||||
var editNode = tree.isEditing();
|
||||
// When scrolling, the TR may be re-used by another node, so the
|
||||
// active cell marker an
|
||||
if (editNode) {
|
||||
editNode.info("Cancel edit due to scroll event.");
|
||||
editNode.editEnd(false, event);
|
||||
}
|
||||
});
|
||||
},
|
||||
nodeClick: function (ctx) {
|
||||
var eventStr = $.ui.fancytree.eventToString(ctx.originalEvent),
|
||||
triggerStart = ctx.options.edit.triggerStart;
|
||||
|
||||
if (
|
||||
eventStr === "shift+click" &&
|
||||
$.inArray("shift+click", triggerStart) >= 0
|
||||
) {
|
||||
if (ctx.originalEvent.shiftKey) {
|
||||
ctx.node.editStart();
|
||||
return false;
|
||||
}
|
||||
}
|
||||
if (
|
||||
eventStr === "click" &&
|
||||
$.inArray("clickActive", triggerStart) >= 0
|
||||
) {
|
||||
// Only when click was inside title text (not aynwhere else in the row)
|
||||
if (
|
||||
ctx.node.isActive() &&
|
||||
!ctx.node.isEditing() &&
|
||||
$(ctx.originalEvent.target).hasClass("fancytree-title")
|
||||
) {
|
||||
ctx.node.editStart();
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
nodeDblclick: function (ctx) {
|
||||
if ($.inArray("dblclick", ctx.options.edit.triggerStart) >= 0) {
|
||||
ctx.node.editStart();
|
||||
return false;
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
nodeKeydown: function (ctx) {
|
||||
switch (ctx.originalEvent.which) {
|
||||
case 113: // [F2]
|
||||
if ($.inArray("f2", ctx.options.edit.triggerStart) >= 0) {
|
||||
ctx.node.editStart();
|
||||
return false;
|
||||
}
|
||||
break;
|
||||
case $.ui.keyCode.ENTER:
|
||||
if (
|
||||
$.inArray("mac+enter", ctx.options.edit.triggerStart) >=
|
||||
0 &&
|
||||
isMac
|
||||
) {
|
||||
ctx.node.editStart();
|
||||
return false;
|
||||
}
|
||||
break;
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,549 @@
|
|||
/*!
|
||||
* jquery.fancytree.filter.js
|
||||
*
|
||||
* Remove or highlight tree nodes, based on a filter.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/*******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
|
||||
var KeyNoData = "__not_found__",
|
||||
escapeHtml = $.ui.fancytree.escapeHtml,
|
||||
exoticStartChar = "\uFFF7",
|
||||
exoticEndChar = "\uFFF8";
|
||||
function _escapeRegex(str) {
|
||||
return (str + "").replace(/([.?*+^$[\]\\(){}|-])/g, "\\$1");
|
||||
}
|
||||
|
||||
function extractHtmlText(s) {
|
||||
if (s.indexOf(">") >= 0) {
|
||||
return $("<div/>").html(s).text();
|
||||
}
|
||||
return s;
|
||||
}
|
||||
|
||||
/**
|
||||
* @description Marks the matching charecters of `text` either by `mark` or
|
||||
* by exotic*Chars (if `escapeTitles` is `true`) based on `regexMatchArray`
|
||||
* which is an array of matching groups.
|
||||
* @param {string} text
|
||||
* @param {RegExpMatchArray} regexMatchArray
|
||||
*/
|
||||
function _markFuzzyMatchedChars(text, regexMatchArray, escapeTitles) {
|
||||
// It is extremely infuriating that we can not use `let` or `const` or arrow functions.
|
||||
// Damn you IE!!!
|
||||
var matchingIndices = [];
|
||||
// get the indices of matched characters (Iterate through `RegExpMatchArray`)
|
||||
for (
|
||||
var _matchingArrIdx = 1;
|
||||
_matchingArrIdx < regexMatchArray.length;
|
||||
_matchingArrIdx++
|
||||
) {
|
||||
var _mIdx =
|
||||
// get matching char index by cumulatively adding
|
||||
// the matched group length
|
||||
regexMatchArray[_matchingArrIdx].length +
|
||||
(_matchingArrIdx === 1 ? 0 : 1) +
|
||||
(matchingIndices[matchingIndices.length - 1] || 0);
|
||||
matchingIndices.push(_mIdx);
|
||||
}
|
||||
// Map each `text` char to its position and store in `textPoses`.
|
||||
var textPoses = text.split("");
|
||||
if (escapeTitles) {
|
||||
// If escaping the title, then wrap the matchng char within exotic chars
|
||||
matchingIndices.forEach(function (v) {
|
||||
textPoses[v] = exoticStartChar + textPoses[v] + exoticEndChar;
|
||||
});
|
||||
} else {
|
||||
// Otherwise, Wrap the matching chars within `mark`.
|
||||
matchingIndices.forEach(function (v) {
|
||||
textPoses[v] = "<mark>" + textPoses[v] + "</mark>";
|
||||
});
|
||||
}
|
||||
// Join back the modified `textPoses` to create final highlight markup.
|
||||
return textPoses.join("");
|
||||
}
|
||||
$.ui.fancytree._FancytreeClass.prototype._applyFilterImpl = function (
|
||||
filter,
|
||||
branchMode,
|
||||
_opts
|
||||
) {
|
||||
var match,
|
||||
statusNode,
|
||||
re,
|
||||
reHighlight,
|
||||
reExoticStartChar,
|
||||
reExoticEndChar,
|
||||
temp,
|
||||
prevEnableUpdate,
|
||||
count = 0,
|
||||
treeOpts = this.options,
|
||||
escapeTitles = treeOpts.escapeTitles,
|
||||
prevAutoCollapse = treeOpts.autoCollapse,
|
||||
opts = $.extend({}, treeOpts.filter, _opts),
|
||||
hideMode = opts.mode === "hide",
|
||||
leavesOnly = !!opts.leavesOnly && !branchMode;
|
||||
|
||||
// Default to 'match title substring (not case sensitive)'
|
||||
if (typeof filter === "string") {
|
||||
if (filter === "") {
|
||||
this.warn(
|
||||
"Fancytree passing an empty string as a filter is handled as clearFilter()."
|
||||
);
|
||||
this.clearFilter();
|
||||
return;
|
||||
}
|
||||
if (opts.fuzzy) {
|
||||
// See https://codereview.stackexchange.com/questions/23899/faster-javascript-fuzzy-string-matching-function/23905#23905
|
||||
// and http://www.quora.com/How-is-the-fuzzy-search-algorithm-in-Sublime-Text-designed
|
||||
// and http://www.dustindiaz.com/autocomplete-fuzzy-matching
|
||||
match = filter
|
||||
.split("")
|
||||
// Escaping the `filter` will not work because,
|
||||
// it gets further split into individual characters. So,
|
||||
// escape each character after splitting
|
||||
.map(_escapeRegex)
|
||||
.reduce(function (a, b) {
|
||||
// create capture groups for parts that comes before
|
||||
// the character
|
||||
return a + "([^" + b + "]*)" + b;
|
||||
}, "");
|
||||
} else {
|
||||
match = _escapeRegex(filter); // make sure a '.' is treated literally
|
||||
}
|
||||
re = new RegExp(match, "i");
|
||||
reHighlight = new RegExp(_escapeRegex(filter), "gi");
|
||||
if (escapeTitles) {
|
||||
reExoticStartChar = new RegExp(
|
||||
_escapeRegex(exoticStartChar),
|
||||
"g"
|
||||
);
|
||||
reExoticEndChar = new RegExp(_escapeRegex(exoticEndChar), "g");
|
||||
}
|
||||
filter = function (node) {
|
||||
if (!node.title) {
|
||||
return false;
|
||||
}
|
||||
var text = escapeTitles
|
||||
? node.title
|
||||
: extractHtmlText(node.title),
|
||||
// `.match` instead of `.test` to get the capture groups
|
||||
res = text.match(re);
|
||||
if (res && opts.highlight) {
|
||||
if (escapeTitles) {
|
||||
if (opts.fuzzy) {
|
||||
temp = _markFuzzyMatchedChars(
|
||||
text,
|
||||
res,
|
||||
escapeTitles
|
||||
);
|
||||
} else {
|
||||
// #740: we must not apply the marks to escaped entity names, e.g. `"`
|
||||
// Use some exotic characters to mark matches:
|
||||
temp = text.replace(reHighlight, function (s) {
|
||||
return exoticStartChar + s + exoticEndChar;
|
||||
});
|
||||
}
|
||||
// now we can escape the title...
|
||||
node.titleWithHighlight = escapeHtml(temp)
|
||||
// ... and finally insert the desired `<mark>` tags
|
||||
.replace(reExoticStartChar, "<mark>")
|
||||
.replace(reExoticEndChar, "</mark>");
|
||||
} else {
|
||||
if (opts.fuzzy) {
|
||||
node.titleWithHighlight = _markFuzzyMatchedChars(
|
||||
text,
|
||||
res
|
||||
);
|
||||
} else {
|
||||
node.titleWithHighlight = text.replace(
|
||||
reHighlight,
|
||||
function (s) {
|
||||
return "<mark>" + s + "</mark>";
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
// node.debug("filter", escapeTitles, text, node.titleWithHighlight);
|
||||
}
|
||||
return !!res;
|
||||
};
|
||||
}
|
||||
|
||||
this.enableFilter = true;
|
||||
this.lastFilterArgs = arguments;
|
||||
|
||||
prevEnableUpdate = this.enableUpdate(false);
|
||||
|
||||
this.$div.addClass("fancytree-ext-filter");
|
||||
if (hideMode) {
|
||||
this.$div.addClass("fancytree-ext-filter-hide");
|
||||
} else {
|
||||
this.$div.addClass("fancytree-ext-filter-dimm");
|
||||
}
|
||||
this.$div.toggleClass(
|
||||
"fancytree-ext-filter-hide-expanders",
|
||||
!!opts.hideExpanders
|
||||
);
|
||||
// Reset current filter
|
||||
this.rootNode.subMatchCount = 0;
|
||||
this.visit(function (node) {
|
||||
delete node.match;
|
||||
delete node.titleWithHighlight;
|
||||
node.subMatchCount = 0;
|
||||
});
|
||||
statusNode = this.getRootNode()._findDirectChild(KeyNoData);
|
||||
if (statusNode) {
|
||||
statusNode.remove();
|
||||
}
|
||||
|
||||
// Adjust node.hide, .match, and .subMatchCount properties
|
||||
treeOpts.autoCollapse = false; // #528
|
||||
|
||||
this.visit(function (node) {
|
||||
if (leavesOnly && node.children != null) {
|
||||
return;
|
||||
}
|
||||
var res = filter(node),
|
||||
matchedByBranch = false;
|
||||
|
||||
if (res === "skip") {
|
||||
node.visit(function (c) {
|
||||
c.match = false;
|
||||
}, true);
|
||||
return "skip";
|
||||
}
|
||||
if (!res && (branchMode || res === "branch") && node.parent.match) {
|
||||
res = true;
|
||||
matchedByBranch = true;
|
||||
}
|
||||
if (res) {
|
||||
count++;
|
||||
node.match = true;
|
||||
node.visitParents(function (p) {
|
||||
if (p !== node) {
|
||||
p.subMatchCount += 1;
|
||||
}
|
||||
// Expand match (unless this is no real match, but only a node in a matched branch)
|
||||
if (opts.autoExpand && !matchedByBranch && !p.expanded) {
|
||||
p.setExpanded(true, {
|
||||
noAnimation: true,
|
||||
noEvents: true,
|
||||
scrollIntoView: false,
|
||||
});
|
||||
p._filterAutoExpanded = true;
|
||||
}
|
||||
}, true);
|
||||
}
|
||||
});
|
||||
treeOpts.autoCollapse = prevAutoCollapse;
|
||||
|
||||
if (count === 0 && opts.nodata && hideMode) {
|
||||
statusNode = opts.nodata;
|
||||
if (typeof statusNode === "function") {
|
||||
statusNode = statusNode();
|
||||
}
|
||||
if (statusNode === true) {
|
||||
statusNode = {};
|
||||
} else if (typeof statusNode === "string") {
|
||||
statusNode = { title: statusNode };
|
||||
}
|
||||
statusNode = $.extend(
|
||||
{
|
||||
statusNodeType: "nodata",
|
||||
key: KeyNoData,
|
||||
title: this.options.strings.noData,
|
||||
},
|
||||
statusNode
|
||||
);
|
||||
|
||||
this.getRootNode().addNode(statusNode).match = true;
|
||||
}
|
||||
// Redraw whole tree
|
||||
this._callHook("treeStructureChanged", this, "applyFilter");
|
||||
// this.render();
|
||||
this.enableUpdate(prevEnableUpdate);
|
||||
return count;
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-filter] Dimm or hide nodes.
|
||||
*
|
||||
* @param {function | string} filter
|
||||
* @param {boolean} [opts={autoExpand: false, leavesOnly: false}]
|
||||
* @returns {integer} count
|
||||
* @alias Fancytree#filterNodes
|
||||
* @requires jquery.fancytree.filter.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeClass.prototype.filterNodes = function (
|
||||
filter,
|
||||
opts
|
||||
) {
|
||||
if (typeof opts === "boolean") {
|
||||
opts = { leavesOnly: opts };
|
||||
this.warn(
|
||||
"Fancytree.filterNodes() leavesOnly option is deprecated since 2.9.0 / 2015-04-19. Use opts.leavesOnly instead."
|
||||
);
|
||||
}
|
||||
return this._applyFilterImpl(filter, false, opts);
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-filter] Dimm or hide whole branches.
|
||||
*
|
||||
* @param {function | string} filter
|
||||
* @param {boolean} [opts={autoExpand: false}]
|
||||
* @returns {integer} count
|
||||
* @alias Fancytree#filterBranches
|
||||
* @requires jquery.fancytree.filter.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeClass.prototype.filterBranches = function (
|
||||
filter,
|
||||
opts
|
||||
) {
|
||||
return this._applyFilterImpl(filter, true, opts);
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-filter] Re-apply current filter.
|
||||
*
|
||||
* @returns {integer} count
|
||||
* @alias Fancytree#updateFilter
|
||||
* @requires jquery.fancytree.filter.js
|
||||
* @since 2.38
|
||||
*/
|
||||
$.ui.fancytree._FancytreeClass.prototype.updateFilter = function () {
|
||||
if (
|
||||
this.enableFilter &&
|
||||
this.lastFilterArgs &&
|
||||
this.options.filter.autoApply
|
||||
) {
|
||||
this._applyFilterImpl.apply(this, this.lastFilterArgs);
|
||||
} else {
|
||||
this.warn("updateFilter(): no filter active.");
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-filter] Reset the filter.
|
||||
*
|
||||
* @alias Fancytree#clearFilter
|
||||
* @requires jquery.fancytree.filter.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeClass.prototype.clearFilter = function () {
|
||||
var $title,
|
||||
statusNode = this.getRootNode()._findDirectChild(KeyNoData),
|
||||
escapeTitles = this.options.escapeTitles,
|
||||
enhanceTitle = this.options.enhanceTitle,
|
||||
prevEnableUpdate = this.enableUpdate(false);
|
||||
|
||||
if (statusNode) {
|
||||
statusNode.remove();
|
||||
}
|
||||
// we also counted root node's subMatchCount
|
||||
delete this.rootNode.match;
|
||||
delete this.rootNode.subMatchCount;
|
||||
|
||||
this.visit(function (node) {
|
||||
if (node.match && node.span) {
|
||||
// #491, #601
|
||||
$title = $(node.span).find(">span.fancytree-title");
|
||||
if (escapeTitles) {
|
||||
$title.text(node.title);
|
||||
} else {
|
||||
$title.html(node.title);
|
||||
}
|
||||
if (enhanceTitle) {
|
||||
enhanceTitle(
|
||||
{ type: "enhanceTitle" },
|
||||
{ node: node, $title: $title }
|
||||
);
|
||||
}
|
||||
}
|
||||
delete node.match;
|
||||
delete node.subMatchCount;
|
||||
delete node.titleWithHighlight;
|
||||
if (node.$subMatchBadge) {
|
||||
node.$subMatchBadge.remove();
|
||||
delete node.$subMatchBadge;
|
||||
}
|
||||
if (node._filterAutoExpanded && node.expanded) {
|
||||
node.setExpanded(false, {
|
||||
noAnimation: true,
|
||||
noEvents: true,
|
||||
scrollIntoView: false,
|
||||
});
|
||||
}
|
||||
delete node._filterAutoExpanded;
|
||||
});
|
||||
this.enableFilter = false;
|
||||
this.lastFilterArgs = null;
|
||||
this.$div.removeClass(
|
||||
"fancytree-ext-filter fancytree-ext-filter-dimm fancytree-ext-filter-hide"
|
||||
);
|
||||
this._callHook("treeStructureChanged", this, "clearFilter");
|
||||
// this.render();
|
||||
this.enableUpdate(prevEnableUpdate);
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-filter] Return true if a filter is currently applied.
|
||||
*
|
||||
* @returns {Boolean}
|
||||
* @alias Fancytree#isFilterActive
|
||||
* @requires jquery.fancytree.filter.js
|
||||
* @since 2.13
|
||||
*/
|
||||
$.ui.fancytree._FancytreeClass.prototype.isFilterActive = function () {
|
||||
return !!this.enableFilter;
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-filter] Return true if this node is matched by current filter (or no filter is active).
|
||||
*
|
||||
* @returns {Boolean}
|
||||
* @alias FancytreeNode#isMatched
|
||||
* @requires jquery.fancytree.filter.js
|
||||
* @since 2.13
|
||||
*/
|
||||
$.ui.fancytree._FancytreeNodeClass.prototype.isMatched = function () {
|
||||
return !(this.tree.enableFilter && !this.match);
|
||||
};
|
||||
|
||||
/*******************************************************************************
|
||||
* Extension code
|
||||
*/
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "filter",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
autoApply: true, // Re-apply last filter if lazy data is loaded
|
||||
autoExpand: false, // Expand all branches that contain matches while filtered
|
||||
counter: true, // Show a badge with number of matching child nodes near parent icons
|
||||
fuzzy: false, // Match single characters in order, e.g. 'fb' will match 'FooBar'
|
||||
hideExpandedCounter: true, // Hide counter badge if parent is expanded
|
||||
hideExpanders: false, // Hide expanders if all child nodes are hidden by filter
|
||||
highlight: true, // Highlight matches by wrapping inside <mark> tags
|
||||
leavesOnly: false, // Match end nodes only
|
||||
nodata: true, // Display a 'no data' status node if result is empty
|
||||
mode: "dimm", // Grayout unmatched nodes (pass "hide" to remove unmatched node instead)
|
||||
},
|
||||
nodeLoadChildren: function (ctx, source) {
|
||||
var tree = ctx.tree;
|
||||
|
||||
return this._superApply(arguments).done(function () {
|
||||
if (
|
||||
tree.enableFilter &&
|
||||
tree.lastFilterArgs &&
|
||||
ctx.options.filter.autoApply
|
||||
) {
|
||||
tree._applyFilterImpl.apply(tree, tree.lastFilterArgs);
|
||||
}
|
||||
});
|
||||
},
|
||||
nodeSetExpanded: function (ctx, flag, callOpts) {
|
||||
var node = ctx.node;
|
||||
|
||||
delete node._filterAutoExpanded;
|
||||
// Make sure counter badge is displayed again, when node is beeing collapsed
|
||||
if (
|
||||
!flag &&
|
||||
ctx.options.filter.hideExpandedCounter &&
|
||||
node.$subMatchBadge
|
||||
) {
|
||||
node.$subMatchBadge.show();
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
nodeRenderStatus: function (ctx) {
|
||||
// Set classes for current status
|
||||
var res,
|
||||
node = ctx.node,
|
||||
tree = ctx.tree,
|
||||
opts = ctx.options.filter,
|
||||
$title = $(node.span).find("span.fancytree-title"),
|
||||
$span = $(node[tree.statusClassPropName]),
|
||||
enhanceTitle = ctx.options.enhanceTitle,
|
||||
escapeTitles = ctx.options.escapeTitles;
|
||||
|
||||
res = this._super(ctx);
|
||||
// nothing to do, if node was not yet rendered
|
||||
if (!$span.length || !tree.enableFilter) {
|
||||
return res;
|
||||
}
|
||||
$span
|
||||
.toggleClass("fancytree-match", !!node.match)
|
||||
.toggleClass("fancytree-submatch", !!node.subMatchCount)
|
||||
.toggleClass(
|
||||
"fancytree-hide",
|
||||
!(node.match || node.subMatchCount)
|
||||
);
|
||||
// Add/update counter badge
|
||||
if (
|
||||
opts.counter &&
|
||||
node.subMatchCount &&
|
||||
(!node.isExpanded() || !opts.hideExpandedCounter)
|
||||
) {
|
||||
if (!node.$subMatchBadge) {
|
||||
node.$subMatchBadge = $(
|
||||
"<span class='fancytree-childcounter'/>"
|
||||
);
|
||||
$(
|
||||
"span.fancytree-icon, span.fancytree-custom-icon",
|
||||
node.span
|
||||
).append(node.$subMatchBadge);
|
||||
}
|
||||
node.$subMatchBadge.show().text(node.subMatchCount);
|
||||
} else if (node.$subMatchBadge) {
|
||||
node.$subMatchBadge.hide();
|
||||
}
|
||||
// node.debug("nodeRenderStatus", node.titleWithHighlight, node.title)
|
||||
// #601: also check for $title.length, because we don't need to render
|
||||
// if node.span is null (i.e. not rendered)
|
||||
if (node.span && (!node.isEditing || !node.isEditing.call(node))) {
|
||||
if (node.titleWithHighlight) {
|
||||
$title.html(node.titleWithHighlight);
|
||||
} else if (escapeTitles) {
|
||||
$title.text(node.title);
|
||||
} else {
|
||||
$title.html(node.title);
|
||||
}
|
||||
if (enhanceTitle) {
|
||||
enhanceTitle(
|
||||
{ type: "enhanceTitle" },
|
||||
{ node: node, $title: $title }
|
||||
);
|
||||
}
|
||||
}
|
||||
return res;
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,674 @@
|
|||
/*!
|
||||
* jquery.fancytree.fixed.js
|
||||
*
|
||||
* Add fixed colums and headers to ext.table.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
// Allow to use multiple var statements inside a function
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define([
|
||||
"jquery",
|
||||
"./jquery.fancytree",
|
||||
"./jquery.fancytree.table",
|
||||
], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree.table"); // core + table
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "fixed",
|
||||
version: "0.0.1",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
fixCol: 1,
|
||||
fixColWidths: null,
|
||||
fixRows: true,
|
||||
scrollSpeed: 50,
|
||||
resizable: true,
|
||||
classNames: {
|
||||
table: "fancytree-ext-fixed",
|
||||
wrapper: "fancytree-ext-fixed-wrapper",
|
||||
topLeft: "fancytree-ext-fixed-wrapper-tl",
|
||||
topRight: "fancytree-ext-fixed-wrapper-tr",
|
||||
bottomLeft: "fancytree-ext-fixed-wrapper-bl",
|
||||
bottomRight: "fancytree-ext-fixed-wrapper-br",
|
||||
hidden: "fancytree-ext-fixed-hidden",
|
||||
counterpart: "fancytree-ext-fixed-node-counterpart",
|
||||
scrollBorderBottom: "fancytree-ext-fixed-scroll-border-bottom",
|
||||
scrollBorderRight: "fancytree-ext-fixed-scroll-border-right",
|
||||
hover: "fancytree-ext-fixed-hover",
|
||||
},
|
||||
},
|
||||
// Overide virtual methods for this extension.
|
||||
// `this` : is this extension object
|
||||
// `this._super`: the virtual function that was overriden (member of prev. extension or Fancytree)
|
||||
treeInit: function (ctx) {
|
||||
this._requireExtension("table", true, true);
|
||||
// 'fixed' requires the table extension to be loaded before itself
|
||||
|
||||
var res = this._superApply(arguments),
|
||||
tree = ctx.tree,
|
||||
options = this.options.fixed,
|
||||
fcn = this.options.fixed.classNames,
|
||||
$table = tree.widget.element,
|
||||
fixedColCount = options.fixCols,
|
||||
fixedRowCount = options.fixRows,
|
||||
$tableWrapper = $table.parent(),
|
||||
$topLeftWrapper = $("<div>").addClass(fcn.topLeft),
|
||||
$topRightWrapper = $("<div>").addClass(fcn.topRight),
|
||||
$bottomLeftWrapper = $("<div>").addClass(fcn.bottomLeft),
|
||||
$bottomRightWrapper = $("<div>").addClass(fcn.bottomRight),
|
||||
tableStyle = $table.attr("style"),
|
||||
tableClass = $table.attr("class"),
|
||||
$topLeftTable = $("<table>")
|
||||
.attr("style", tableStyle)
|
||||
.attr("class", tableClass),
|
||||
$topRightTable = $("<table>")
|
||||
.attr("style", tableStyle)
|
||||
.attr("class", tableClass),
|
||||
$bottomLeftTable = $table,
|
||||
$bottomRightTable = $("<table>")
|
||||
.attr("style", tableStyle)
|
||||
.attr("class", tableClass),
|
||||
$head = $table.find("thead"),
|
||||
$colgroup = $table.find("colgroup"),
|
||||
headRowCount = $head.find("tr").length;
|
||||
|
||||
this.$fixedWrapper = $tableWrapper;
|
||||
$table.addClass(fcn.table);
|
||||
$tableWrapper.addClass(fcn.wrapper);
|
||||
$bottomRightTable.append($("<tbody>"));
|
||||
|
||||
if ($colgroup.length) {
|
||||
$colgroup.remove();
|
||||
}
|
||||
|
||||
if (typeof fixedRowCount === "boolean") {
|
||||
fixedRowCount = fixedRowCount ? headRowCount : 0;
|
||||
} else {
|
||||
fixedRowCount = Math.max(
|
||||
0,
|
||||
Math.min(fixedRowCount, headRowCount)
|
||||
);
|
||||
}
|
||||
|
||||
if (fixedRowCount) {
|
||||
$topLeftTable.append($head.clone(true));
|
||||
$topRightTable.append($head.clone(true));
|
||||
$head.remove();
|
||||
}
|
||||
|
||||
$topLeftTable.find("tr").each(function (idx) {
|
||||
$(this).find("th").slice(fixedColCount).remove();
|
||||
});
|
||||
|
||||
$topRightTable.find("tr").each(function (idx) {
|
||||
$(this).find("th").slice(0, fixedColCount).remove();
|
||||
});
|
||||
|
||||
this.$fixedWrapper = $tableWrapper;
|
||||
|
||||
$tableWrapper.append(
|
||||
$topLeftWrapper.append($topLeftTable),
|
||||
$topRightWrapper.append($topRightTable),
|
||||
$bottomLeftWrapper.append($bottomLeftTable),
|
||||
$bottomRightWrapper.append($bottomRightTable)
|
||||
);
|
||||
|
||||
$bottomRightTable.on("keydown", function (evt) {
|
||||
var node = tree.focusNode,
|
||||
ctx = tree._makeHookContext(node || tree, evt),
|
||||
res = tree._callHook("nodeKeydown", ctx);
|
||||
return res;
|
||||
});
|
||||
|
||||
$bottomRightTable.on("click dblclick", "tr", function (evt) {
|
||||
var $trLeft = $(this),
|
||||
$trRight = $trLeft.data(fcn.counterpart),
|
||||
node = $.ui.fancytree.getNode($trRight),
|
||||
ctx = tree._makeHookContext(node, evt),
|
||||
et = $.ui.fancytree.getEventTarget(evt),
|
||||
prevPhase = tree.phase;
|
||||
|
||||
try {
|
||||
tree.phase = "userEvent";
|
||||
switch (evt.type) {
|
||||
case "click":
|
||||
ctx.targetType = et.type;
|
||||
if (node.isPagingNode()) {
|
||||
return (
|
||||
tree._triggerNodeEvent(
|
||||
"clickPaging",
|
||||
ctx,
|
||||
evt
|
||||
) === true
|
||||
);
|
||||
}
|
||||
return tree._triggerNodeEvent("click", ctx, evt) ===
|
||||
false
|
||||
? false
|
||||
: tree._callHook("nodeClick", ctx);
|
||||
case "dblclick":
|
||||
ctx.targetType = et.type;
|
||||
return tree._triggerNodeEvent(
|
||||
"dblclick",
|
||||
ctx,
|
||||
evt
|
||||
) === false
|
||||
? false
|
||||
: tree._callHook("nodeDblclick", ctx);
|
||||
}
|
||||
} finally {
|
||||
tree.phase = prevPhase;
|
||||
}
|
||||
});
|
||||
|
||||
$tableWrapper
|
||||
.on(
|
||||
"mouseenter",
|
||||
"." +
|
||||
fcn.bottomRight +
|
||||
" table tr, ." +
|
||||
fcn.bottomLeft +
|
||||
" table tr",
|
||||
function (evt) {
|
||||
var $tr = $(this),
|
||||
$trOther = $tr.data(fcn.counterpart);
|
||||
$tr.addClass(fcn.hover);
|
||||
$trOther.addClass(fcn.hover);
|
||||
}
|
||||
)
|
||||
.on(
|
||||
"mouseleave",
|
||||
"." +
|
||||
fcn.bottomRight +
|
||||
" table tr, ." +
|
||||
fcn.bottomLeft +
|
||||
" table tr",
|
||||
function (evt) {
|
||||
var $tr = $(this),
|
||||
$trOther = $tr.data(fcn.counterpart);
|
||||
$tr.removeClass(fcn.hover);
|
||||
$trOther.removeClass(fcn.hover);
|
||||
}
|
||||
);
|
||||
|
||||
$bottomLeftWrapper.on(
|
||||
"mousewheel DOMMouseScroll",
|
||||
function (event) {
|
||||
var $this = $(this),
|
||||
newScroll = $this.scrollTop(),
|
||||
scrollUp =
|
||||
event.originalEvent.wheelDelta > 0 ||
|
||||
event.originalEvent.detail < 0;
|
||||
|
||||
newScroll += scrollUp
|
||||
? -options.scrollSpeed
|
||||
: options.scrollSpeed;
|
||||
$this.scrollTop(newScroll);
|
||||
$bottomRightWrapper.scrollTop(newScroll);
|
||||
event.preventDefault();
|
||||
}
|
||||
);
|
||||
|
||||
$bottomRightWrapper.scroll(function () {
|
||||
var $this = $(this),
|
||||
scrollLeft = $this.scrollLeft(),
|
||||
scrollTop = $this.scrollTop();
|
||||
|
||||
$topLeftWrapper
|
||||
.toggleClass(fcn.scrollBorderBottom, scrollTop > 0)
|
||||
.toggleClass(fcn.scrollBorderRight, scrollLeft > 0);
|
||||
$topRightWrapper
|
||||
.toggleClass(fcn.scrollBorderBottom, scrollTop > 0)
|
||||
.scrollLeft(scrollLeft);
|
||||
$bottomLeftWrapper
|
||||
.toggleClass(fcn.scrollBorderRight, scrollLeft > 0)
|
||||
.scrollTop(scrollTop);
|
||||
});
|
||||
|
||||
$.ui.fancytree.overrideMethod(
|
||||
$.ui.fancytree._FancytreeNodeClass.prototype,
|
||||
"scrollIntoView",
|
||||
function (effects, options) {
|
||||
var $prevContainer = tree.$container;
|
||||
tree.$container = $bottomRightWrapper;
|
||||
return this._super
|
||||
.apply(this, arguments)
|
||||
.always(function () {
|
||||
tree.$container = $prevContainer;
|
||||
});
|
||||
}
|
||||
);
|
||||
return res;
|
||||
},
|
||||
|
||||
treeLoad: function (ctx) {
|
||||
var self = this,
|
||||
res = this._superApply(arguments);
|
||||
|
||||
res.done(function () {
|
||||
self.ext.fixed._adjustLayout.call(self);
|
||||
if (self.options.fixed.resizable) {
|
||||
self.ext.fixed._makeTableResizable();
|
||||
}
|
||||
});
|
||||
return res;
|
||||
},
|
||||
|
||||
_makeTableResizable: function () {
|
||||
var $wrapper = this.$fixedWrapper,
|
||||
fcn = this.options.fixed.classNames,
|
||||
$topLeftWrapper = $wrapper.find("div." + fcn.topLeft),
|
||||
$topRightWrapper = $wrapper.find("div." + fcn.topRight),
|
||||
$bottomLeftWrapper = $wrapper.find("div." + fcn.bottomLeft),
|
||||
$bottomRightWrapper = $wrapper.find("div." + fcn.bottomRight);
|
||||
|
||||
function _makeResizable($table) {
|
||||
$table.resizable({
|
||||
handles: "e",
|
||||
resize: function (evt, ui) {
|
||||
var width = Math.max($table.width(), ui.size.width);
|
||||
$bottomLeftWrapper.css("width", width);
|
||||
$topLeftWrapper.css("width", width);
|
||||
$bottomRightWrapper.css("left", width);
|
||||
$topRightWrapper.css("left", width);
|
||||
},
|
||||
stop: function () {
|
||||
$table.css("width", "100%");
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
_makeResizable($topLeftWrapper.find("table"));
|
||||
_makeResizable($bottomLeftWrapper.find("table"));
|
||||
},
|
||||
|
||||
/* Called by nodeRender to sync node order with tag order.*/
|
||||
// nodeFixOrder: function(ctx) {
|
||||
// },
|
||||
|
||||
nodeLoadChildren: function (ctx, source) {
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
|
||||
nodeRemoveChildMarkup: function (ctx) {
|
||||
var node = ctx.node;
|
||||
|
||||
function _removeChild(elem) {
|
||||
var i,
|
||||
child,
|
||||
children = elem.children;
|
||||
if (children) {
|
||||
for (i = 0; i < children.length; i++) {
|
||||
child = children[i];
|
||||
if (child.trRight) {
|
||||
$(child.trRight).remove();
|
||||
}
|
||||
_removeChild(child);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
_removeChild(node);
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
|
||||
nodeRemoveMarkup: function (ctx) {
|
||||
var node = ctx.node;
|
||||
|
||||
if (node.trRight) {
|
||||
$(node.trRight).remove();
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
|
||||
nodeSetActive: function (ctx, flag, callOpts) {
|
||||
var node = ctx.node,
|
||||
cn = this.options._classNames;
|
||||
|
||||
if (node.trRight) {
|
||||
$(node.trRight)
|
||||
.toggleClass(cn.active, flag)
|
||||
.toggleClass(cn.focused, flag);
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
|
||||
nodeKeydown: function (ctx) {
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
|
||||
nodeSetFocus: function (ctx, flag) {
|
||||
var node = ctx.node,
|
||||
cn = this.options._classNames;
|
||||
|
||||
if (node.trRight) {
|
||||
$(node.trRight).toggleClass(cn.focused, flag);
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
|
||||
nodeRender: function (ctx, force, deep, collapsed, _recursive) {
|
||||
var res = this._superApply(arguments),
|
||||
node = ctx.node,
|
||||
isRootNode = !node.parent;
|
||||
|
||||
if (!isRootNode && this.$fixedWrapper) {
|
||||
var $trLeft = $(node.tr),
|
||||
fcn = this.options.fixed.classNames,
|
||||
$trRight = $trLeft.data(fcn.counterpart);
|
||||
|
||||
if (!$trRight && $trLeft.length) {
|
||||
var idx = $trLeft.index(),
|
||||
fixedColCount = this.options.fixed.fixCols,
|
||||
$blTableBody = this.$fixedWrapper.find(
|
||||
"div." + fcn.bottomLeft + " table tbody"
|
||||
),
|
||||
$brTableBody = this.$fixedWrapper.find(
|
||||
"div." + fcn.bottomRight + " table tbody"
|
||||
),
|
||||
$prevLeftNode = $blTableBody
|
||||
.find("tr")
|
||||
.eq(Math.max(idx + 1, 0)),
|
||||
prevRightNode = $prevLeftNode.data(fcn.counterpart);
|
||||
|
||||
$trRight = $trLeft.clone(true);
|
||||
var trRight = $trRight.get(0);
|
||||
|
||||
if (prevRightNode) {
|
||||
$(prevRightNode).before($trRight);
|
||||
} else {
|
||||
$brTableBody.append($trRight);
|
||||
}
|
||||
$trRight.show();
|
||||
trRight.ftnode = node;
|
||||
node.trRight = trRight;
|
||||
|
||||
$trLeft.find("td").slice(fixedColCount).remove();
|
||||
$trRight.find("td").slice(0, fixedColCount).remove();
|
||||
$trLeft.data(fcn.counterpart, $trRight);
|
||||
$trRight.data(fcn.counterpart, $trLeft);
|
||||
}
|
||||
}
|
||||
|
||||
return res;
|
||||
},
|
||||
|
||||
nodeRenderTitle: function (ctx, title) {
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
|
||||
nodeRenderStatus: function (ctx) {
|
||||
var res = this._superApply(arguments),
|
||||
node = ctx.node;
|
||||
|
||||
if (node.trRight) {
|
||||
var $trRight = $(node.trRight),
|
||||
$trLeft = $(node.tr),
|
||||
fcn = this.options.fixed.classNames,
|
||||
hovering = $trRight.hasClass(fcn.hover),
|
||||
trClasses = $trLeft.attr("class");
|
||||
|
||||
$trRight.attr("class", trClasses);
|
||||
if (hovering) {
|
||||
$trRight.addClass(fcn.hover);
|
||||
$trLeft.addClass(fcn.hover);
|
||||
}
|
||||
}
|
||||
return res;
|
||||
},
|
||||
|
||||
nodeSetExpanded: function (ctx, flag, callOpts) {
|
||||
var res,
|
||||
self = this,
|
||||
node = ctx.node,
|
||||
$leftTr = $(node.tr),
|
||||
fcn = this.options.fixed.classNames,
|
||||
cn = this.options._classNames,
|
||||
$rightTr = $leftTr.data(fcn.counterpart);
|
||||
|
||||
flag = typeof flag === "undefined" ? true : flag;
|
||||
|
||||
if (!$rightTr) {
|
||||
return this._superApply(arguments);
|
||||
}
|
||||
$rightTr.toggleClass(cn.expanded, !!flag);
|
||||
if (flag && !node.isExpanded()) {
|
||||
res = this._superApply(arguments);
|
||||
res.done(function () {
|
||||
node.visit(function (child) {
|
||||
var $trLeft = $(child.tr),
|
||||
$trRight = $trLeft.data(fcn.counterpart);
|
||||
|
||||
self.ext.fixed._adjustRowHeight($trLeft, $trRight);
|
||||
if (!child.expanded) {
|
||||
return "skip";
|
||||
}
|
||||
});
|
||||
|
||||
self.ext.fixed._adjustColWidths();
|
||||
self.ext.fixed._adjustWrapperLayout();
|
||||
});
|
||||
} else if (!flag && node.isExpanded()) {
|
||||
node.visit(function (child) {
|
||||
var $trLeft = $(child.tr),
|
||||
$trRight = $trLeft.data(fcn.counterpart);
|
||||
if ($trRight) {
|
||||
if (!child.expanded) {
|
||||
return "skip";
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
self.ext.fixed._adjustColWidths();
|
||||
self.ext.fixed._adjustWrapperLayout();
|
||||
res = this._superApply(arguments);
|
||||
} else {
|
||||
res = this._superApply(arguments);
|
||||
}
|
||||
return res;
|
||||
},
|
||||
|
||||
nodeSetStatus: function (ctx, status, message, details) {
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
|
||||
treeClear: function (ctx) {
|
||||
var tree = ctx.tree,
|
||||
$table = tree.widget.element,
|
||||
$wrapper = this.$fixedWrapper,
|
||||
fcn = this.options.fixed.classNames;
|
||||
|
||||
$table.find("tr, td, th, thead").removeClass(fcn.hidden).css({
|
||||
"min-width": "auto",
|
||||
height: "auto",
|
||||
});
|
||||
$wrapper.empty().append($table);
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
|
||||
treeRegisterNode: function (ctx, add, node) {
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
|
||||
treeDestroy: function (ctx) {
|
||||
var tree = ctx.tree,
|
||||
$table = tree.widget.element,
|
||||
$wrapper = this.$fixedWrapper,
|
||||
fcn = this.options.fixed.classNames;
|
||||
|
||||
$table.find("tr, td, th, thead").removeClass(fcn.hidden).css({
|
||||
"min-width": "auto",
|
||||
height: "auto",
|
||||
});
|
||||
$wrapper.empty().append($table);
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
|
||||
_adjustColWidths: function () {
|
||||
if (this.options.fixed.adjustColWidths) {
|
||||
this.options.fixed.adjustColWidths.call(this);
|
||||
return;
|
||||
}
|
||||
|
||||
var $wrapper = this.$fixedWrapper,
|
||||
fcn = this.options.fixed.classNames,
|
||||
$tlWrapper = $wrapper.find("div." + fcn.topLeft),
|
||||
$blWrapper = $wrapper.find("div." + fcn.bottomLeft),
|
||||
$trWrapper = $wrapper.find("div." + fcn.topRight),
|
||||
$brWrapper = $wrapper.find("div." + fcn.bottomRight);
|
||||
|
||||
function _adjust($topWrapper, $bottomWrapper) {
|
||||
var $trTop = $topWrapper.find("thead tr").first(),
|
||||
$trBottom = $bottomWrapper.find("tbody tr").first();
|
||||
|
||||
$trTop.find("th").each(function (idx) {
|
||||
var $thTop = $(this),
|
||||
$tdBottom = $trBottom.find("td").eq(idx),
|
||||
thTopWidth = $thTop.width(),
|
||||
thTopOuterWidth = $thTop.outerWidth(),
|
||||
tdBottomWidth = $tdBottom.width(),
|
||||
tdBottomOuterWidth = $tdBottom.outerWidth(),
|
||||
newWidth = Math.max(
|
||||
thTopOuterWidth,
|
||||
tdBottomOuterWidth
|
||||
);
|
||||
|
||||
$thTop.css(
|
||||
"min-width",
|
||||
newWidth - (thTopOuterWidth - thTopWidth)
|
||||
);
|
||||
$tdBottom.css(
|
||||
"min-width",
|
||||
newWidth - (tdBottomOuterWidth - tdBottomWidth)
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
_adjust($tlWrapper, $blWrapper);
|
||||
_adjust($trWrapper, $brWrapper);
|
||||
},
|
||||
|
||||
_adjustRowHeight: function ($tr1, $tr2) {
|
||||
var fcn = this.options.fixed.classNames;
|
||||
if (!$tr2) {
|
||||
$tr2 = $tr1.data(fcn.counterpart);
|
||||
}
|
||||
$tr1.css("height", "auto");
|
||||
$tr2.css("height", "auto");
|
||||
var row1Height = $tr1.outerHeight(),
|
||||
row2Height = $tr2.outerHeight(),
|
||||
newHeight = Math.max(row1Height, row2Height);
|
||||
$tr1.css("height", newHeight + 1);
|
||||
$tr2.css("height", newHeight + 1);
|
||||
},
|
||||
|
||||
_adjustWrapperLayout: function () {
|
||||
var $wrapper = this.$fixedWrapper,
|
||||
fcn = this.options.fixed.classNames,
|
||||
$topLeftWrapper = $wrapper.find("div." + fcn.topLeft),
|
||||
$topRightWrapper = $wrapper.find("div." + fcn.topRight),
|
||||
$bottomLeftWrapper = $wrapper.find("div." + fcn.bottomLeft),
|
||||
$bottomRightWrapper = $wrapper.find("div." + fcn.bottomRight),
|
||||
$topLeftTable = $topLeftWrapper.find("table"),
|
||||
$topRightTable = $topRightWrapper.find("table"),
|
||||
// $bottomLeftTable = $bottomLeftWrapper.find("table"),
|
||||
wrapperWidth = $wrapper.width(),
|
||||
wrapperHeight = $wrapper.height(),
|
||||
fixedWidth = Math.min(wrapperWidth, $topLeftTable.width()),
|
||||
fixedHeight = Math.min(
|
||||
wrapperHeight,
|
||||
Math.max($topLeftTable.height(), $topRightTable.height())
|
||||
);
|
||||
// vScrollbar = $bottomRightWrapper.get(0).scrollHeight > (wrapperHeight - fixedHeight),
|
||||
// hScrollbar = $bottomRightWrapper.get(0).scrollWidth > (wrapperWidth - fixedWidth);
|
||||
|
||||
$topLeftWrapper.css({
|
||||
width: fixedWidth,
|
||||
height: fixedHeight,
|
||||
});
|
||||
$topRightWrapper.css({
|
||||
// width: wrapperWidth - fixedWidth - (vScrollbar ? 17 : 0),
|
||||
// width: "calc(100% - " + (fixedWidth + (vScrollbar ? 17 : 0)) + "px)",
|
||||
width: "calc(100% - " + (fixedWidth + 17) + "px)",
|
||||
height: fixedHeight,
|
||||
left: fixedWidth,
|
||||
});
|
||||
$bottomLeftWrapper.css({
|
||||
width: fixedWidth,
|
||||
// height: vScrollbar ? wrapperHeight - fixedHeight - (hScrollbar ? 17 : 0) : "auto",
|
||||
// height: vScrollbar ? ("calc(100% - " + (fixedHeight + (hScrollbar ? 17 : 0)) + "px)") : "auto",
|
||||
// height: vScrollbar ? ("calc(100% - " + (fixedHeight + 17) + "px)") : "auto",
|
||||
height: "calc(100% - " + (fixedHeight + 17) + "px)",
|
||||
top: fixedHeight,
|
||||
});
|
||||
$bottomRightWrapper.css({
|
||||
// width: wrapperWidth - fixedWidth,
|
||||
// height: vScrollbar ? wrapperHeight - fixedHeight : "auto",
|
||||
width: "calc(100% - " + fixedWidth + "px)",
|
||||
// height: vScrollbar ? ("calc(100% - " + fixedHeight + "px)") : "auto",
|
||||
height: "calc(100% - " + fixedHeight + "px)",
|
||||
top: fixedHeight,
|
||||
left: fixedWidth,
|
||||
});
|
||||
},
|
||||
|
||||
_adjustLayout: function () {
|
||||
var self = this,
|
||||
$wrapper = this.$fixedWrapper,
|
||||
fcn = this.options.fixed.classNames,
|
||||
$topLeftWrapper = $wrapper.find("div." + fcn.topLeft),
|
||||
$topRightWrapper = $wrapper.find("div." + fcn.topRight),
|
||||
$bottomLeftWrapper = $wrapper.find("div." + fcn.bottomLeft);
|
||||
// $bottomRightWrapper = $wrapper.find("div." + fcn.bottomRight)
|
||||
|
||||
$topLeftWrapper.find("table tr").each(function (idx) {
|
||||
var $trRight = $topRightWrapper.find("tr").eq(idx);
|
||||
self.ext.fixed._adjustRowHeight($(this), $trRight);
|
||||
});
|
||||
|
||||
$bottomLeftWrapper
|
||||
.find("table tbody")
|
||||
.find("tr")
|
||||
.each(function (idx) {
|
||||
// var $trRight = $bottomRightWrapper.find("tbody").find("tr").eq(idx);
|
||||
self.ext.fixed._adjustRowHeight($(this));
|
||||
});
|
||||
|
||||
self.ext.fixed._adjustColWidths.call(this);
|
||||
self.ext.fixed._adjustWrapperLayout.call(this);
|
||||
},
|
||||
|
||||
// treeSetFocus: function(ctx, flag) {
|
||||
//// alert("treeSetFocus" + ctx.tree.$container);
|
||||
// ctx.tree.$container.focus();
|
||||
// $.ui.fancytree.focusTree = ctx.tree;
|
||||
// }
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,354 @@
|
|||
/*!
|
||||
* jquery.fancytree.glyph.js
|
||||
*
|
||||
* Use glyph-fonts, ligature-fonts, or SVG icons instead of icon sprites.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
|
||||
var FT = $.ui.fancytree,
|
||||
PRESETS = {
|
||||
awesome3: {
|
||||
// Outdated!
|
||||
_addClass: "",
|
||||
checkbox: "icon-check-empty",
|
||||
checkboxSelected: "icon-check",
|
||||
checkboxUnknown: "icon-check icon-muted",
|
||||
dragHelper: "icon-caret-right",
|
||||
dropMarker: "icon-caret-right",
|
||||
error: "icon-exclamation-sign",
|
||||
expanderClosed: "icon-caret-right",
|
||||
expanderLazy: "icon-angle-right",
|
||||
expanderOpen: "icon-caret-down",
|
||||
loading: "icon-refresh icon-spin",
|
||||
nodata: "icon-meh",
|
||||
noExpander: "",
|
||||
radio: "icon-circle-blank",
|
||||
radioSelected: "icon-circle",
|
||||
// radioUnknown: "icon-circle icon-muted",
|
||||
// Default node icons.
|
||||
// (Use tree.options.icon callback to define custom icons based on node data)
|
||||
doc: "icon-file-alt",
|
||||
docOpen: "icon-file-alt",
|
||||
folder: "icon-folder-close-alt",
|
||||
folderOpen: "icon-folder-open-alt",
|
||||
},
|
||||
awesome4: {
|
||||
_addClass: "fa",
|
||||
checkbox: "fa-square-o",
|
||||
checkboxSelected: "fa-check-square-o",
|
||||
checkboxUnknown: "fa-square fancytree-helper-indeterminate-cb",
|
||||
dragHelper: "fa-arrow-right",
|
||||
dropMarker: "fa-long-arrow-right",
|
||||
error: "fa-warning",
|
||||
expanderClosed: "fa-caret-right",
|
||||
expanderLazy: "fa-angle-right",
|
||||
expanderOpen: "fa-caret-down",
|
||||
// We may prevent wobbling rotations on FF by creating a separate sub element:
|
||||
loading: { html: "<span class='fa fa-spinner fa-pulse' />" },
|
||||
nodata: "fa-meh-o",
|
||||
noExpander: "",
|
||||
radio: "fa-circle-thin", // "fa-circle-o"
|
||||
radioSelected: "fa-circle",
|
||||
// radioUnknown: "fa-dot-circle-o",
|
||||
// Default node icons.
|
||||
// (Use tree.options.icon callback to define custom icons based on node data)
|
||||
doc: "fa-file-o",
|
||||
docOpen: "fa-file-o",
|
||||
folder: "fa-folder-o",
|
||||
folderOpen: "fa-folder-open-o",
|
||||
},
|
||||
awesome5: {
|
||||
// fontawesome 5 have several different base classes
|
||||
// "far, fas, fal and fab" The rendered svg puts that prefix
|
||||
// in a different location so we have to keep them separate here
|
||||
_addClass: "",
|
||||
checkbox: "far fa-square",
|
||||
checkboxSelected: "far fa-check-square",
|
||||
// checkboxUnknown: "far fa-window-close",
|
||||
checkboxUnknown:
|
||||
"fas fa-square fancytree-helper-indeterminate-cb",
|
||||
radio: "far fa-circle",
|
||||
radioSelected: "fas fa-circle",
|
||||
radioUnknown: "far fa-dot-circle",
|
||||
dragHelper: "fas fa-arrow-right",
|
||||
dropMarker: "fas fa-long-arrow-alt-right",
|
||||
error: "fas fa-exclamation-triangle",
|
||||
expanderClosed: "fas fa-caret-right",
|
||||
expanderLazy: "fas fa-angle-right",
|
||||
expanderOpen: "fas fa-caret-down",
|
||||
loading: "fas fa-spinner fa-pulse",
|
||||
nodata: "far fa-meh",
|
||||
noExpander: "",
|
||||
// Default node icons.
|
||||
// (Use tree.options.icon callback to define custom icons based on node data)
|
||||
doc: "far fa-file",
|
||||
docOpen: "far fa-file",
|
||||
folder: "far fa-folder",
|
||||
folderOpen: "far fa-folder-open",
|
||||
},
|
||||
bootstrap3: {
|
||||
_addClass: "glyphicon",
|
||||
checkbox: "glyphicon-unchecked",
|
||||
checkboxSelected: "glyphicon-check",
|
||||
checkboxUnknown:
|
||||
"glyphicon-expand fancytree-helper-indeterminate-cb", // "glyphicon-share",
|
||||
dragHelper: "glyphicon-play",
|
||||
dropMarker: "glyphicon-arrow-right",
|
||||
error: "glyphicon-warning-sign",
|
||||
expanderClosed: "glyphicon-menu-right", // glyphicon-plus-sign
|
||||
expanderLazy: "glyphicon-menu-right", // glyphicon-plus-sign
|
||||
expanderOpen: "glyphicon-menu-down", // glyphicon-minus-sign
|
||||
loading: "glyphicon-refresh fancytree-helper-spin",
|
||||
nodata: "glyphicon-info-sign",
|
||||
noExpander: "",
|
||||
radio: "glyphicon-remove-circle", // "glyphicon-unchecked",
|
||||
radioSelected: "glyphicon-ok-circle", // "glyphicon-check",
|
||||
// radioUnknown: "glyphicon-ban-circle",
|
||||
// Default node icons.
|
||||
// (Use tree.options.icon callback to define custom icons based on node data)
|
||||
doc: "glyphicon-file",
|
||||
docOpen: "glyphicon-file",
|
||||
folder: "glyphicon-folder-close",
|
||||
folderOpen: "glyphicon-folder-open",
|
||||
},
|
||||
material: {
|
||||
_addClass: "material-icons",
|
||||
checkbox: { text: "check_box_outline_blank" },
|
||||
checkboxSelected: { text: "check_box" },
|
||||
checkboxUnknown: { text: "indeterminate_check_box" },
|
||||
dragHelper: { text: "play_arrow" },
|
||||
dropMarker: { text: "arrow-forward" },
|
||||
error: { text: "warning" },
|
||||
expanderClosed: { text: "chevron_right" },
|
||||
expanderLazy: { text: "last_page" },
|
||||
expanderOpen: { text: "expand_more" },
|
||||
loading: {
|
||||
text: "autorenew",
|
||||
addClass: "fancytree-helper-spin",
|
||||
},
|
||||
nodata: { text: "info" },
|
||||
noExpander: { text: "" },
|
||||
radio: { text: "radio_button_unchecked" },
|
||||
radioSelected: { text: "radio_button_checked" },
|
||||
// Default node icons.
|
||||
// (Use tree.options.icon callback to define custom icons based on node data)
|
||||
doc: { text: "insert_drive_file" },
|
||||
docOpen: { text: "insert_drive_file" },
|
||||
folder: { text: "folder" },
|
||||
folderOpen: { text: "folder_open" },
|
||||
},
|
||||
};
|
||||
|
||||
function setIcon(node, span, baseClass, opts, type) {
|
||||
var map = opts.map,
|
||||
icon = map[type],
|
||||
$span = $(span),
|
||||
$counter = $span.find(".fancytree-childcounter"),
|
||||
setClass = baseClass + " " + (map._addClass || "");
|
||||
|
||||
// #871 Allow a callback
|
||||
if (typeof icon === "function") {
|
||||
icon = icon.call(this, node, span, type);
|
||||
}
|
||||
// node.debug( "setIcon(" + baseClass + ", " + type + "): " + "oldIcon" + " -> " + icon );
|
||||
// #871: propsed this, but I am not sure how robust this is, e.g.
|
||||
// the prefix (fas, far) class changes are not considered?
|
||||
// if (span.tagName === "svg" && opts.preset === "awesome5") {
|
||||
// // fa5 script converts <i> to <svg> so call a specific handler.
|
||||
// var oldIcon = "fa-" + $span.data("icon");
|
||||
// // node.debug( "setIcon(" + baseClass + ", " + type + "): " + oldIcon + " -> " + icon );
|
||||
// if (typeof oldIcon === "string") {
|
||||
// $span.removeClass(oldIcon);
|
||||
// }
|
||||
// if (typeof icon === "string") {
|
||||
// $span.addClass(icon);
|
||||
// }
|
||||
// return;
|
||||
// }
|
||||
if (typeof icon === "string") {
|
||||
// #883: remove inner html that may be added by prev. mode
|
||||
span.innerHTML = "";
|
||||
$span.attr("class", setClass + " " + icon).append($counter);
|
||||
} else if (icon) {
|
||||
if (icon.text) {
|
||||
span.textContent = "" + icon.text;
|
||||
} else if (icon.html) {
|
||||
span.innerHTML = icon.html;
|
||||
} else {
|
||||
span.innerHTML = "";
|
||||
}
|
||||
$span
|
||||
.attr("class", setClass + " " + (icon.addClass || ""))
|
||||
.append($counter);
|
||||
}
|
||||
}
|
||||
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "glyph",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
preset: null, // 'awesome3', 'awesome4', 'bootstrap3', 'material'
|
||||
map: {},
|
||||
},
|
||||
|
||||
treeInit: function (ctx) {
|
||||
var tree = ctx.tree,
|
||||
opts = ctx.options.glyph;
|
||||
|
||||
if (opts.preset) {
|
||||
FT.assert(
|
||||
!!PRESETS[opts.preset],
|
||||
"Invalid value for `options.glyph.preset`: " + opts.preset
|
||||
);
|
||||
opts.map = $.extend({}, PRESETS[opts.preset], opts.map);
|
||||
} else {
|
||||
tree.warn("ext-glyph: missing `preset` option.");
|
||||
}
|
||||
this._superApply(arguments);
|
||||
tree.$container.addClass("fancytree-ext-glyph");
|
||||
},
|
||||
nodeRenderStatus: function (ctx) {
|
||||
var checkbox,
|
||||
icon,
|
||||
res,
|
||||
span,
|
||||
node = ctx.node,
|
||||
$span = $(node.span),
|
||||
opts = ctx.options.glyph;
|
||||
|
||||
res = this._super(ctx);
|
||||
|
||||
if (node.isRootNode()) {
|
||||
return res;
|
||||
}
|
||||
span = $span.children(".fancytree-expander").get(0);
|
||||
if (span) {
|
||||
// if( node.isLoading() ){
|
||||
// icon = "loading";
|
||||
if (node.expanded && node.hasChildren()) {
|
||||
icon = "expanderOpen";
|
||||
} else if (node.isUndefined()) {
|
||||
icon = "expanderLazy";
|
||||
} else if (node.hasChildren()) {
|
||||
icon = "expanderClosed";
|
||||
} else {
|
||||
icon = "noExpander";
|
||||
}
|
||||
// span.className = "fancytree-expander " + map[icon];
|
||||
setIcon(node, span, "fancytree-expander", opts, icon);
|
||||
}
|
||||
|
||||
if (node.tr) {
|
||||
span = $("td", node.tr).find(".fancytree-checkbox").get(0);
|
||||
} else {
|
||||
span = $span.children(".fancytree-checkbox").get(0);
|
||||
}
|
||||
if (span) {
|
||||
checkbox = FT.evalOption("checkbox", node, node, opts, false);
|
||||
if (
|
||||
(node.parent && node.parent.radiogroup) ||
|
||||
checkbox === "radio"
|
||||
) {
|
||||
icon = node.selected ? "radioSelected" : "radio";
|
||||
setIcon(
|
||||
node,
|
||||
span,
|
||||
"fancytree-checkbox fancytree-radio",
|
||||
opts,
|
||||
icon
|
||||
);
|
||||
} else {
|
||||
// eslint-disable-next-line no-nested-ternary
|
||||
icon = node.selected
|
||||
? "checkboxSelected"
|
||||
: node.partsel
|
||||
? "checkboxUnknown"
|
||||
: "checkbox";
|
||||
// span.className = "fancytree-checkbox " + map[icon];
|
||||
setIcon(node, span, "fancytree-checkbox", opts, icon);
|
||||
}
|
||||
}
|
||||
|
||||
// Standard icon (note that this does not match .fancytree-custom-icon,
|
||||
// that might be set by opts.icon callbacks)
|
||||
span = $span.children(".fancytree-icon").get(0);
|
||||
if (span) {
|
||||
if (node.statusNodeType) {
|
||||
icon = node.statusNodeType; // loading, error
|
||||
} else if (node.folder) {
|
||||
icon =
|
||||
node.expanded && node.hasChildren()
|
||||
? "folderOpen"
|
||||
: "folder";
|
||||
} else {
|
||||
icon = node.expanded ? "docOpen" : "doc";
|
||||
}
|
||||
setIcon(node, span, "fancytree-icon", opts, icon);
|
||||
}
|
||||
return res;
|
||||
},
|
||||
nodeSetStatus: function (ctx, status, message, details) {
|
||||
var res,
|
||||
span,
|
||||
opts = ctx.options.glyph,
|
||||
node = ctx.node;
|
||||
|
||||
res = this._superApply(arguments);
|
||||
|
||||
if (
|
||||
status === "error" ||
|
||||
status === "loading" ||
|
||||
status === "nodata"
|
||||
) {
|
||||
if (node.parent) {
|
||||
span = $(".fancytree-expander", node.span).get(0);
|
||||
if (span) {
|
||||
setIcon(node, span, "fancytree-expander", opts, status);
|
||||
}
|
||||
} else {
|
||||
//
|
||||
span = $(
|
||||
".fancytree-statusnode-" + status,
|
||||
node[this.nodeContainerAttrName]
|
||||
)
|
||||
.find(".fancytree-icon")
|
||||
.get(0);
|
||||
if (span) {
|
||||
setIcon(node, span, "fancytree-icon", opts, status);
|
||||
}
|
||||
}
|
||||
}
|
||||
return res;
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
File diff suppressed because it is too large
Load diff
|
|
@ -0,0 +1,218 @@
|
|||
/*!
|
||||
* jquery.fancytree.gridnav.js
|
||||
*
|
||||
* Support keyboard navigation for trees with embedded input controls.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define([
|
||||
"jquery",
|
||||
"./jquery.fancytree",
|
||||
"./jquery.fancytree.table",
|
||||
], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree.table"); // core + table
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/*******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
|
||||
// Allow these navigation keys even when input controls are focused
|
||||
|
||||
var KC = $.ui.keyCode,
|
||||
// which keys are *not* handled by embedded control, but passed to tree
|
||||
// navigation handler:
|
||||
NAV_KEYS = {
|
||||
text: [KC.UP, KC.DOWN],
|
||||
checkbox: [KC.UP, KC.DOWN, KC.LEFT, KC.RIGHT],
|
||||
link: [KC.UP, KC.DOWN, KC.LEFT, KC.RIGHT],
|
||||
radiobutton: [KC.UP, KC.DOWN, KC.LEFT, KC.RIGHT],
|
||||
"select-one": [KC.LEFT, KC.RIGHT],
|
||||
"select-multiple": [KC.LEFT, KC.RIGHT],
|
||||
};
|
||||
|
||||
/* Calculate TD column index (considering colspans).*/
|
||||
function getColIdx($tr, $td) {
|
||||
var colspan,
|
||||
td = $td.get(0),
|
||||
idx = 0;
|
||||
|
||||
$tr.children().each(function () {
|
||||
if (this === td) {
|
||||
return false;
|
||||
}
|
||||
colspan = $(this).prop("colspan");
|
||||
idx += colspan ? colspan : 1;
|
||||
});
|
||||
return idx;
|
||||
}
|
||||
|
||||
/* Find TD at given column index (considering colspans).*/
|
||||
function findTdAtColIdx($tr, colIdx) {
|
||||
var colspan,
|
||||
res = null,
|
||||
idx = 0;
|
||||
|
||||
$tr.children().each(function () {
|
||||
if (idx >= colIdx) {
|
||||
res = $(this);
|
||||
return false;
|
||||
}
|
||||
colspan = $(this).prop("colspan");
|
||||
idx += colspan ? colspan : 1;
|
||||
});
|
||||
return res;
|
||||
}
|
||||
|
||||
/* Find adjacent cell for a given direction. Skip empty cells and consider merged cells */
|
||||
function findNeighbourTd($target, keyCode) {
|
||||
var $tr,
|
||||
colIdx,
|
||||
$td = $target.closest("td"),
|
||||
$tdNext = null;
|
||||
|
||||
switch (keyCode) {
|
||||
case KC.LEFT:
|
||||
$tdNext = $td.prev();
|
||||
break;
|
||||
case KC.RIGHT:
|
||||
$tdNext = $td.next();
|
||||
break;
|
||||
case KC.UP:
|
||||
case KC.DOWN:
|
||||
$tr = $td.parent();
|
||||
colIdx = getColIdx($tr, $td);
|
||||
while (true) {
|
||||
$tr = keyCode === KC.UP ? $tr.prev() : $tr.next();
|
||||
if (!$tr.length) {
|
||||
break;
|
||||
}
|
||||
// Skip hidden rows
|
||||
if ($tr.is(":hidden")) {
|
||||
continue;
|
||||
}
|
||||
// Find adjacent cell in the same column
|
||||
$tdNext = findTdAtColIdx($tr, colIdx);
|
||||
// Skip cells that don't conatain a focusable element
|
||||
if ($tdNext && $tdNext.find(":input,a").length) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
break;
|
||||
}
|
||||
return $tdNext;
|
||||
}
|
||||
|
||||
/*******************************************************************************
|
||||
* Extension code
|
||||
*/
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "gridnav",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
autofocusInput: false, // Focus first embedded input if node gets activated
|
||||
handleCursorKeys: true, // Allow UP/DOWN in inputs to move to prev/next node
|
||||
},
|
||||
|
||||
treeInit: function (ctx) {
|
||||
// gridnav requires the table extension to be loaded before itself
|
||||
this._requireExtension("table", true, true);
|
||||
this._superApply(arguments);
|
||||
|
||||
this.$container.addClass("fancytree-ext-gridnav");
|
||||
|
||||
// Activate node if embedded input gets focus (due to a click)
|
||||
this.$container.on("focusin", function (event) {
|
||||
var ctx2,
|
||||
node = $.ui.fancytree.getNode(event.target);
|
||||
|
||||
if (node && !node.isActive()) {
|
||||
// Call node.setActive(), but also pass the event
|
||||
ctx2 = ctx.tree._makeHookContext(node, event);
|
||||
ctx.tree._callHook("nodeSetActive", ctx2, true);
|
||||
}
|
||||
});
|
||||
},
|
||||
nodeSetActive: function (ctx, flag, callOpts) {
|
||||
var $outer,
|
||||
opts = ctx.options.gridnav,
|
||||
node = ctx.node,
|
||||
event = ctx.originalEvent || {},
|
||||
triggeredByInput = $(event.target).is(":input");
|
||||
|
||||
flag = flag !== false;
|
||||
|
||||
this._superApply(arguments);
|
||||
|
||||
if (flag) {
|
||||
if (ctx.options.titlesTabbable) {
|
||||
if (!triggeredByInput) {
|
||||
$(node.span).find("span.fancytree-title").focus();
|
||||
node.setFocus();
|
||||
}
|
||||
// If one node is tabbable, the container no longer needs to be
|
||||
ctx.tree.$container.attr("tabindex", "-1");
|
||||
// ctx.tree.$container.removeAttr("tabindex");
|
||||
} else if (opts.autofocusInput && !triggeredByInput) {
|
||||
// Set focus to input sub input (if node was clicked, but not
|
||||
// when TAB was pressed )
|
||||
$outer = $(node.tr || node.span);
|
||||
$outer.find(":input:enabled").first().focus();
|
||||
}
|
||||
}
|
||||
},
|
||||
nodeKeydown: function (ctx) {
|
||||
var inputType,
|
||||
handleKeys,
|
||||
$td,
|
||||
opts = ctx.options.gridnav,
|
||||
event = ctx.originalEvent,
|
||||
$target = $(event.target);
|
||||
|
||||
if ($target.is(":input:enabled")) {
|
||||
inputType = $target.prop("type");
|
||||
} else if ($target.is("a")) {
|
||||
inputType = "link";
|
||||
}
|
||||
// ctx.tree.debug("ext-gridnav nodeKeydown", event, inputType);
|
||||
|
||||
if (inputType && opts.handleCursorKeys) {
|
||||
handleKeys = NAV_KEYS[inputType];
|
||||
if (handleKeys && $.inArray(event.which, handleKeys) >= 0) {
|
||||
$td = findNeighbourTd($target, event.which);
|
||||
if ($td && $td.length) {
|
||||
// ctx.node.debug("ignore keydown in input", event.which, handleKeys);
|
||||
$td.find(":input:enabled,a").focus();
|
||||
// Prevent Fancytree default navigation
|
||||
return false;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
// ctx.tree.debug("ext-gridnav NOT HANDLED", event, inputType);
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
7374
plugins/55/indexmenu/scripts/fancytree/modules/jquery.fancytree.js
Normal file
7374
plugins/55/indexmenu/scripts/fancytree/modules/jquery.fancytree.js
Normal file
File diff suppressed because it is too large
Load diff
|
|
@ -0,0 +1,309 @@
|
|||
/*!
|
||||
* jquery.fancytree.logger.js
|
||||
*
|
||||
* Miscellaneous debug extensions.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
var i,
|
||||
FT = $.ui.fancytree,
|
||||
PREFIX = "ft-logger: ",
|
||||
logLine = window.console.log,
|
||||
// HOOK_NAMES = "nodeClick nodeCollapseSiblings".split(" "),
|
||||
TREE_EVENT_NAMES =
|
||||
"beforeRestore beforeUpdateViewport blurTree create init focusTree preInit restore updateViewport".split(
|
||||
" "
|
||||
),
|
||||
NODE_EVENT_NAMES =
|
||||
"activate activateCell beforeActivate beforeExpand beforeSelect blur click collapse createNode dblclick deactivate defaultGridAction expand enhanceTitle focus keydown keypress lazyLoad loadChildren loadError modifyChild postProcess renderNode renderTitle select".split(
|
||||
" "
|
||||
),
|
||||
EVENT_NAMES = TREE_EVENT_NAMES.concat(NODE_EVENT_NAMES),
|
||||
// HOOK_NAME_MAP = {},
|
||||
EVENT_NAME_MAP = {};
|
||||
|
||||
/*
|
||||
*/
|
||||
// for (i = 0; i < HOOK_NAMES.length; i++) {
|
||||
// HOOK_NAME_MAP[HOOK_NAMES[i]] = true;
|
||||
// }
|
||||
for (i = 0; i < EVENT_NAMES.length; i++) {
|
||||
EVENT_NAME_MAP[EVENT_NAMES[i]] = true;
|
||||
}
|
||||
|
||||
function getBrowserInfo() {
|
||||
var n = navigator.appName,
|
||||
ua = navigator.userAgent,
|
||||
tem,
|
||||
m = ua.match(
|
||||
/(opera|chrome|safari|firefox|msie)\/?\s*(\.?\d+(\.\d+)*)/i
|
||||
);
|
||||
|
||||
if (m && (tem = ua.match(/version\/([.\d]+)/i)) !== null) {
|
||||
m[2] = tem[1];
|
||||
}
|
||||
m = m ? [m[1], m[2]] : [n, navigator.appVersion, "-?"];
|
||||
return m.join(", ");
|
||||
}
|
||||
|
||||
function logEvent(event, data) {
|
||||
var res,
|
||||
self = this,
|
||||
// logName = PREFIX + "event." + event.type,
|
||||
opts = data.options.logger,
|
||||
tree = data.tree,
|
||||
// widget = data.widget,
|
||||
obj = data.node || tree,
|
||||
logName = PREFIX + "event." + event.type + " (" + obj + ")";
|
||||
|
||||
if (
|
||||
!opts.traceEvents ||
|
||||
(opts.traceEvents !== true && $.inArray(name, opts.traceEvents) < 0)
|
||||
) {
|
||||
return self._super.apply(self, arguments);
|
||||
}
|
||||
if (
|
||||
(self._super && opts.timings === true) ||
|
||||
(opts.timings && $.inArray(name, opts.timings) >= 0)
|
||||
) {
|
||||
// if( name === "nodeRender" ) { logName += obj; } // allow timing for recursive calls
|
||||
// logName += " (" + obj + ")";
|
||||
window.console.time(logName);
|
||||
res = self._super.apply(self, arguments);
|
||||
window.console.timeEnd(logName);
|
||||
} else {
|
||||
// obj.info(logName, data);
|
||||
logLine(logName, event, data);
|
||||
res = self._super.apply(self, arguments);
|
||||
}
|
||||
return res;
|
||||
}
|
||||
|
||||
function logHook(name, this_, args, extra) {
|
||||
var res,
|
||||
ctx = args[0],
|
||||
opts = ctx.options.logger,
|
||||
obj = ctx.node || ctx.tree,
|
||||
logName = PREFIX + "hook." + name + " (" + obj + ")";
|
||||
|
||||
if (
|
||||
!opts.traceHooks ||
|
||||
(opts.traceHooks !== true && $.inArray(name, opts.traceHooks) < 0)
|
||||
) {
|
||||
return this_._superApply.call(this_, args);
|
||||
}
|
||||
if (
|
||||
opts.timings === true ||
|
||||
(opts.timings && $.inArray(name, opts.timings) >= 0)
|
||||
) {
|
||||
// if( name === "nodeRender" ) { logName += obj; } // allow timing for recursive calls
|
||||
// logName += " (" + obj + ")";
|
||||
window.console.time(logName);
|
||||
res = this_._superApply.call(this_, args);
|
||||
window.console.timeEnd(logName);
|
||||
} else {
|
||||
if (extra) {
|
||||
// obj.info(logName, extra, ctx);
|
||||
logLine(logName, extra, ctx);
|
||||
} else {
|
||||
// obj.info(logName, ctx);
|
||||
logLine(logName, ctx);
|
||||
}
|
||||
res = this_._superApply.call(this_, args);
|
||||
}
|
||||
return res;
|
||||
}
|
||||
|
||||
/******************************************************************************
|
||||
* Extension code
|
||||
*/
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "logger",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
logTarget: null, // optional redirect logging to this <div> tag
|
||||
traceEvents: true, // `true`or list of hook names
|
||||
traceUnhandledEvents: false,
|
||||
traceHooks: false, // `true`or list of event names
|
||||
timings: false, // `true`or list of event names
|
||||
},
|
||||
// Overide virtual methods for this extension.
|
||||
// `this` : is this Fancytree object
|
||||
// `this._super`: the virtual function that was overridden (member of prev. extension or Fancytree)
|
||||
treeCreate: function (ctx) {
|
||||
var tree = ctx.tree,
|
||||
opts = ctx.options;
|
||||
|
||||
if (
|
||||
this.options.extensions[this.options.extensions.length - 1] !==
|
||||
"logger"
|
||||
) {
|
||||
throw Error(
|
||||
"Fancytree 'logger' extension must be listed as last entry."
|
||||
);
|
||||
}
|
||||
tree.warn(
|
||||
"Fancytree logger extension is enabled (this may be slow).",
|
||||
opts.logger
|
||||
);
|
||||
|
||||
tree.debug(
|
||||
"Fancytree v" +
|
||||
$.ui.fancytree.version +
|
||||
", buildType='" +
|
||||
$.ui.fancytree.buildType +
|
||||
"'"
|
||||
);
|
||||
tree.debug(
|
||||
"jQuery UI " +
|
||||
jQuery.ui.version +
|
||||
" (uiBackCompat=" +
|
||||
$.uiBackCompat +
|
||||
")"
|
||||
);
|
||||
tree.debug("jQuery " + jQuery.fn.jquery);
|
||||
tree.debug("Browser: " + getBrowserInfo());
|
||||
|
||||
function _log(event, data) {
|
||||
logLine(
|
||||
PREFIX + "event." + event.type + " (unhandled)",
|
||||
event,
|
||||
data
|
||||
);
|
||||
}
|
||||
$.each(EVENT_NAMES, function (i, name) {
|
||||
if (typeof opts[name] === "function") {
|
||||
// tree.info(PREFIX + "override '" + name + "' event");
|
||||
$.ui.fancytree.overrideMethod(
|
||||
opts,
|
||||
name,
|
||||
logEvent,
|
||||
ctx.widget
|
||||
);
|
||||
} else if (opts.logger.traceUnhandledEvents) {
|
||||
opts[name] = _log;
|
||||
}
|
||||
});
|
||||
|
||||
return logHook("treeCreate", this, arguments);
|
||||
},
|
||||
nodeClick: function (ctx) {
|
||||
return logHook(
|
||||
"nodeClick",
|
||||
this,
|
||||
arguments,
|
||||
FT.eventToString(ctx.originalEvent)
|
||||
);
|
||||
},
|
||||
nodeCollapseSiblings: function (ctx) {
|
||||
return logHook("nodeCollapseSiblings", this, arguments);
|
||||
},
|
||||
nodeDblclick: function (ctx) {
|
||||
return logHook("nodeDblclick", this, arguments);
|
||||
},
|
||||
nodeKeydown: function (ctx) {
|
||||
return logHook(
|
||||
"nodeKeydown",
|
||||
this,
|
||||
arguments,
|
||||
FT.eventToString(ctx.originalEvent)
|
||||
);
|
||||
},
|
||||
nodeLoadChildren: function (ctx, source) {
|
||||
return logHook("nodeLoadChildren", this, arguments);
|
||||
},
|
||||
nodeRemoveChildMarkup: function (ctx) {
|
||||
return logHook("nodeRemoveChildMarkup", this, arguments);
|
||||
},
|
||||
nodeRemoveMarkup: function (ctx) {
|
||||
return logHook("nodeRemoveMarkup", this, arguments);
|
||||
},
|
||||
nodeRender: function (ctx, force, deep, collapsed, _recursive) {
|
||||
return logHook("nodeRender", this, arguments);
|
||||
},
|
||||
nodeRenderStatus: function (ctx) {
|
||||
return logHook("nodeRenderStatus", this, arguments);
|
||||
},
|
||||
nodeRenderTitle: function (ctx, title) {
|
||||
return logHook("nodeRenderTitle", this, arguments);
|
||||
},
|
||||
nodeSetActive: function (ctx, flag, callOpts) {
|
||||
return logHook("nodeSetActive", this, arguments);
|
||||
},
|
||||
nodeSetExpanded: function (ctx, flag, callOpts) {
|
||||
return logHook("nodeSetExpanded", this, arguments);
|
||||
},
|
||||
nodeSetFocus: function (ctx) {
|
||||
return logHook("nodeSetFocus", this, arguments);
|
||||
},
|
||||
nodeSetSelected: function (ctx, flag, callOpts) {
|
||||
return logHook("nodeSetSelected", this, arguments);
|
||||
},
|
||||
nodeSetStatus: function (ctx, status, message, details) {
|
||||
return logHook("nodeSetStatus", this, arguments);
|
||||
},
|
||||
nodeToggleExpanded: function (ctx) {
|
||||
return logHook("nodeToggleExpanded", this, arguments);
|
||||
},
|
||||
nodeToggleSelected: function (ctx) {
|
||||
return logHook("nodeToggleSelected", this, arguments);
|
||||
},
|
||||
treeClear: function (ctx) {
|
||||
return logHook("treeClear", this, arguments);
|
||||
},
|
||||
// treeCreate: function(ctx) {
|
||||
// return logHook("treeCreate", this, arguments);
|
||||
// },
|
||||
treeDestroy: function (ctx) {
|
||||
return logHook("treeDestroy", this, arguments);
|
||||
},
|
||||
treeInit: function (ctx) {
|
||||
return logHook("treeInit", this, arguments);
|
||||
},
|
||||
treeLoad: function (ctx, source) {
|
||||
return logHook("treeLoad", this, arguments);
|
||||
},
|
||||
treeRegisterNode: function (ctx, add, node) {
|
||||
return logHook("treeRegisterNode", this, arguments);
|
||||
},
|
||||
treeSetFocus: function (ctx, flag, callOpts) {
|
||||
return logHook("treeSetFocus", this, arguments);
|
||||
},
|
||||
treeSetOption: function (ctx, key, value) {
|
||||
return logHook("treeSetOption", this, arguments);
|
||||
},
|
||||
treeStructureChanged: function (ctx, type) {
|
||||
return logHook("treeStructureChanged", this, arguments);
|
||||
},
|
||||
});
|
||||
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,185 @@
|
|||
/*!
|
||||
* jquery.fancytree.menu.js
|
||||
*
|
||||
* Enable jQuery UI Menu as context menu for tree nodes.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* @see http://api.jqueryui.com/menu/
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "menu",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
enable: true,
|
||||
selector: null, //
|
||||
position: {}, //
|
||||
// Events:
|
||||
create: $.noop, //
|
||||
beforeOpen: $.noop, //
|
||||
open: $.noop, //
|
||||
focus: $.noop, //
|
||||
select: $.noop, //
|
||||
close: $.noop, //
|
||||
},
|
||||
// Override virtual methods for this extension.
|
||||
// `this` : is this extension object
|
||||
// `this._base` : the Fancytree instance
|
||||
// `this._super`: the virtual function that was overridden (member of prev. extension or Fancytree)
|
||||
treeInit: function (ctx) {
|
||||
var opts = ctx.options,
|
||||
tree = ctx.tree;
|
||||
|
||||
this._superApply(arguments);
|
||||
|
||||
// Prepare an object that will be passed with menu events
|
||||
tree.ext.menu.data = {
|
||||
tree: tree,
|
||||
node: null,
|
||||
$menu: null,
|
||||
menuId: null,
|
||||
};
|
||||
|
||||
// tree.$container[0].oncontextmenu = function() {return false;};
|
||||
// Replace the standard browser context menu with out own
|
||||
tree.$container.on(
|
||||
"contextmenu",
|
||||
"span.fancytree-node",
|
||||
function (event) {
|
||||
var node = $.ui.fancytree.getNode(event),
|
||||
ctx = {
|
||||
node: node,
|
||||
tree: node.tree,
|
||||
originalEvent: event,
|
||||
options: tree.options,
|
||||
};
|
||||
tree.ext.menu._openMenu(ctx);
|
||||
return false;
|
||||
}
|
||||
);
|
||||
|
||||
// Use jquery.ui.menu
|
||||
$(opts.menu.selector)
|
||||
.menu({
|
||||
create: function (event, ui) {
|
||||
tree.ext.menu.data.$menu = $(this).menu("widget");
|
||||
var data = $.extend({}, tree.ext.menu.data);
|
||||
opts.menu.create.call(tree, event, data);
|
||||
},
|
||||
focus: function (event, ui) {
|
||||
var data = $.extend({}, tree.ext.menu.data, {
|
||||
menuItem: ui.item,
|
||||
menuId: ui.item.find(">a").attr("href"),
|
||||
});
|
||||
opts.menu.focus.call(tree, event, data);
|
||||
},
|
||||
select: function (event, ui) {
|
||||
var data = $.extend({}, tree.ext.menu.data, {
|
||||
menuItem: ui.item,
|
||||
menuId: ui.item.find(">a").attr("href"),
|
||||
});
|
||||
if (
|
||||
opts.menu.select.call(tree, event, data) !== false
|
||||
) {
|
||||
tree.ext.menu._closeMenu(ctx);
|
||||
}
|
||||
},
|
||||
})
|
||||
.hide();
|
||||
},
|
||||
treeDestroy: function (ctx) {
|
||||
this._superApply(arguments);
|
||||
},
|
||||
_openMenu: function (ctx) {
|
||||
var data,
|
||||
tree = ctx.tree,
|
||||
opts = ctx.options,
|
||||
$menu = $(opts.menu.selector);
|
||||
|
||||
tree.ext.menu.data.node = ctx.node;
|
||||
data = $.extend({}, tree.ext.menu.data);
|
||||
|
||||
if (
|
||||
opts.menu.beforeOpen.call(tree, ctx.originalEvent, data) ===
|
||||
false
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
$(document)
|
||||
.on("keydown.fancytree", function (event) {
|
||||
if (event.which === $.ui.keyCode.ESCAPE) {
|
||||
tree.ext.menu._closeMenu(ctx);
|
||||
}
|
||||
})
|
||||
.on("mousedown.fancytree", function (event) {
|
||||
// Close menu when clicked outside menu
|
||||
if ($(event.target).closest(".ui-menu-item").length === 0) {
|
||||
tree.ext.menu._closeMenu(ctx);
|
||||
}
|
||||
});
|
||||
// $menu.position($.extend({my: "left top", at: "left bottom", of: event}, opts.menu.position));
|
||||
$menu
|
||||
.css("position", "absolute")
|
||||
.show()
|
||||
.position({
|
||||
my: "left top",
|
||||
at: "right top",
|
||||
of: ctx.originalEvent,
|
||||
collision: "fit",
|
||||
})
|
||||
.focus();
|
||||
|
||||
opts.menu.open.call(tree, ctx.originalEvent, data);
|
||||
},
|
||||
_closeMenu: function (ctx) {
|
||||
var $menu,
|
||||
tree = ctx.tree,
|
||||
opts = ctx.options,
|
||||
data = $.extend({}, tree.ext.menu.data);
|
||||
if (opts.menu.close.call(tree, ctx.originalEvent, data) === false) {
|
||||
return;
|
||||
}
|
||||
$menu = $(opts.menu.selector);
|
||||
$(document).off("keydown.fancytree, mousedown.fancytree");
|
||||
$menu.hide();
|
||||
tree.ext.menu.data.node = null;
|
||||
},
|
||||
// ,
|
||||
// nodeClick: function(ctx) {
|
||||
// var event = ctx.originalEvent;
|
||||
// if(event.which === 2 || (event.which === 1 && event.ctrlKey)){
|
||||
// event.preventDefault();
|
||||
// ctx.tree.ext.menu._openMenu(ctx);
|
||||
// return false;
|
||||
// }
|
||||
// this._superApply(arguments);
|
||||
// }
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,128 @@
|
|||
/*!
|
||||
* jquery.fancytree.multi.js
|
||||
*
|
||||
* Allow multiple selection of nodes by mouse or keyboard.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/*******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
|
||||
// var isMac = /Mac/.test(navigator.platform);
|
||||
|
||||
/*******************************************************************************
|
||||
* Extension code
|
||||
*/
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "multi",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
allowNoSelect: false, //
|
||||
mode: "sameParent", //
|
||||
// Events:
|
||||
// beforeSelect: $.noop // Return false to prevent cancel/save (data.input is available)
|
||||
},
|
||||
|
||||
treeInit: function (ctx) {
|
||||
this._superApply(arguments);
|
||||
this.$container.addClass("fancytree-ext-multi");
|
||||
if (ctx.options.selectMode === 1) {
|
||||
$.error(
|
||||
"Fancytree ext-multi: selectMode: 1 (single) is not compatible."
|
||||
);
|
||||
}
|
||||
},
|
||||
nodeClick: function (ctx) {
|
||||
var //pluginOpts = ctx.options.multi,
|
||||
tree = ctx.tree,
|
||||
node = ctx.node,
|
||||
activeNode = tree.getActiveNode() || tree.getFirstChild(),
|
||||
isCbClick = ctx.targetType === "checkbox",
|
||||
isExpanderClick = ctx.targetType === "expander",
|
||||
eventStr = $.ui.fancytree.eventToString(ctx.originalEvent);
|
||||
|
||||
switch (eventStr) {
|
||||
case "click":
|
||||
if (isExpanderClick) {
|
||||
break;
|
||||
} // Default handler will expand/collapse
|
||||
if (!isCbClick) {
|
||||
tree.selectAll(false);
|
||||
// Select clicked node (radio-button mode)
|
||||
node.setSelected();
|
||||
}
|
||||
// Default handler will toggle checkbox clicks and activate
|
||||
break;
|
||||
case "shift+click":
|
||||
// node.debug("click")
|
||||
tree.visitRows(
|
||||
function (n) {
|
||||
// n.debug("click2", n===node, node)
|
||||
n.setSelected();
|
||||
if (n === node) {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
{
|
||||
start: activeNode,
|
||||
reverse: activeNode.isBelowOf(node),
|
||||
}
|
||||
);
|
||||
break;
|
||||
case "ctrl+click":
|
||||
case "meta+click": // Mac: [Command]
|
||||
node.toggleSelected();
|
||||
return;
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
nodeKeydown: function (ctx) {
|
||||
var tree = ctx.tree,
|
||||
node = ctx.node,
|
||||
event = ctx.originalEvent,
|
||||
eventStr = $.ui.fancytree.eventToString(event);
|
||||
|
||||
switch (eventStr) {
|
||||
case "up":
|
||||
case "down":
|
||||
tree.selectAll(false);
|
||||
node.navigate(event.which, true);
|
||||
tree.getActiveNode().setSelected();
|
||||
break;
|
||||
case "shift+up":
|
||||
case "shift+down":
|
||||
node.navigate(event.which, true);
|
||||
tree.getActiveNode().setSelected();
|
||||
break;
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,503 @@
|
|||
/*!
|
||||
* jquery.fancytree.persist.js
|
||||
*
|
||||
* Persist tree status in cookiesRemove or highlight tree nodes, based on a filter.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* @depends: js-cookie or jquery-cookie
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
/* global Cookies:false */
|
||||
|
||||
/*******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
var cookieStore = null,
|
||||
localStorageStore = null,
|
||||
sessionStorageStore = null,
|
||||
_assert = $.ui.fancytree.assert,
|
||||
ACTIVE = "active",
|
||||
EXPANDED = "expanded",
|
||||
FOCUS = "focus",
|
||||
SELECTED = "selected";
|
||||
|
||||
// Accessing window.xxxStorage may raise security exceptions (see #1022)
|
||||
try {
|
||||
_assert(window.localStorage && window.localStorage.getItem);
|
||||
localStorageStore = {
|
||||
get: function (key) {
|
||||
return window.localStorage.getItem(key);
|
||||
},
|
||||
set: function (key, value) {
|
||||
window.localStorage.setItem(key, value);
|
||||
},
|
||||
remove: function (key) {
|
||||
window.localStorage.removeItem(key);
|
||||
},
|
||||
};
|
||||
} catch (e) {
|
||||
$.ui.fancytree.warn("Could not access window.localStorage", e);
|
||||
}
|
||||
|
||||
try {
|
||||
_assert(window.sessionStorage && window.sessionStorage.getItem);
|
||||
sessionStorageStore = {
|
||||
get: function (key) {
|
||||
return window.sessionStorage.getItem(key);
|
||||
},
|
||||
set: function (key, value) {
|
||||
window.sessionStorage.setItem(key, value);
|
||||
},
|
||||
remove: function (key) {
|
||||
window.sessionStorage.removeItem(key);
|
||||
},
|
||||
};
|
||||
} catch (e) {
|
||||
$.ui.fancytree.warn("Could not access window.sessionStorage", e);
|
||||
}
|
||||
|
||||
if (typeof Cookies === "function") {
|
||||
// Assume https://github.com/js-cookie/js-cookie
|
||||
cookieStore = {
|
||||
get: Cookies.get,
|
||||
set: function (key, value) {
|
||||
Cookies.set(key, value, this.options.persist.cookie);
|
||||
},
|
||||
remove: Cookies.remove,
|
||||
};
|
||||
} else if ($ && typeof $.cookie === "function") {
|
||||
// Fall back to https://github.com/carhartl/jquery-cookie
|
||||
cookieStore = {
|
||||
get: $.cookie,
|
||||
set: function (key, value) {
|
||||
$.cookie(key, value, this.options.persist.cookie);
|
||||
},
|
||||
remove: $.removeCookie,
|
||||
};
|
||||
}
|
||||
|
||||
/* Recursively load lazy nodes
|
||||
* @param {string} mode 'load', 'expand', false
|
||||
*/
|
||||
function _loadLazyNodes(tree, local, keyList, mode, dfd) {
|
||||
var i,
|
||||
key,
|
||||
l,
|
||||
node,
|
||||
foundOne = false,
|
||||
expandOpts = tree.options.persist.expandOpts,
|
||||
deferredList = [],
|
||||
missingKeyList = [];
|
||||
|
||||
keyList = keyList || [];
|
||||
dfd = dfd || $.Deferred();
|
||||
|
||||
for (i = 0, l = keyList.length; i < l; i++) {
|
||||
key = keyList[i];
|
||||
node = tree.getNodeByKey(key);
|
||||
if (node) {
|
||||
if (mode && node.isUndefined()) {
|
||||
foundOne = true;
|
||||
tree.debug(
|
||||
"_loadLazyNodes: " + node + " is lazy: loading..."
|
||||
);
|
||||
if (mode === "expand") {
|
||||
deferredList.push(node.setExpanded(true, expandOpts));
|
||||
} else {
|
||||
deferredList.push(node.load());
|
||||
}
|
||||
} else {
|
||||
tree.debug("_loadLazyNodes: " + node + " already loaded.");
|
||||
node.setExpanded(true, expandOpts);
|
||||
}
|
||||
} else {
|
||||
missingKeyList.push(key);
|
||||
tree.debug("_loadLazyNodes: " + node + " was not yet found.");
|
||||
}
|
||||
}
|
||||
|
||||
$.when.apply($, deferredList).always(function () {
|
||||
// All lazy-expands have finished
|
||||
if (foundOne && missingKeyList.length > 0) {
|
||||
// If we read new nodes from server, try to resolve yet-missing keys
|
||||
_loadLazyNodes(tree, local, missingKeyList, mode, dfd);
|
||||
} else {
|
||||
if (missingKeyList.length) {
|
||||
tree.warn(
|
||||
"_loadLazyNodes: could not load those keys: ",
|
||||
missingKeyList
|
||||
);
|
||||
for (i = 0, l = missingKeyList.length; i < l; i++) {
|
||||
key = keyList[i];
|
||||
local._appendKey(EXPANDED, keyList[i], false);
|
||||
}
|
||||
}
|
||||
dfd.resolve();
|
||||
}
|
||||
});
|
||||
return dfd;
|
||||
}
|
||||
|
||||
/**
|
||||
* [ext-persist] Remove persistence data of the given type(s).
|
||||
* Called like
|
||||
* $.ui.fancytree.getTree("#tree").clearCookies("active expanded focus selected");
|
||||
*
|
||||
* @alias Fancytree#clearPersistData
|
||||
* @requires jquery.fancytree.persist.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeClass.prototype.clearPersistData = function (
|
||||
types
|
||||
) {
|
||||
var local = this.ext.persist,
|
||||
prefix = local.cookiePrefix;
|
||||
|
||||
types = types || "active expanded focus selected";
|
||||
if (types.indexOf(ACTIVE) >= 0) {
|
||||
local._data(prefix + ACTIVE, null);
|
||||
}
|
||||
if (types.indexOf(EXPANDED) >= 0) {
|
||||
local._data(prefix + EXPANDED, null);
|
||||
}
|
||||
if (types.indexOf(FOCUS) >= 0) {
|
||||
local._data(prefix + FOCUS, null);
|
||||
}
|
||||
if (types.indexOf(SELECTED) >= 0) {
|
||||
local._data(prefix + SELECTED, null);
|
||||
}
|
||||
};
|
||||
|
||||
$.ui.fancytree._FancytreeClass.prototype.clearCookies = function (types) {
|
||||
this.warn(
|
||||
"'tree.clearCookies()' is deprecated since v2.27.0: use 'clearPersistData()' instead."
|
||||
);
|
||||
return this.clearPersistData(types);
|
||||
};
|
||||
|
||||
/**
|
||||
* [ext-persist] Return persistence information from cookies
|
||||
*
|
||||
* Called like
|
||||
* $.ui.fancytree.getTree("#tree").getPersistData();
|
||||
*
|
||||
* @alias Fancytree#getPersistData
|
||||
* @requires jquery.fancytree.persist.js
|
||||
*/
|
||||
$.ui.fancytree._FancytreeClass.prototype.getPersistData = function () {
|
||||
var local = this.ext.persist,
|
||||
prefix = local.cookiePrefix,
|
||||
delim = local.cookieDelimiter,
|
||||
res = {};
|
||||
|
||||
res[ACTIVE] = local._data(prefix + ACTIVE);
|
||||
res[EXPANDED] = (local._data(prefix + EXPANDED) || "").split(delim);
|
||||
res[SELECTED] = (local._data(prefix + SELECTED) || "").split(delim);
|
||||
res[FOCUS] = local._data(prefix + FOCUS);
|
||||
return res;
|
||||
};
|
||||
|
||||
/******************************************************************************
|
||||
* Extension code
|
||||
*/
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "persist",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
cookieDelimiter: "~",
|
||||
cookiePrefix: undefined, // 'fancytree-<treeId>-' by default
|
||||
cookie: {
|
||||
raw: false,
|
||||
expires: "",
|
||||
path: "",
|
||||
domain: "",
|
||||
secure: false,
|
||||
},
|
||||
expandLazy: false, // true: recursively expand and load lazy nodes
|
||||
expandOpts: undefined, // optional `opts` argument passed to setExpanded()
|
||||
fireActivate: true, // false: suppress `activate` event after active node was restored
|
||||
overrideSource: true, // true: cookie takes precedence over `source` data attributes.
|
||||
store: "auto", // 'cookie': force cookie, 'local': force localStore, 'session': force sessionStore
|
||||
types: "active expanded focus selected",
|
||||
},
|
||||
|
||||
/* Generic read/write string data to cookie, sessionStorage or localStorage. */
|
||||
_data: function (key, value) {
|
||||
var store = this._local.store;
|
||||
|
||||
if (value === undefined) {
|
||||
return store.get.call(this, key);
|
||||
} else if (value === null) {
|
||||
store.remove.call(this, key);
|
||||
} else {
|
||||
store.set.call(this, key, value);
|
||||
}
|
||||
},
|
||||
|
||||
/* Append `key` to a cookie. */
|
||||
_appendKey: function (type, key, flag) {
|
||||
key = "" + key; // #90
|
||||
var local = this._local,
|
||||
instOpts = this.options.persist,
|
||||
delim = instOpts.cookieDelimiter,
|
||||
cookieName = local.cookiePrefix + type,
|
||||
data = local._data(cookieName),
|
||||
keyList = data ? data.split(delim) : [],
|
||||
idx = $.inArray(key, keyList);
|
||||
// Remove, even if we add a key, so the key is always the last entry
|
||||
if (idx >= 0) {
|
||||
keyList.splice(idx, 1);
|
||||
}
|
||||
// Append key to cookie
|
||||
if (flag) {
|
||||
keyList.push(key);
|
||||
}
|
||||
local._data(cookieName, keyList.join(delim));
|
||||
},
|
||||
|
||||
treeInit: function (ctx) {
|
||||
var tree = ctx.tree,
|
||||
opts = ctx.options,
|
||||
local = this._local,
|
||||
instOpts = this.options.persist;
|
||||
|
||||
// // For 'auto' or 'cookie' mode, the cookie plugin must be available
|
||||
// _assert((instOpts.store !== "auto" && instOpts.store !== "cookie") || cookieStore,
|
||||
// "Missing required plugin for 'persist' extension: js.cookie.js or jquery.cookie.js");
|
||||
|
||||
local.cookiePrefix =
|
||||
instOpts.cookiePrefix || "fancytree-" + tree._id + "-";
|
||||
local.storeActive = instOpts.types.indexOf(ACTIVE) >= 0;
|
||||
local.storeExpanded = instOpts.types.indexOf(EXPANDED) >= 0;
|
||||
local.storeSelected = instOpts.types.indexOf(SELECTED) >= 0;
|
||||
local.storeFocus = instOpts.types.indexOf(FOCUS) >= 0;
|
||||
local.store = null;
|
||||
|
||||
if (instOpts.store === "auto") {
|
||||
instOpts.store = localStorageStore ? "local" : "cookie";
|
||||
}
|
||||
if ($.isPlainObject(instOpts.store)) {
|
||||
local.store = instOpts.store;
|
||||
} else if (instOpts.store === "cookie") {
|
||||
local.store = cookieStore;
|
||||
} else if (instOpts.store === "local") {
|
||||
local.store =
|
||||
instOpts.store === "local"
|
||||
? localStorageStore
|
||||
: sessionStorageStore;
|
||||
} else if (instOpts.store === "session") {
|
||||
local.store =
|
||||
instOpts.store === "local"
|
||||
? localStorageStore
|
||||
: sessionStorageStore;
|
||||
}
|
||||
_assert(local.store, "Need a valid store.");
|
||||
|
||||
// Bind init-handler to apply cookie state
|
||||
tree.$div.on("fancytreeinit", function (event) {
|
||||
if (
|
||||
tree._triggerTreeEvent("beforeRestore", null, {}) === false
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
var cookie,
|
||||
dfd,
|
||||
i,
|
||||
keyList,
|
||||
node,
|
||||
prevFocus = local._data(local.cookiePrefix + FOCUS), // record this before node.setActive() overrides it;
|
||||
noEvents = instOpts.fireActivate === false;
|
||||
|
||||
// tree.debug("document.cookie:", document.cookie);
|
||||
|
||||
cookie = local._data(local.cookiePrefix + EXPANDED);
|
||||
keyList = cookie && cookie.split(instOpts.cookieDelimiter);
|
||||
|
||||
if (local.storeExpanded) {
|
||||
// Recursively load nested lazy nodes if expandLazy is 'expand' or 'load'
|
||||
// Also remove expand-cookies for unmatched nodes
|
||||
dfd = _loadLazyNodes(
|
||||
tree,
|
||||
local,
|
||||
keyList,
|
||||
instOpts.expandLazy ? "expand" : false,
|
||||
null
|
||||
);
|
||||
} else {
|
||||
// nothing to do
|
||||
dfd = new $.Deferred().resolve();
|
||||
}
|
||||
|
||||
dfd.done(function () {
|
||||
if (local.storeSelected) {
|
||||
cookie = local._data(local.cookiePrefix + SELECTED);
|
||||
if (cookie) {
|
||||
keyList = cookie.split(instOpts.cookieDelimiter);
|
||||
for (i = 0; i < keyList.length; i++) {
|
||||
node = tree.getNodeByKey(keyList[i]);
|
||||
if (node) {
|
||||
if (
|
||||
node.selected === undefined ||
|
||||
(instOpts.overrideSource &&
|
||||
node.selected === false)
|
||||
) {
|
||||
// node.setSelected();
|
||||
node.selected = true;
|
||||
node.renderStatus();
|
||||
}
|
||||
} else {
|
||||
// node is no longer member of the tree: remove from cookie also
|
||||
local._appendKey(
|
||||
SELECTED,
|
||||
keyList[i],
|
||||
false
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
// In selectMode 3 we have to fix the child nodes, since we
|
||||
// only stored the selected *top* nodes
|
||||
if (tree.options.selectMode === 3) {
|
||||
tree.visit(function (n) {
|
||||
if (n.selected) {
|
||||
n.fixSelection3AfterClick();
|
||||
return "skip";
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
if (local.storeActive) {
|
||||
cookie = local._data(local.cookiePrefix + ACTIVE);
|
||||
if (
|
||||
cookie &&
|
||||
(opts.persist.overrideSource || !tree.activeNode)
|
||||
) {
|
||||
node = tree.getNodeByKey(cookie);
|
||||
if (node) {
|
||||
node.debug("persist: set active", cookie);
|
||||
// We only want to set the focus if the container
|
||||
// had the keyboard focus before
|
||||
node.setActive(true, {
|
||||
noFocus: true,
|
||||
noEvents: noEvents,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
if (local.storeFocus && prevFocus) {
|
||||
node = tree.getNodeByKey(prevFocus);
|
||||
if (node) {
|
||||
// node.debug("persist: set focus", cookie);
|
||||
if (tree.options.titlesTabbable) {
|
||||
$(node.span).find(".fancytree-title").focus();
|
||||
} else {
|
||||
$(tree.$container).focus();
|
||||
}
|
||||
// node.setFocus();
|
||||
}
|
||||
}
|
||||
tree._triggerTreeEvent("restore", null, {});
|
||||
});
|
||||
});
|
||||
// Init the tree
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
nodeSetActive: function (ctx, flag, callOpts) {
|
||||
var res,
|
||||
local = this._local;
|
||||
|
||||
flag = flag !== false;
|
||||
res = this._superApply(arguments);
|
||||
|
||||
if (local.storeActive) {
|
||||
local._data(
|
||||
local.cookiePrefix + ACTIVE,
|
||||
this.activeNode ? this.activeNode.key : null
|
||||
);
|
||||
}
|
||||
return res;
|
||||
},
|
||||
nodeSetExpanded: function (ctx, flag, callOpts) {
|
||||
var res,
|
||||
node = ctx.node,
|
||||
local = this._local;
|
||||
|
||||
flag = flag !== false;
|
||||
res = this._superApply(arguments);
|
||||
|
||||
if (local.storeExpanded) {
|
||||
local._appendKey(EXPANDED, node.key, flag);
|
||||
}
|
||||
return res;
|
||||
},
|
||||
nodeSetFocus: function (ctx, flag) {
|
||||
var res,
|
||||
local = this._local;
|
||||
|
||||
flag = flag !== false;
|
||||
res = this._superApply(arguments);
|
||||
|
||||
if (local.storeFocus) {
|
||||
local._data(
|
||||
local.cookiePrefix + FOCUS,
|
||||
this.focusNode ? this.focusNode.key : null
|
||||
);
|
||||
}
|
||||
return res;
|
||||
},
|
||||
nodeSetSelected: function (ctx, flag, callOpts) {
|
||||
var res,
|
||||
selNodes,
|
||||
tree = ctx.tree,
|
||||
node = ctx.node,
|
||||
local = this._local;
|
||||
|
||||
flag = flag !== false;
|
||||
res = this._superApply(arguments);
|
||||
|
||||
if (local.storeSelected) {
|
||||
if (tree.options.selectMode === 3) {
|
||||
// In selectMode 3 we only store the the selected *top* nodes.
|
||||
// De-selecting a node may also de-select some parents, so we
|
||||
// calculate the current status again
|
||||
selNodes = $.map(tree.getSelectedNodes(true), function (n) {
|
||||
return n.key;
|
||||
});
|
||||
selNodes = selNodes.join(
|
||||
ctx.options.persist.cookieDelimiter
|
||||
);
|
||||
local._data(local.cookiePrefix + SELECTED, selNodes);
|
||||
} else {
|
||||
// beforeSelect can prevent the change - flag doesn't reflect the node.selected state
|
||||
local._appendKey(SELECTED, node.key, node.selected);
|
||||
}
|
||||
}
|
||||
return res;
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,544 @@
|
|||
/*!
|
||||
* jquery.fancytree.table.js
|
||||
*
|
||||
* Render tree as table (aka 'tree grid', 'table tree').
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
var _assert = $.ui.fancytree.assert;
|
||||
|
||||
function insertFirstChild(referenceNode, newNode) {
|
||||
referenceNode.insertBefore(newNode, referenceNode.firstChild);
|
||||
}
|
||||
|
||||
function insertSiblingAfter(referenceNode, newNode) {
|
||||
referenceNode.parentNode.insertBefore(
|
||||
newNode,
|
||||
referenceNode.nextSibling
|
||||
);
|
||||
}
|
||||
|
||||
/* Show/hide all rows that are structural descendants of `parent`. */
|
||||
function setChildRowVisibility(parent, flag) {
|
||||
parent.visit(function (node) {
|
||||
var tr = node.tr;
|
||||
// currentFlag = node.hide ? false : flag; // fix for ext-filter
|
||||
if (tr) {
|
||||
tr.style.display = node.hide || !flag ? "none" : "";
|
||||
}
|
||||
if (!node.expanded) {
|
||||
return "skip";
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/* Find node that is rendered in previous row. */
|
||||
function findPrevRowNode(node) {
|
||||
var i,
|
||||
last,
|
||||
prev,
|
||||
parent = node.parent,
|
||||
siblings = parent ? parent.children : null;
|
||||
|
||||
if (siblings && siblings.length > 1 && siblings[0] !== node) {
|
||||
// use the lowest descendant of the preceeding sibling
|
||||
i = $.inArray(node, siblings);
|
||||
prev = siblings[i - 1];
|
||||
_assert(prev.tr);
|
||||
// descend to lowest child (with a <tr> tag)
|
||||
while (prev.children && prev.children.length) {
|
||||
last = prev.children[prev.children.length - 1];
|
||||
if (!last.tr) {
|
||||
break;
|
||||
}
|
||||
prev = last;
|
||||
}
|
||||
} else {
|
||||
// if there is no preceding sibling, use the direct parent
|
||||
prev = parent;
|
||||
}
|
||||
return prev;
|
||||
}
|
||||
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "table",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
checkboxColumnIdx: null, // render the checkboxes into the this column index (default: nodeColumnIdx)
|
||||
indentation: 16, // indent every node level by 16px
|
||||
mergeStatusColumns: true, // display 'nodata', 'loading', 'error' centered in a single, merged TR
|
||||
nodeColumnIdx: 0, // render node expander, icon, and title to this column (default: #0)
|
||||
},
|
||||
// Overide virtual methods for this extension.
|
||||
// `this` : is this extension object
|
||||
// `this._super`: the virtual function that was overriden (member of prev. extension or Fancytree)
|
||||
treeInit: function (ctx) {
|
||||
var i,
|
||||
n,
|
||||
$row,
|
||||
$tbody,
|
||||
tree = ctx.tree,
|
||||
opts = ctx.options,
|
||||
tableOpts = opts.table,
|
||||
$table = tree.widget.element;
|
||||
|
||||
if (tableOpts.customStatus != null) {
|
||||
if (opts.renderStatusColumns == null) {
|
||||
tree.warn(
|
||||
"The 'customStatus' option is deprecated since v2.15.0. Use 'renderStatusColumns' instead."
|
||||
);
|
||||
opts.renderStatusColumns = tableOpts.customStatus;
|
||||
} else {
|
||||
$.error(
|
||||
"The 'customStatus' option is deprecated since v2.15.0. Use 'renderStatusColumns' only instead."
|
||||
);
|
||||
}
|
||||
}
|
||||
if (opts.renderStatusColumns) {
|
||||
if (opts.renderStatusColumns === true) {
|
||||
opts.renderStatusColumns = opts.renderColumns;
|
||||
// } else if( opts.renderStatusColumns === "wide" ) {
|
||||
// opts.renderStatusColumns = _renderStatusNodeWide;
|
||||
}
|
||||
}
|
||||
|
||||
$table.addClass("fancytree-container fancytree-ext-table");
|
||||
$tbody = $table.find(">tbody");
|
||||
if (!$tbody.length) {
|
||||
// TODO: not sure if we can rely on browsers to insert missing <tbody> before <tr>s:
|
||||
if ($table.find(">tr").length) {
|
||||
$.error(
|
||||
"Expected table > tbody > tr. If you see this please open an issue."
|
||||
);
|
||||
}
|
||||
$tbody = $("<tbody>").appendTo($table);
|
||||
}
|
||||
|
||||
tree.tbody = $tbody[0];
|
||||
|
||||
// Prepare row templates:
|
||||
// Determine column count from table header if any
|
||||
tree.columnCount = $("thead >tr", $table)
|
||||
.last()
|
||||
.find(">th", $table).length;
|
||||
// Read TR templates from tbody if any
|
||||
$row = $tbody.children("tr").first();
|
||||
if ($row.length) {
|
||||
n = $row.children("td").length;
|
||||
if (tree.columnCount && n !== tree.columnCount) {
|
||||
tree.warn(
|
||||
"Column count mismatch between thead (" +
|
||||
tree.columnCount +
|
||||
") and tbody (" +
|
||||
n +
|
||||
"): using tbody."
|
||||
);
|
||||
tree.columnCount = n;
|
||||
}
|
||||
$row = $row.clone();
|
||||
} else {
|
||||
// Only thead is defined: create default row markup
|
||||
_assert(
|
||||
tree.columnCount >= 1,
|
||||
"Need either <thead> or <tbody> with <td> elements to determine column count."
|
||||
);
|
||||
$row = $("<tr />");
|
||||
for (i = 0; i < tree.columnCount; i++) {
|
||||
$row.append("<td />");
|
||||
}
|
||||
}
|
||||
$row.find(">td")
|
||||
.eq(tableOpts.nodeColumnIdx)
|
||||
.html("<span class='fancytree-node' />");
|
||||
if (opts.aria) {
|
||||
$row.attr("role", "row");
|
||||
$row.find("td").attr("role", "gridcell");
|
||||
}
|
||||
tree.rowFragment = document.createDocumentFragment();
|
||||
tree.rowFragment.appendChild($row.get(0));
|
||||
|
||||
// // If tbody contains a second row, use this as status node template
|
||||
// $row = $tbody.children("tr").eq(1);
|
||||
// if( $row.length === 0 ) {
|
||||
// tree.statusRowFragment = tree.rowFragment;
|
||||
// } else {
|
||||
// $row = $row.clone();
|
||||
// tree.statusRowFragment = document.createDocumentFragment();
|
||||
// tree.statusRowFragment.appendChild($row.get(0));
|
||||
// }
|
||||
//
|
||||
$tbody.empty();
|
||||
|
||||
// Make sure that status classes are set on the node's <tr> elements
|
||||
tree.statusClassPropName = "tr";
|
||||
tree.ariaPropName = "tr";
|
||||
this.nodeContainerAttrName = "tr";
|
||||
|
||||
// #489: make sure $container is set to <table>, even if ext-dnd is listed before ext-table
|
||||
tree.$container = $table;
|
||||
|
||||
this._superApply(arguments);
|
||||
|
||||
// standard Fancytree created a root UL
|
||||
$(tree.rootNode.ul).remove();
|
||||
tree.rootNode.ul = null;
|
||||
|
||||
// Add container to the TAB chain
|
||||
// #577: Allow to set tabindex to "0", "-1" and ""
|
||||
this.$container.attr("tabindex", opts.tabindex);
|
||||
// this.$container.attr("tabindex", opts.tabbable ? "0" : "-1");
|
||||
if (opts.aria) {
|
||||
tree.$container
|
||||
.attr("role", "treegrid")
|
||||
.attr("aria-readonly", true);
|
||||
}
|
||||
},
|
||||
nodeRemoveChildMarkup: function (ctx) {
|
||||
var node = ctx.node;
|
||||
// node.debug("nodeRemoveChildMarkup()");
|
||||
node.visit(function (n) {
|
||||
if (n.tr) {
|
||||
$(n.tr).remove();
|
||||
n.tr = null;
|
||||
}
|
||||
});
|
||||
},
|
||||
nodeRemoveMarkup: function (ctx) {
|
||||
var node = ctx.node;
|
||||
// node.debug("nodeRemoveMarkup()");
|
||||
if (node.tr) {
|
||||
$(node.tr).remove();
|
||||
node.tr = null;
|
||||
}
|
||||
this.nodeRemoveChildMarkup(ctx);
|
||||
},
|
||||
/* Override standard render. */
|
||||
nodeRender: function (ctx, force, deep, collapsed, _recursive) {
|
||||
var children,
|
||||
firstTr,
|
||||
i,
|
||||
l,
|
||||
newRow,
|
||||
prevNode,
|
||||
prevTr,
|
||||
subCtx,
|
||||
tree = ctx.tree,
|
||||
node = ctx.node,
|
||||
opts = ctx.options,
|
||||
isRootNode = !node.parent;
|
||||
|
||||
if (tree._enableUpdate === false) {
|
||||
// $.ui.fancytree.debug("*** nodeRender _enableUpdate: false");
|
||||
return;
|
||||
}
|
||||
if (!_recursive) {
|
||||
ctx.hasCollapsedParents = node.parent && !node.parent.expanded;
|
||||
}
|
||||
// $.ui.fancytree.debug("*** nodeRender " + node + ", isRoot=" + isRootNode, "tr=" + node.tr, "hcp=" + ctx.hasCollapsedParents, "parent.tr=" + (node.parent && node.parent.tr));
|
||||
if (!isRootNode) {
|
||||
if (node.tr && force) {
|
||||
this.nodeRemoveMarkup(ctx);
|
||||
}
|
||||
if (node.tr) {
|
||||
if (force) {
|
||||
// Set icon, link, and title (normally this is only required on initial render)
|
||||
this.nodeRenderTitle(ctx); // triggers renderColumns()
|
||||
} else {
|
||||
// Update element classes according to node state
|
||||
this.nodeRenderStatus(ctx);
|
||||
}
|
||||
} else {
|
||||
if (ctx.hasCollapsedParents && !deep) {
|
||||
// #166: we assume that the parent will be (recursively) rendered
|
||||
// later anyway.
|
||||
// node.debug("nodeRender ignored due to unrendered parent");
|
||||
return;
|
||||
}
|
||||
// Create new <tr> after previous row
|
||||
// if( node.isStatusNode() ) {
|
||||
// newRow = tree.statusRowFragment.firstChild.cloneNode(true);
|
||||
// } else {
|
||||
newRow = tree.rowFragment.firstChild.cloneNode(true);
|
||||
// }
|
||||
prevNode = findPrevRowNode(node);
|
||||
// $.ui.fancytree.debug("*** nodeRender " + node + ": prev: " + prevNode.key);
|
||||
_assert(prevNode);
|
||||
if (collapsed === true && _recursive) {
|
||||
// hide all child rows, so we can use an animation to show it later
|
||||
newRow.style.display = "none";
|
||||
} else if (deep && ctx.hasCollapsedParents) {
|
||||
// also hide this row if deep === true but any parent is collapsed
|
||||
newRow.style.display = "none";
|
||||
// newRow.style.color = "red";
|
||||
}
|
||||
if (prevNode.tr) {
|
||||
insertSiblingAfter(prevNode.tr, newRow);
|
||||
} else {
|
||||
_assert(
|
||||
!prevNode.parent,
|
||||
"prev. row must have a tr, or be system root"
|
||||
);
|
||||
// tree.tbody.appendChild(newRow);
|
||||
insertFirstChild(tree.tbody, newRow); // #675
|
||||
}
|
||||
node.tr = newRow;
|
||||
if (node.key && opts.generateIds) {
|
||||
node.tr.id = opts.idPrefix + node.key;
|
||||
}
|
||||
node.tr.ftnode = node;
|
||||
// if(opts.aria){
|
||||
// $(node.tr).attr("aria-labelledby", "ftal_" + opts.idPrefix + node.key);
|
||||
// }
|
||||
node.span = $("span.fancytree-node", node.tr).get(0);
|
||||
// Set icon, link, and title (normally this is only required on initial render)
|
||||
this.nodeRenderTitle(ctx);
|
||||
// Allow tweaking, binding, after node was created for the first time
|
||||
// tree._triggerNodeEvent("createNode", ctx);
|
||||
if (opts.createNode) {
|
||||
opts.createNode.call(tree, { type: "createNode" }, ctx);
|
||||
}
|
||||
}
|
||||
}
|
||||
// Allow tweaking after node state was rendered
|
||||
// tree._triggerNodeEvent("renderNode", ctx);
|
||||
if (opts.renderNode) {
|
||||
opts.renderNode.call(tree, { type: "renderNode" }, ctx);
|
||||
}
|
||||
// Visit child nodes
|
||||
// Add child markup
|
||||
children = node.children;
|
||||
if (children && (isRootNode || deep || node.expanded)) {
|
||||
for (i = 0, l = children.length; i < l; i++) {
|
||||
subCtx = $.extend({}, ctx, { node: children[i] });
|
||||
subCtx.hasCollapsedParents =
|
||||
subCtx.hasCollapsedParents || !node.expanded;
|
||||
this.nodeRender(subCtx, force, deep, collapsed, true);
|
||||
}
|
||||
}
|
||||
// Make sure, that <tr> order matches node.children order.
|
||||
if (children && !_recursive) {
|
||||
// we only have to do it once, for the root branch
|
||||
prevTr = node.tr || null;
|
||||
firstTr = tree.tbody.firstChild;
|
||||
// Iterate over all descendants
|
||||
node.visit(function (n) {
|
||||
if (n.tr) {
|
||||
if (
|
||||
!n.parent.expanded &&
|
||||
n.tr.style.display !== "none"
|
||||
) {
|
||||
// fix after a node was dropped over a collapsed
|
||||
n.tr.style.display = "none";
|
||||
setChildRowVisibility(n, false);
|
||||
}
|
||||
if (n.tr.previousSibling !== prevTr) {
|
||||
node.debug("_fixOrder: mismatch at node: " + n);
|
||||
var nextTr = prevTr ? prevTr.nextSibling : firstTr;
|
||||
tree.tbody.insertBefore(n.tr, nextTr);
|
||||
}
|
||||
prevTr = n.tr;
|
||||
}
|
||||
});
|
||||
}
|
||||
// Update element classes according to node state
|
||||
// if(!isRootNode){
|
||||
// this.nodeRenderStatus(ctx);
|
||||
// }
|
||||
},
|
||||
nodeRenderTitle: function (ctx, title) {
|
||||
var $cb,
|
||||
res,
|
||||
tree = ctx.tree,
|
||||
node = ctx.node,
|
||||
opts = ctx.options,
|
||||
isStatusNode = node.isStatusNode();
|
||||
|
||||
res = this._super(ctx, title);
|
||||
|
||||
if (node.isRootNode()) {
|
||||
return res;
|
||||
}
|
||||
// Move checkbox to custom column
|
||||
if (
|
||||
opts.checkbox &&
|
||||
!isStatusNode &&
|
||||
opts.table.checkboxColumnIdx != null
|
||||
) {
|
||||
$cb = $("span.fancytree-checkbox", node.span); //.detach();
|
||||
$(node.tr)
|
||||
.find("td")
|
||||
.eq(+opts.table.checkboxColumnIdx)
|
||||
.html($cb);
|
||||
}
|
||||
// Update element classes according to node state
|
||||
this.nodeRenderStatus(ctx);
|
||||
|
||||
if (isStatusNode) {
|
||||
if (opts.renderStatusColumns) {
|
||||
// Let user code write column content
|
||||
opts.renderStatusColumns.call(
|
||||
tree,
|
||||
{ type: "renderStatusColumns" },
|
||||
ctx
|
||||
);
|
||||
} else if (opts.table.mergeStatusColumns && node.isTopLevel()) {
|
||||
$(node.tr)
|
||||
.find(">td")
|
||||
.eq(0)
|
||||
.prop("colspan", tree.columnCount)
|
||||
.text(node.title)
|
||||
.addClass("fancytree-status-merged")
|
||||
.nextAll()
|
||||
.remove();
|
||||
} // else: default rendering for status node: leave other cells empty
|
||||
} else if (opts.renderColumns) {
|
||||
opts.renderColumns.call(tree, { type: "renderColumns" }, ctx);
|
||||
}
|
||||
return res;
|
||||
},
|
||||
nodeRenderStatus: function (ctx) {
|
||||
var indent,
|
||||
node = ctx.node,
|
||||
opts = ctx.options;
|
||||
|
||||
this._super(ctx);
|
||||
|
||||
$(node.tr).removeClass("fancytree-node");
|
||||
// indent
|
||||
indent = (node.getLevel() - 1) * opts.table.indentation;
|
||||
if (opts.rtl) {
|
||||
$(node.span).css({ paddingRight: indent + "px" });
|
||||
} else {
|
||||
$(node.span).css({ paddingLeft: indent + "px" });
|
||||
}
|
||||
},
|
||||
/* Expand node, return Deferred.promise. */
|
||||
nodeSetExpanded: function (ctx, flag, callOpts) {
|
||||
// flag defaults to true
|
||||
flag = flag !== false;
|
||||
|
||||
if ((ctx.node.expanded && flag) || (!ctx.node.expanded && !flag)) {
|
||||
// Expanded state isn't changed - just call base implementation
|
||||
return this._superApply(arguments);
|
||||
}
|
||||
|
||||
var dfd = new $.Deferred(),
|
||||
subOpts = $.extend({}, callOpts, {
|
||||
noEvents: true,
|
||||
noAnimation: true,
|
||||
});
|
||||
|
||||
callOpts = callOpts || {};
|
||||
|
||||
function _afterExpand(ok, args) {
|
||||
// ctx.tree.info("ok:" + ok, args);
|
||||
if (ok) {
|
||||
// #1108 minExpandLevel: 2 together with table extension does not work
|
||||
// don't call when 'ok' is false:
|
||||
setChildRowVisibility(ctx.node, flag);
|
||||
if (
|
||||
flag &&
|
||||
ctx.options.autoScroll &&
|
||||
!callOpts.noAnimation &&
|
||||
ctx.node.hasChildren()
|
||||
) {
|
||||
// Scroll down to last child, but keep current node visible
|
||||
ctx.node
|
||||
.getLastChild()
|
||||
.scrollIntoView(true, { topNode: ctx.node })
|
||||
.always(function () {
|
||||
if (!callOpts.noEvents) {
|
||||
ctx.tree._triggerNodeEvent(
|
||||
flag ? "expand" : "collapse",
|
||||
ctx
|
||||
);
|
||||
}
|
||||
dfd.resolveWith(ctx.node);
|
||||
});
|
||||
} else {
|
||||
if (!callOpts.noEvents) {
|
||||
ctx.tree._triggerNodeEvent(
|
||||
flag ? "expand" : "collapse",
|
||||
ctx
|
||||
);
|
||||
}
|
||||
dfd.resolveWith(ctx.node);
|
||||
}
|
||||
} else {
|
||||
if (!callOpts.noEvents) {
|
||||
ctx.tree._triggerNodeEvent(
|
||||
flag ? "expand" : "collapse",
|
||||
ctx
|
||||
);
|
||||
}
|
||||
dfd.rejectWith(ctx.node);
|
||||
}
|
||||
}
|
||||
// Call base-expand with disabled events and animation
|
||||
this._super(ctx, flag, subOpts)
|
||||
.done(function () {
|
||||
_afterExpand(true, arguments);
|
||||
})
|
||||
.fail(function () {
|
||||
_afterExpand(false, arguments);
|
||||
});
|
||||
return dfd.promise();
|
||||
},
|
||||
nodeSetStatus: function (ctx, status, message, details) {
|
||||
if (status === "ok") {
|
||||
var node = ctx.node,
|
||||
firstChild = node.children ? node.children[0] : null;
|
||||
if (firstChild && firstChild.isStatusNode()) {
|
||||
$(firstChild.tr).remove();
|
||||
}
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
treeClear: function (ctx) {
|
||||
this.nodeRemoveChildMarkup(this._makeHookContext(this.rootNode));
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
treeDestroy: function (ctx) {
|
||||
this.$container.find("tbody").empty();
|
||||
if (this.$source) {
|
||||
this.$source.removeClass("fancytree-helper-hidden");
|
||||
}
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
/*,
|
||||
treeSetFocus: function(ctx, flag) {
|
||||
// alert("treeSetFocus" + ctx.tree.$container);
|
||||
ctx.tree.$container.focus();
|
||||
$.ui.fancytree.focusTree = ctx.tree;
|
||||
}*/
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
|
|
@ -0,0 +1,125 @@
|
|||
/*!
|
||||
* jquery.fancytree.themeroller.js
|
||||
*
|
||||
* Enable jQuery UI ThemeRoller styles.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* @see http://jqueryui.com/themeroller/
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
/*******************************************************************************
|
||||
* Extension code
|
||||
*/
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "themeroller",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
activeClass: "ui-state-active", // Class added to active node
|
||||
// activeClass: "ui-state-highlight",
|
||||
addClass: "ui-corner-all", // Class added to all nodes
|
||||
focusClass: "ui-state-focus", // Class added to focused node
|
||||
hoverClass: "ui-state-hover", // Class added to hovered node
|
||||
selectedClass: "ui-state-highlight", // Class added to selected nodes
|
||||
// selectedClass: "ui-state-active"
|
||||
},
|
||||
|
||||
treeInit: function (ctx) {
|
||||
var $el = ctx.widget.element,
|
||||
opts = ctx.options.themeroller;
|
||||
|
||||
this._superApply(arguments);
|
||||
|
||||
if ($el[0].nodeName === "TABLE") {
|
||||
$el.addClass("ui-widget ui-corner-all");
|
||||
$el.find(">thead tr").addClass("ui-widget-header");
|
||||
$el.find(">tbody").addClass("ui-widget-conent");
|
||||
} else {
|
||||
$el.addClass("ui-widget ui-widget-content ui-corner-all");
|
||||
}
|
||||
|
||||
$el.on(
|
||||
"mouseenter mouseleave",
|
||||
".fancytree-node",
|
||||
function (event) {
|
||||
var node = $.ui.fancytree.getNode(event.target),
|
||||
flag = event.type === "mouseenter";
|
||||
|
||||
$(node.tr ? node.tr : node.span).toggleClass(
|
||||
opts.hoverClass + " " + opts.addClass,
|
||||
flag
|
||||
);
|
||||
}
|
||||
);
|
||||
},
|
||||
treeDestroy: function (ctx) {
|
||||
this._superApply(arguments);
|
||||
ctx.widget.element.removeClass(
|
||||
"ui-widget ui-widget-content ui-corner-all"
|
||||
);
|
||||
},
|
||||
nodeRenderStatus: function (ctx) {
|
||||
var classes = {},
|
||||
node = ctx.node,
|
||||
$el = $(node.tr ? node.tr : node.span),
|
||||
opts = ctx.options.themeroller;
|
||||
|
||||
this._super(ctx);
|
||||
/*
|
||||
.ui-state-highlight: Class to be applied to highlighted or selected elements. Applies "highlight" container styles to an element and its child text, links, and icons.
|
||||
.ui-state-error: Class to be applied to error messaging container elements. Applies "error" container styles to an element and its child text, links, and icons.
|
||||
.ui-state-error-text: An additional class that applies just the error text color without background. Can be used on form labels for instance. Also applies error icon color to child icons.
|
||||
|
||||
.ui-state-default: Class to be applied to clickable button-like elements. Applies "clickable default" container styles to an element and its child text, links, and icons.
|
||||
.ui-state-hover: Class to be applied on mouseover to clickable button-like elements. Applies "clickable hover" container styles to an element and its child text, links, and icons.
|
||||
.ui-state-focus: Class to be applied on keyboard focus to clickable button-like elements. Applies "clickable hover" container styles to an element and its child text, links, and icons.
|
||||
.ui-state-active: Class to be applied on mousedown to clickable button-like elements. Applies "clickable active" container styles to an element and its child text, links, and icons.
|
||||
*/
|
||||
// Set ui-state-* class (handle the case that the same class is assigned
|
||||
// to different states)
|
||||
classes[opts.activeClass] = false;
|
||||
classes[opts.focusClass] = false;
|
||||
classes[opts.selectedClass] = false;
|
||||
if (node.isActive()) {
|
||||
classes[opts.activeClass] = true;
|
||||
}
|
||||
if (node.hasFocus()) {
|
||||
classes[opts.focusClass] = true;
|
||||
}
|
||||
// activeClass takes precedence before selectedClass:
|
||||
if (node.isSelected() && !node.isActive()) {
|
||||
classes[opts.selectedClass] = true;
|
||||
}
|
||||
$el.toggleClass(opts.activeClass, classes[opts.activeClass]);
|
||||
$el.toggleClass(opts.focusClass, classes[opts.focusClass]);
|
||||
$el.toggleClass(opts.selectedClass, classes[opts.selectedClass]);
|
||||
// Additional classes (e.g. 'ui-corner-all')
|
||||
$el.addClass(opts.addClass);
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
File diff suppressed because it is too large
Load diff
|
|
@ -0,0 +1,257 @@
|
|||
/*!
|
||||
* jquery.fancytree.wide.js
|
||||
* Support for 100% wide selection bars.
|
||||
* (Extension module for jquery.fancytree.js: https://github.com/mar10/fancytree/)
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
*
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
*/
|
||||
|
||||
(function (factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define(["jquery", "./jquery.fancytree"], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node/CommonJS
|
||||
require("./jquery.fancytree");
|
||||
module.exports = factory(require("jquery"));
|
||||
} else {
|
||||
// Browser globals
|
||||
factory(jQuery);
|
||||
}
|
||||
})(function ($) {
|
||||
"use strict";
|
||||
|
||||
var reNumUnit = /^([+-]?(?:\d+|\d*\.\d+))([a-z]*|%)$/; // split "1.5em" to ["1.5", "em"]
|
||||
|
||||
/*******************************************************************************
|
||||
* Private functions and variables
|
||||
*/
|
||||
// var _assert = $.ui.fancytree.assert;
|
||||
|
||||
/* Calculate inner width without scrollbar */
|
||||
// function realInnerWidth($el) {
|
||||
// // http://blog.jquery.com/2012/08/16/jquery-1-8-box-sizing-width-csswidth-and-outerwidth/
|
||||
// // inst.contWidth = parseFloat(this.$container.css("width"), 10);
|
||||
// // 'Client width without scrollbar' - 'padding'
|
||||
// return $el[0].clientWidth - ($el.innerWidth() - parseFloat($el.css("width"), 10));
|
||||
// }
|
||||
|
||||
/* Create a global embedded CSS style for the tree. */
|
||||
function defineHeadStyleElement(id, cssText) {
|
||||
id = "fancytree-style-" + id;
|
||||
var $headStyle = $("#" + id);
|
||||
|
||||
if (!cssText) {
|
||||
$headStyle.remove();
|
||||
return null;
|
||||
}
|
||||
if (!$headStyle.length) {
|
||||
$headStyle = $("<style />")
|
||||
.attr("id", id)
|
||||
.addClass("fancytree-style")
|
||||
.prop("type", "text/css")
|
||||
.appendTo("head");
|
||||
}
|
||||
try {
|
||||
$headStyle.html(cssText);
|
||||
} catch (e) {
|
||||
// fix for IE 6-8
|
||||
$headStyle[0].styleSheet.cssText = cssText;
|
||||
}
|
||||
return $headStyle;
|
||||
}
|
||||
|
||||
/* Calculate the CSS rules that indent title spans. */
|
||||
function renderLevelCss(
|
||||
containerId,
|
||||
depth,
|
||||
levelOfs,
|
||||
lineOfs,
|
||||
labelOfs,
|
||||
measureUnit
|
||||
) {
|
||||
var i,
|
||||
prefix = "#" + containerId + " span.fancytree-level-",
|
||||
rules = [];
|
||||
|
||||
for (i = 0; i < depth; i++) {
|
||||
rules.push(
|
||||
prefix +
|
||||
(i + 1) +
|
||||
" span.fancytree-title { padding-left: " +
|
||||
(i * levelOfs + lineOfs) +
|
||||
measureUnit +
|
||||
"; }"
|
||||
);
|
||||
}
|
||||
// Some UI animations wrap the UL inside a DIV and set position:relative on both.
|
||||
// This breaks the left:0 and padding-left:nn settings of the title
|
||||
rules.push(
|
||||
"#" +
|
||||
containerId +
|
||||
" div.ui-effects-wrapper ul li span.fancytree-title, " +
|
||||
"#" +
|
||||
containerId +
|
||||
" li.fancytree-animating span.fancytree-title " + // #716
|
||||
"{ padding-left: " +
|
||||
labelOfs +
|
||||
measureUnit +
|
||||
"; position: static; width: auto; }"
|
||||
);
|
||||
return rules.join("\n");
|
||||
}
|
||||
|
||||
// /**
|
||||
// * [ext-wide] Recalculate the width of the selection bar after the tree container
|
||||
// * was resized.<br>
|
||||
// * May be called explicitly on container resize, since there is no resize event
|
||||
// * for DIV tags.
|
||||
// *
|
||||
// * @alias Fancytree#wideUpdate
|
||||
// * @requires jquery.fancytree.wide.js
|
||||
// */
|
||||
// $.ui.fancytree._FancytreeClass.prototype.wideUpdate = function(){
|
||||
// var inst = this.ext.wide,
|
||||
// prevCw = inst.contWidth,
|
||||
// prevLo = inst.lineOfs;
|
||||
|
||||
// inst.contWidth = realInnerWidth(this.$container);
|
||||
// // Each title is precceeded by 2 or 3 icons (16px + 3 margin)
|
||||
// // + 1px title border and 3px title padding
|
||||
// // TODO: use code from treeInit() below
|
||||
// inst.lineOfs = (this.options.checkbox ? 3 : 2) * 19;
|
||||
// if( prevCw !== inst.contWidth || prevLo !== inst.lineOfs ) {
|
||||
// this.debug("wideUpdate: " + inst.contWidth);
|
||||
// this.visit(function(node){
|
||||
// node.tree._callHook("nodeRenderTitle", node);
|
||||
// });
|
||||
// }
|
||||
// };
|
||||
|
||||
/*******************************************************************************
|
||||
* Extension code
|
||||
*/
|
||||
$.ui.fancytree.registerExtension({
|
||||
name: "wide",
|
||||
version: "2.38.3",
|
||||
// Default options for this extension.
|
||||
options: {
|
||||
iconWidth: null, // Adjust this if @fancy-icon-width != "16px"
|
||||
iconSpacing: null, // Adjust this if @fancy-icon-spacing != "3px"
|
||||
labelSpacing: null, // Adjust this if padding between icon and label != "3px"
|
||||
levelOfs: null, // Adjust this if ul padding != "16px"
|
||||
},
|
||||
|
||||
treeCreate: function (ctx) {
|
||||
this._superApply(arguments);
|
||||
this.$container.addClass("fancytree-ext-wide");
|
||||
|
||||
var containerId,
|
||||
cssText,
|
||||
iconSpacingUnit,
|
||||
labelSpacingUnit,
|
||||
iconWidthUnit,
|
||||
levelOfsUnit,
|
||||
instOpts = ctx.options.wide,
|
||||
// css sniffing
|
||||
$dummyLI = $(
|
||||
"<li id='fancytreeTemp'><span class='fancytree-node'><span class='fancytree-icon' /><span class='fancytree-title' /></span><ul />"
|
||||
).appendTo(ctx.tree.$container),
|
||||
$dummyIcon = $dummyLI.find(".fancytree-icon"),
|
||||
$dummyUL = $dummyLI.find("ul"),
|
||||
// $dummyTitle = $dummyLI.find(".fancytree-title"),
|
||||
iconSpacing =
|
||||
instOpts.iconSpacing || $dummyIcon.css("margin-left"),
|
||||
iconWidth = instOpts.iconWidth || $dummyIcon.css("width"),
|
||||
labelSpacing = instOpts.labelSpacing || "3px",
|
||||
levelOfs = instOpts.levelOfs || $dummyUL.css("padding-left");
|
||||
|
||||
$dummyLI.remove();
|
||||
|
||||
iconSpacingUnit = iconSpacing.match(reNumUnit)[2];
|
||||
iconSpacing = parseFloat(iconSpacing, 10);
|
||||
labelSpacingUnit = labelSpacing.match(reNumUnit)[2];
|
||||
labelSpacing = parseFloat(labelSpacing, 10);
|
||||
iconWidthUnit = iconWidth.match(reNumUnit)[2];
|
||||
iconWidth = parseFloat(iconWidth, 10);
|
||||
levelOfsUnit = levelOfs.match(reNumUnit)[2];
|
||||
if (
|
||||
iconSpacingUnit !== iconWidthUnit ||
|
||||
levelOfsUnit !== iconWidthUnit ||
|
||||
labelSpacingUnit !== iconWidthUnit
|
||||
) {
|
||||
$.error(
|
||||
"iconWidth, iconSpacing, and levelOfs must have the same css measure unit"
|
||||
);
|
||||
}
|
||||
this._local.measureUnit = iconWidthUnit;
|
||||
this._local.levelOfs = parseFloat(levelOfs);
|
||||
this._local.lineOfs =
|
||||
(1 +
|
||||
(ctx.options.checkbox ? 1 : 0) +
|
||||
(ctx.options.icon === false ? 0 : 1)) *
|
||||
(iconWidth + iconSpacing) +
|
||||
iconSpacing;
|
||||
this._local.labelOfs = labelSpacing;
|
||||
this._local.maxDepth = 10;
|
||||
|
||||
// Get/Set a unique Id on the container (if not already exists)
|
||||
containerId = this.$container.uniqueId().attr("id");
|
||||
// Generated css rules for some levels (extended on demand)
|
||||
cssText = renderLevelCss(
|
||||
containerId,
|
||||
this._local.maxDepth,
|
||||
this._local.levelOfs,
|
||||
this._local.lineOfs,
|
||||
this._local.labelOfs,
|
||||
this._local.measureUnit
|
||||
);
|
||||
defineHeadStyleElement(containerId, cssText);
|
||||
},
|
||||
treeDestroy: function (ctx) {
|
||||
// Remove generated css rules
|
||||
defineHeadStyleElement(this.$container.attr("id"), null);
|
||||
return this._superApply(arguments);
|
||||
},
|
||||
nodeRenderStatus: function (ctx) {
|
||||
var containerId,
|
||||
cssText,
|
||||
res,
|
||||
node = ctx.node,
|
||||
level = node.getLevel();
|
||||
|
||||
res = this._super(ctx);
|
||||
// Generate some more level-n rules if required
|
||||
if (level > this._local.maxDepth) {
|
||||
containerId = this.$container.attr("id");
|
||||
this._local.maxDepth *= 2;
|
||||
node.debug(
|
||||
"Define global ext-wide css up to level " +
|
||||
this._local.maxDepth
|
||||
);
|
||||
cssText = renderLevelCss(
|
||||
containerId,
|
||||
this._local.maxDepth,
|
||||
this._local.levelOfs,
|
||||
this._local.lineOfs,
|
||||
this._local.labelSpacing,
|
||||
this._local.measureUnit
|
||||
);
|
||||
defineHeadStyleElement(containerId, cssText);
|
||||
}
|
||||
// Add level-n class to apply indentation padding.
|
||||
// (Setting element style would not work, since it cannot easily be
|
||||
// overriden while animations run)
|
||||
$(node.span).addClass("fancytree-level-" + level);
|
||||
return res;
|
||||
},
|
||||
});
|
||||
// Value returned by `require('jquery.fancytree..')`
|
||||
return $.ui.fancytree;
|
||||
}); // End of closure
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 48 KiB |
|
|
@ -0,0 +1,972 @@
|
|||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
|
||||
// Variables (defaults, may be overwritten by the including .less files)
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
// @fancy-hide-connectors: true; // false: show vertical connector lines
|
||||
|
||||
@fancy-level-indent: 16px;
|
||||
@fancy-line-height: 16px; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-line-ofs-top: (@fancy-line-height - @fancy-icon-height) / 2;
|
||||
|
||||
// webpack uses /dist/skin-common.less as root path
|
||||
// grunt-less uses /dist/skin-Xxx/ui.fancyree.less as root path
|
||||
// So we define our theme LESS files for webpack compatibility, i.e.
|
||||
// define the image path n every main LESS file instead of here.
|
||||
// Prefix may be set to "", "/", "./", or any other value
|
||||
// Note: this variable must be defined by the main LESS files:
|
||||
// @fancy-image-prefix: "";
|
||||
|
||||
// Use 'url(...)' to link to the throbber image, or
|
||||
// use data-uri(...)' to inline the data in css instead:
|
||||
/* CHANGE use url, as less does not handel data-uri() correct. DokuWiki can eventually inline it */
|
||||
@fancy-loading-url: url("@{fancy-image-prefix}loading.gif");
|
||||
//@fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false; // data-uri() is not handle correct by phpless
|
||||
|
||||
@fancy-font-size: 10pt;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: black;
|
||||
@fancy-font-color-dimm: #c0c0c0;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
// Mixins
|
||||
//------------------------------------------------------------------------------
|
||||
.setBgPos(@x, @y, @cond:true) when (@cond) {
|
||||
background-position: (@x * -@fancy-icon-width) (@y * -@fancy-icon-height);
|
||||
}
|
||||
.clearBgImage(@cond:true) when (@cond) {
|
||||
background-image: none;
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and not (@fancy-inline-sprites) {
|
||||
background-image: url("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and (@fancy-inline-sprites) {
|
||||
background-image: data-uri("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.useSprite(@x, @y) when (@fancy-use-sprites) {
|
||||
.setBgPos(@x, @y);
|
||||
}
|
||||
.rounded-corners(@radius) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
-ms-border-radius: @radius;
|
||||
-o-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor) {
|
||||
border-color: @bordercolor;
|
||||
background: @bgcolor;
|
||||
color: @color;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor, @startColor, @stopColor) {
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor);
|
||||
// @c-start: argb(@startColor);
|
||||
// @c-end: argb(@stopColor);
|
||||
background: -moz-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // FF3.6+
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, @startColor),
|
||||
color-stop(100%, @stopColor)
|
||||
); // Chrome,Safari4+
|
||||
background: -webkit-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Chrome10+,Safari5.1+
|
||||
background: -o-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Opera 11.10+
|
||||
background: -ms-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // IE10+
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // W3C
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{stopColor}',GradientType=0 ); // IE6-9
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
// Redefine, in case jQuery-UI is not included
|
||||
// .ui-helper-hidden,
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
// tri-state checkbox
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: @fancy-font-color-dimm;
|
||||
}
|
||||
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
/* CHANGE: renamed spin to spin-fancytree */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin-fancytree 1000ms infinite linear;
|
||||
animation: spin-fancytree 1000ms infinite linear;
|
||||
}
|
||||
/* CHANGE: commented because it is wrong prefixed by phpless
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
*/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
ul.fancytree-container {
|
||||
font-family: @fancy-font-family;
|
||||
font-size: @fancy-font-size;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0; // DT issue 201
|
||||
//background-color: white; CHANGE
|
||||
//border: 1px dotted gray; CHANGE
|
||||
// overflow: auto; // ext-dnd5: otherwise this is always the scroll parent
|
||||
// height: 100%; // DT issue 263, 470
|
||||
min-height: 0%; // #192
|
||||
position: relative; // #235
|
||||
ul {
|
||||
padding: 0 0 0 @fancy-level-indent;
|
||||
margin: 0;
|
||||
}
|
||||
ul > li:before {
|
||||
// #538
|
||||
content: none;
|
||||
}
|
||||
li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
.setBgPos(0, 0);
|
||||
background-repeat: repeat-y;
|
||||
background-image: none; // no v-lines
|
||||
|
||||
margin: 0;
|
||||
// padding: 1px 0 0 0; // issue #246
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Style, when control is disabled
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
// filter: alpha(opacity=50); // Yields a css warning
|
||||
background-color: silver;
|
||||
}
|
||||
|
||||
ul.fancytree-connectors.fancytree-container {
|
||||
li {
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
/* CHANGE: phpless does not handle data-uri() correct */
|
||||
//background-image: data-uri("@{fancy-image-prefix}vline.gif");
|
||||
background-image: url("@{fancy-image-prefix}vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Suppress lines for last child node
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
// Fix jQuery UI 'blind' animation for jQuery UI (#717)
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
// display: -moz-inline-box; // @ FF 1+2 removed for issue 221
|
||||
// -moz-box-align: start; /* issue 221 */
|
||||
display: inline-block; // Required to make a span sizeable
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
// background-position: left;
|
||||
.setBgImageUrl("icons.gif");
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
display: inline-block;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-expander {
|
||||
// .useSprite(0, 5);
|
||||
cursor: pointer;
|
||||
}
|
||||
// span.fancytree-expander:hover {
|
||||
// // .useSprite(1, 5);
|
||||
// }
|
||||
|
||||
// --- End nodes (use connectors instead of expanders)
|
||||
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
// .clearBgImage( @fancy-hide-connectors );
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors {
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander, // End-node, not last sibling
|
||||
.fancytree-exp-n span.fancytree-expander:hover {
|
||||
.useSprite(0, 4);
|
||||
}
|
||||
.fancytree-exp-nl span.fancytree-expander, // End-node, last sibling
|
||||
.fancytree-exp-nl span.fancytree-expander:hover {
|
||||
.useSprite(1, 4);
|
||||
}
|
||||
}
|
||||
|
||||
// --- Collapsed
|
||||
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
// Collapsed, not delayed, not last sibling
|
||||
.useSprite(0, 5);
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
.useSprite(1, 5);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
// Collapsed, not delayed, last sibling
|
||||
.useSprite(0, 6);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
.useSprite(1, 6);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
// Collapsed, delayed, not last sibling
|
||||
.useSprite(4, 5);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
.useSprite(5, 5);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
// Collapsed, delayed, last sibling
|
||||
.useSprite(4, 6);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
.useSprite(5, 6);
|
||||
}
|
||||
|
||||
// --- Expanded
|
||||
|
||||
.fancytree-exp-e span.fancytree-expander, // Expanded, not delayed, not last sibling
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
// Expanded, delayed, not last sibling
|
||||
.useSprite(2, 5);
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
.useSprite(3, 5);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander, // Expanded, not delayed, last sibling
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
// Expanded, delayed, last sibling
|
||||
.useSprite(2, 6);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
.useSprite(3, 6);
|
||||
}
|
||||
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander {
|
||||
span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover span.fancytree-expander,
|
||||
&.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-treefocus span.fancytree-expander,
|
||||
[class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Checkbox icon
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//span.fancytree-checkbox {
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
// .useSprite(0, 2);
|
||||
// &:hover {
|
||||
// .useSprite(1, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(1, 3);
|
||||
// }
|
||||
//}
|
||||
//.fancytree-partsel span.fancytree-checkbox {
|
||||
// .useSprite(4, 2);
|
||||
// &:hover {
|
||||
// .useSprite(5, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(4, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(5, 3);
|
||||
// }
|
||||
//}
|
||||
//// selected after partsel, so it takes precedence:
|
||||
//.fancytree-selected span.fancytree-checkbox {
|
||||
// .useSprite(2, 2);
|
||||
// &:hover {
|
||||
// .useSprite(3, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(3, 3);
|
||||
// }
|
||||
//}
|
||||
//// Unselectable is dimmed, without hover effects
|
||||
//.fancytree-unselectable {
|
||||
// span.fancytree-checkbox {
|
||||
// opacity: 0.4;
|
||||
// filter: alpha(opacity=40);
|
||||
// }
|
||||
// span.fancytree-checkbox:hover {
|
||||
// .useSprite(0, 2);
|
||||
// }
|
||||
// span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
// .useSprite(4, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox:hover {
|
||||
// .useSprite(2, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//// Auto-hide checkboxes unless selected or hovered
|
||||
//.fancytree-container.fancytree-checkbox-auto-hide {
|
||||
// span.fancytree-checkbox {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .fancytree-node:hover span.fancytree-checkbox,
|
||||
// tr:hover td span.fancytree-checkbox,
|
||||
// .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
// tr.fancytree-selected td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// &.fancytree-treefocus {
|
||||
// .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
// tr.fancytree-active td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-icon {
|
||||
// Default icon
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
// .useSprite(0, 0);
|
||||
}
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(1, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(3, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
.useSprite(5, 0);
|
||||
}
|
||||
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
.useSprite(0, 1);
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(1, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(3, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
.useSprite(5, 1);
|
||||
}
|
||||
|
||||
// 'Loading' status overrides all others
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: @fancy-loading-url;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Status node icons */
|
||||
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
.useSprite(0, 7);
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit; // #117, resolves to 'display: list-item;' for standard trees
|
||||
width: 100%;
|
||||
margin-top: @fancy-node-v-spacing;
|
||||
min-height: @fancy-line-height;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: @fancy-font-color; // inherit doesn't work on IE
|
||||
cursor: pointer;
|
||||
display: inline-block; // Better alignment, when title contains <br>
|
||||
vertical-align: top;
|
||||
min-height: @fancy-line-height;
|
||||
padding: 0 3px 0 3px; // Otherwise italic font will be outside right bounds
|
||||
margin: @fancy-title-ofs-top 0 0 @fancy-icon-spacing;
|
||||
// margin: 0px;
|
||||
// margin-top: @fancy-line-ofs-top;
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
.rounded-corners(@fancy-node-border-radius);
|
||||
// outline: 0; // @ Firefox, prevent dotted border after click
|
||||
// Set transparent border to prevent jumping when active node gets a border
|
||||
// (we can do this, because this theme doesn't use vertical lines)
|
||||
// border: 1px solid white; // Note: 'transparent' would not work in IE6
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Drag'n'drop support
|
||||
// *----------------------------------------------------------------------------*/
|
||||
///* ext-dnd5: */
|
||||
//span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
//}
|
||||
//
|
||||
///* ext-dnd: */
|
||||
//div.fancytree-drag-helper {
|
||||
// span.fancytree-childcounter,
|
||||
// span.fancytree-dnd-modifier {
|
||||
// display: inline-block;
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// min-width: 10px;
|
||||
// // min-height: 16px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// position: absolute;
|
||||
// // left: 16px;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// }
|
||||
// span.fancytree-dnd-modifier {
|
||||
// background: #5cb85c; // bootstrap green
|
||||
// border: none;
|
||||
// // min-height: 16px;
|
||||
// // font-size: 12px;
|
||||
// font-weight: bolder;
|
||||
// }
|
||||
// &.fancytree-drop-accept {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(2, 7);
|
||||
// }
|
||||
// }
|
||||
// &.fancytree-drop-reject {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(1, 7);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Drop marker icon *********************************************************/
|
||||
//#fancytree-drop-marker {
|
||||
// width: 2 * @fancy-icon-width; // was 24px, but 32 should be correct
|
||||
// position: absolute;
|
||||
// .useSprite(0, 8);
|
||||
// margin: 0;
|
||||
// &.fancytree-drop-after,
|
||||
// &.fancytree-drop-before {
|
||||
// width: 4 * @fancy-icon-width; // 64px;
|
||||
// .useSprite(0, 9);
|
||||
// }
|
||||
// &.fancytree-drop-copy {
|
||||
// .useSprite(4, 8);
|
||||
// }
|
||||
// &.fancytree-drop-move {
|
||||
// .useSprite(2, 8);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Source node while dragging ***********************************************/
|
||||
//
|
||||
//span.fancytree-drag-source {
|
||||
// &.fancytree-drag-remove {
|
||||
// // text-decoration: line-through;
|
||||
// opacity: 0.15;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Target node while dragging cursor is over it *****************************/
|
||||
//
|
||||
//span.fancytree-drop-target {
|
||||
// &.fancytree-drop-accept {
|
||||
// // outline: 1px dotted #5cb85c; // bootstrap sucess
|
||||
// }
|
||||
//}
|
||||
//span.fancytree-drop-reject {
|
||||
// // outline: 1px dotted #d9534f; // boostrap warning
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
.fancytree-container.fancytree-rtl {
|
||||
.fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/ /* optional: reverse title letters */
|
||||
}
|
||||
span.fancytree-connector,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-drag-helper-img {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
&.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
&.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl {
|
||||
ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
&.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("@{fancy-image-prefix}vline-rtl.gif");
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
&.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'table' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-table {
|
||||
// font-family: @fancy-font-family;
|
||||
// font-size: @fancy-font-size;
|
||||
// border-collapse: collapse;
|
||||
// span.fancytree-node {
|
||||
// display: inline-block; // #117
|
||||
// box-sizing: border-box; // #562
|
||||
// }
|
||||
// td.fancytree-status-merged {
|
||||
// text-align: center;
|
||||
// // font-weight: bold;
|
||||
// font-style: italic;
|
||||
// // line-height: 100px;
|
||||
// color: @fancy-font-color-dimm;
|
||||
// }
|
||||
// tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
// color: @fancy-font-error-color;
|
||||
// }
|
||||
// /* ext-ariagrid */
|
||||
// &.fancytree-ext-ariagrid.fancytree-cell-mode {
|
||||
// > tbody > tr.fancytree-active > td {
|
||||
// background-color: #eee;
|
||||
// }
|
||||
// > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #cbe8f6;
|
||||
// }
|
||||
// &.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #3875d7;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'columnview' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-columnview {
|
||||
// // border-collapse: collapse;
|
||||
// // width: 100%;
|
||||
// tbody tr td {
|
||||
// position: relative;
|
||||
// border: 1px solid gray;
|
||||
// vertical-align: top;
|
||||
// overflow: auto;
|
||||
// > ul {
|
||||
// padding: 0;
|
||||
// li {
|
||||
// list-style-image: none;
|
||||
// list-style-position: outside;
|
||||
// list-style-type: none;
|
||||
// -moz-background-clip: border;
|
||||
// -moz-background-inline-policy: continuous;
|
||||
// -moz-background-origin: padding;
|
||||
// background-attachment: scroll;
|
||||
// background-color: transparent;
|
||||
// .setBgPos(0, 0);
|
||||
// background-repeat: repeat-y;
|
||||
// background-image: none; /* no v-lines */
|
||||
//
|
||||
// margin: 0;
|
||||
// // padding: 1px 0 0 0; // issue #246
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// span.fancytree-node {
|
||||
// position: relative; /* allow positioning of embedded spans */
|
||||
// display: inline-block; // #117
|
||||
// }
|
||||
// span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #e0e0e0;
|
||||
// }
|
||||
// span.fancytree-node.fancytree-active {
|
||||
// background-color: #cbe8f6;
|
||||
// // background-color: royalblue;
|
||||
// }
|
||||
// .fancytree-has-children span.fancytree-cv-right {
|
||||
// position: absolute;
|
||||
// right: 3px;
|
||||
// .useSprite(0, 5);
|
||||
// &:hover {
|
||||
// .useSprite(1, 5);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'filter' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-filter-dimm {
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: bold;
|
||||
// }
|
||||
//}
|
||||
//.fancytree-ext-filter-hide {
|
||||
// tr.fancytree-hide,
|
||||
// span.fancytree-node.fancytree-hide {
|
||||
// display: none;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
//}
|
||||
///* Hide expanders if all child nodes are hidden by filter */
|
||||
//.fancytree-ext-filter-hide-expanders {
|
||||
// tr.fancytree-match span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
// visibility: visible;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//.fancytree-ext-childcounter,
|
||||
//.fancytree-ext-filter {
|
||||
// // span.fancytree-title mark {
|
||||
// // font-style: normal;
|
||||
// // background-color: #ead61c; // yellow
|
||||
// // border-radius: 3px;
|
||||
// // }
|
||||
// span.fancytree-icon,
|
||||
// span.fancytree-custom-icon {
|
||||
// position: relative;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #777; // #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// position: absolute;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// min-width: 10px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
//}
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'wide' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//ul.fancytree-ext-wide {
|
||||
// position: relative;
|
||||
// min-width: 100%;
|
||||
// z-index: 2;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
//
|
||||
// span.fancytree-node > span {
|
||||
// position: relative;
|
||||
// z-index: 2;
|
||||
// }
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// position: absolute; // Allow left: 0. Note: prevents smooth dropdown animation
|
||||
// z-index: 1; // Behind expander and checkbox
|
||||
// left: 0px;
|
||||
// min-width: 100%;
|
||||
// margin-left: 0;
|
||||
// margin-right: 0;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'fixed' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-fixed-wrapper {
|
||||
// .fancytree-ext-fixed-hidden {
|
||||
// display: none;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
// border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-right {
|
||||
// border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 3;
|
||||
// top: 0px;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tr {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// top: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-bl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-br {
|
||||
// position: absolute;
|
||||
// overflow: scroll;
|
||||
// z-index: 1;
|
||||
// }
|
||||
//}
|
||||
|
|
@ -0,0 +1,588 @@
|
|||
/*!
|
||||
* Fancytree "awesome" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: silver;
|
||||
}
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin 1000ms infinite linear;
|
||||
animation: spin 1000ms infinite linear;
|
||||
}
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-container {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0;
|
||||
background-color: white;
|
||||
border: 1px dotted gray;
|
||||
min-height: 0%;
|
||||
position: relative;
|
||||
}
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 10pt;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container ul > li:before {
|
||||
content: none;
|
||||
}
|
||||
ul.fancytree-container li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0pt 0pt;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
background-color: silver;
|
||||
}
|
||||
ul.fancytree-connectors.fancytree-container li {
|
||||
background-image: url("../skin-awesome/vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: 10pt;
|
||||
height: 10pt;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0pt 0pt;
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: 0px;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: 10pt;
|
||||
height: 10pt;
|
||||
display: inline-block;
|
||||
margin-left: 3px;
|
||||
background-position: 0pt 0pt;
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: 10pt;
|
||||
height: 10pt;
|
||||
margin-left: 3px;
|
||||
margin-top: 0px;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-expander {
|
||||
cursor: pointer;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
margin-top: 0;
|
||||
}
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
.fancytree-fade-expander:hover span.fancytree-expander,
|
||||
.fancytree-fade-expander.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander .fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander [class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Checkbox icon
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-checkbox {
|
||||
margin-left: 3px;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox {
|
||||
opacity: 0.4;
|
||||
filter: alpha(opacity=40);
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide span.fancytree-checkbox {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node:hover span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr:hover td span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr.fancytree-selected td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus tr.fancytree-active td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-icon {
|
||||
margin-left: 3px;
|
||||
}
|
||||
/* Documents */
|
||||
/* Folders */
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: none;
|
||||
}
|
||||
/* Status node icons */
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit;
|
||||
width: 100%;
|
||||
margin-top: 1px;
|
||||
min-height: 10pt;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: #000;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
min-height: 10pt;
|
||||
padding: 0 3px 0 3px;
|
||||
margin: 0px 0 0 3px;
|
||||
border: 1px solid transparent;
|
||||
-webkit-border-radius: 0px;
|
||||
-moz-border-radius: 0px;
|
||||
-ms-border-radius: 0px;
|
||||
-o-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: red;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Drag'n'drop support
|
||||
*----------------------------------------------------------------------------*/
|
||||
/* ext-dnd5: */
|
||||
span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
/* ext-dnd: */
|
||||
div.fancytree-drag-helper span.fancytree-childcounter,
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-childcounter {
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
background: #5cb85c;
|
||||
border: none;
|
||||
font-weight: bolder;
|
||||
}
|
||||
/*** Drop marker icon *********************************************************/
|
||||
#fancytree-drop-marker {
|
||||
width: 20pt;
|
||||
position: absolute;
|
||||
margin: 0;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-after,
|
||||
#fancytree-drop-marker.fancytree-drop-before {
|
||||
width: 40pt;
|
||||
}
|
||||
/*** Source node while dragging ***********************************************/
|
||||
span.fancytree-drag-source.fancytree-drag-remove {
|
||||
opacity: 0.15;
|
||||
}
|
||||
/*** Target node while dragging cursor is over it *****************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-container.fancytree-rtl .fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/
|
||||
/* optional: reverse title letters */
|
||||
}
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("../skin-awesome/vline-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl li.fancytree-lastsib,
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'table' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-table {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
border-collapse: collapse;
|
||||
/* ext-ariagrid */
|
||||
}
|
||||
table.fancytree-ext-table span.fancytree-node {
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
table.fancytree-ext-table td.fancytree-status-merged {
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
color: silver;
|
||||
}
|
||||
table.fancytree-ext-table tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
color: red;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr.fancytree-active > td {
|
||||
background-color: #eee;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #3875d7;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'columnview' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-columnview tbody tr td {
|
||||
position: relative;
|
||||
border: 1px solid gray;
|
||||
vertical-align: top;
|
||||
overflow: auto;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul {
|
||||
padding: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0pt 0pt;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
/* no v-lines */
|
||||
margin: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node {
|
||||
position: relative;
|
||||
/* allow positioning of embedded spans */
|
||||
display: inline-block;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'filter' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-filter-dimm span.fancytree-node span.fancytree-title {
|
||||
color: silver;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-hide,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-hide {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: silver;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* Hide expanders if all child nodes are hidden by filter */
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-match span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-submatch span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
visibility: visible;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-icon,
|
||||
.fancytree-ext-filter span.fancytree-icon,
|
||||
.fancytree-ext-childcounter span.fancytree-custom-icon,
|
||||
.fancytree-ext-filter span.fancytree-custom-icon {
|
||||
position: relative;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-childcounter,
|
||||
.fancytree-ext-filter span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #777;
|
||||
border: 1px solid gray;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'wide' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-ext-wide {
|
||||
position: relative;
|
||||
min-width: 100%;
|
||||
z-index: 2;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node > span {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node span.fancytree-title {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: 0px;
|
||||
min-width: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'fixed' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-fixed-wrapper .fancytree-ext-fixed-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-right {
|
||||
border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 3;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tr {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
top: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-bl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-br {
|
||||
position: absolute;
|
||||
overflow: scroll;
|
||||
z-index: 1;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
ul.fancytree-container ul {
|
||||
padding: 0.3em 0 0 1em;
|
||||
margin: 0;
|
||||
}
|
||||
.fancytree-expander,
|
||||
.fancytree-checkbox,
|
||||
.fancytree-icon {
|
||||
min-width: 10pt;
|
||||
text-align: center;
|
||||
}
|
||||
svg.fancytree-checkbox,
|
||||
svg.fancytree-icon {
|
||||
padding-left: 3px;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
span.fancytree-title {
|
||||
border: 1px solid transparent;
|
||||
border-radius: 0;
|
||||
}
|
||||
span.fancytree-focused span.fancytree-title {
|
||||
outline: 1px dotted black;
|
||||
}
|
||||
span.fancytree-active span.fancytree-title {
|
||||
background-color: #D4D4D4;
|
||||
}
|
||||
.fancytree-treefocus span.fancytree-active span.fancytree-title {
|
||||
color: white;
|
||||
background-color: #3875D7;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'table' extension
|
||||
*/
|
||||
table.fancytree-ext-table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-focused {
|
||||
background-color: #99DEFD;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-active {
|
||||
background-color: royalblue;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'columnview' extension
|
||||
*/
|
||||
table.fancytree-ext-columnview tbody tr td {
|
||||
border: 1px solid gray;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #ccc;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: royalblue;
|
||||
}
|
||||
|
|
@ -0,0 +1,134 @@
|
|||
/*!
|
||||
* Fancytree "awesome" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
|
||||
// Import common styles
|
||||
@import "skin-common.less";
|
||||
|
||||
// We need to define this variable here (not in skin-common.less) to make it
|
||||
// work with grunt and webpack:
|
||||
@fancy-image-prefix: "./skin-awesome/";
|
||||
|
||||
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
|
||||
@fancy-use-sprites: false; // false: suppress all background images (i.e. icons)
|
||||
@fancy-loading-url: none;
|
||||
|
||||
@fancy-cst-size: 16px;
|
||||
|
||||
@fancy-level-indent: @fancy-cst-size; //@fancy-cst-size;
|
||||
@fancy-line-height: @fancy-cst-size; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: @fancy-cst-size;
|
||||
@fancy-icon-height: @fancy-cst-size;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false;
|
||||
|
||||
//default 10pt, which is used in a relative manner resulting in 13.3 in dokuwiki-template.
|
||||
@fancy-font-size: 93%; //@fancy-cst-size;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: #000;
|
||||
@fancy-font-color-dimm: silver;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
// set icon color to font color as well
|
||||
span.fancytree-node {
|
||||
color: @fancy-font-color;
|
||||
}
|
||||
|
||||
ul.fancytree-container ul
|
||||
{
|
||||
padding: 0 0 0 1em; // 0.3em 0 0 1em;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
// The standard CSS assumes span.icon, but Fontawesome may use SVG or SPAN
|
||||
.fancytree-expander,
|
||||
.fancytree-checkbox,
|
||||
.fancytree-icon {
|
||||
min-width: @fancy-icon-width;
|
||||
text-align: center;
|
||||
font-size: @fancy-cst-size;
|
||||
}
|
||||
svg.fancytree-checkbox, // span... is already defined in skin-common-less
|
||||
svg.fancytree-icon {
|
||||
padding-left: @fancy-icon-spacing;
|
||||
}
|
||||
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
span.fancytree-title {
|
||||
border: 1px solid transparent; // reserve some space for status borders
|
||||
border-radius: 0;
|
||||
}
|
||||
span.fancytree-focused span.fancytree-title {
|
||||
outline: 1px dotted black;
|
||||
}
|
||||
// span.fancytree-selected span.fancytree-title,
|
||||
span.fancytree-active span.fancytree-title {
|
||||
background-color: #D4D4D4; // gray
|
||||
}
|
||||
// span.fancytree-selected span.fancytree-title {
|
||||
// font-style: italic;
|
||||
// }
|
||||
// .fancytree-treefocus span.fancytree-selected span.fancytree-title,
|
||||
.fancytree-treefocus span.fancytree-active span.fancytree-title {
|
||||
color: white;
|
||||
background-color: #3875D7; // blue
|
||||
}
|
||||
|
||||
// .fancytree-treefocus span.fancytree-selected span.fancytree-title{
|
||||
// color: white;
|
||||
// background-color: #99DEFD; // blue
|
||||
// }
|
||||
|
||||
///*******************************************************************************
|
||||
// * 'table' extension
|
||||
// */
|
||||
//table.fancytree-ext-table {
|
||||
// border-collapse: collapse;
|
||||
// tbody {
|
||||
// tr.fancytree-focused {
|
||||
// background-color: #99DEFD;
|
||||
// }
|
||||
// tr.fancytree-active {
|
||||
// background-color: royalblue;
|
||||
// }
|
||||
// // tr.fancytree-selected {
|
||||
// // background-color: #99DEFD;
|
||||
// // }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*******************************************************************************
|
||||
// * 'columnview' extension
|
||||
// */
|
||||
//
|
||||
//table.fancytree-ext-columnview tbody tr td {
|
||||
// border: 1px solid gray;
|
||||
//}
|
||||
//table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #ccc;
|
||||
//}
|
||||
//table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
// background-color: royalblue;
|
||||
//}
|
||||
6
plugins/55/indexmenu/scripts/fancytree/skin-awesome/ui.fancytree.min.css
vendored
Normal file
6
plugins/55/indexmenu/scripts/fancytree/skin-awesome/ui.fancytree.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 842 B |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-awesome/vline.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-awesome/vline.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 844 B |
|
|
@ -0,0 +1,972 @@
|
|||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
|
||||
// Variables (defaults, may be overwritten by the including .less files)
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
// @fancy-hide-connectors: true; // false: show vertical connector lines
|
||||
|
||||
@fancy-level-indent: 16px;
|
||||
@fancy-line-height: 16px; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-line-ofs-top: (@fancy-line-height - @fancy-icon-height) / 2;
|
||||
|
||||
// webpack uses /dist/skin-common.less as root path
|
||||
// grunt-less uses /dist/skin-Xxx/ui.fancyree.less as root path
|
||||
// So we define our theme LESS files for webpack compatibility, i.e.
|
||||
// define the image path n every main LESS file instead of here.
|
||||
// Prefix may be set to "", "/", "./", or any other value
|
||||
// Note: this variable must be defined by the main LESS files:
|
||||
// @fancy-image-prefix: "";
|
||||
|
||||
// Use 'url(...)' to link to the throbber image, or
|
||||
// use data-uri(...)' to inline the data in css instead:
|
||||
/* CHANGE use url, as less does not handel data-uri() correct. DokuWiki can eventually inline it */
|
||||
@fancy-loading-url: url("@{fancy-image-prefix}loading.gif");
|
||||
//@fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false; // data-uri() is not handle correct by phpless
|
||||
|
||||
@fancy-font-size: 10pt;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: black;
|
||||
@fancy-font-color-dimm: #c0c0c0;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
// Mixins
|
||||
//------------------------------------------------------------------------------
|
||||
.setBgPos(@x, @y, @cond:true) when (@cond) {
|
||||
background-position: (@x * -@fancy-icon-width) (@y * -@fancy-icon-height);
|
||||
}
|
||||
.clearBgImage(@cond:true) when (@cond) {
|
||||
background-image: none;
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and not (@fancy-inline-sprites) {
|
||||
background-image: url("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and (@fancy-inline-sprites) {
|
||||
background-image: data-uri("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.useSprite(@x, @y) when (@fancy-use-sprites) {
|
||||
.setBgPos(@x, @y);
|
||||
}
|
||||
.rounded-corners(@radius) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
-ms-border-radius: @radius;
|
||||
-o-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor) {
|
||||
border-color: @bordercolor;
|
||||
background: @bgcolor;
|
||||
color: @color;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor, @startColor, @stopColor) {
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor);
|
||||
// @c-start: argb(@startColor);
|
||||
// @c-end: argb(@stopColor);
|
||||
background: -moz-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // FF3.6+
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, @startColor),
|
||||
color-stop(100%, @stopColor)
|
||||
); // Chrome,Safari4+
|
||||
background: -webkit-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Chrome10+,Safari5.1+
|
||||
background: -o-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Opera 11.10+
|
||||
background: -ms-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // IE10+
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // W3C
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{stopColor}',GradientType=0 ); // IE6-9
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
// Redefine, in case jQuery-UI is not included
|
||||
// .ui-helper-hidden,
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
// tri-state checkbox
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: @fancy-font-color-dimm;
|
||||
}
|
||||
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
/* CHANGE: renamed spin to spin-fancytree */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin-fancytree 1000ms infinite linear;
|
||||
animation: spin-fancytree 1000ms infinite linear;
|
||||
}
|
||||
/* CHANGE: commented because it is wrong prefixed by phpless
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
*/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
ul.fancytree-container {
|
||||
font-family: @fancy-font-family;
|
||||
font-size: @fancy-font-size;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0; // DT issue 201
|
||||
//background-color: white; CHANGE
|
||||
//border: 1px dotted gray; CHANGE
|
||||
// overflow: auto; // ext-dnd5: otherwise this is always the scroll parent
|
||||
// height: 100%; // DT issue 263, 470
|
||||
min-height: 0%; // #192
|
||||
position: relative; // #235
|
||||
ul {
|
||||
padding: 0 0 0 @fancy-level-indent;
|
||||
margin: 0;
|
||||
}
|
||||
ul > li:before {
|
||||
// #538
|
||||
content: none;
|
||||
}
|
||||
li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
.setBgPos(0, 0);
|
||||
background-repeat: repeat-y;
|
||||
background-image: none; // no v-lines
|
||||
|
||||
margin: 0;
|
||||
// padding: 1px 0 0 0; // issue #246
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Style, when control is disabled
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
// filter: alpha(opacity=50); // Yields a css warning
|
||||
background-color: silver;
|
||||
}
|
||||
|
||||
ul.fancytree-connectors.fancytree-container {
|
||||
li {
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
/* CHANGE: phpless does not handle data-uri() correct */
|
||||
//background-image: data-uri("@{fancy-image-prefix}vline.gif");
|
||||
background-image: url("@{fancy-image-prefix}vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Suppress lines for last child node
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
// Fix jQuery UI 'blind' animation for jQuery UI (#717)
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
// display: -moz-inline-box; // @ FF 1+2 removed for issue 221
|
||||
// -moz-box-align: start; /* issue 221 */
|
||||
display: inline-block; // Required to make a span sizeable
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
// background-position: left;
|
||||
.setBgImageUrl("icons.gif");
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
display: inline-block;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-expander {
|
||||
// .useSprite(0, 5);
|
||||
cursor: pointer;
|
||||
}
|
||||
// span.fancytree-expander:hover {
|
||||
// // .useSprite(1, 5);
|
||||
// }
|
||||
|
||||
// --- End nodes (use connectors instead of expanders)
|
||||
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
// .clearBgImage( @fancy-hide-connectors );
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors {
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander, // End-node, not last sibling
|
||||
.fancytree-exp-n span.fancytree-expander:hover {
|
||||
.useSprite(0, 4);
|
||||
}
|
||||
.fancytree-exp-nl span.fancytree-expander, // End-node, last sibling
|
||||
.fancytree-exp-nl span.fancytree-expander:hover {
|
||||
.useSprite(1, 4);
|
||||
}
|
||||
}
|
||||
|
||||
// --- Collapsed
|
||||
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
// Collapsed, not delayed, not last sibling
|
||||
.useSprite(0, 5);
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
.useSprite(1, 5);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
// Collapsed, not delayed, last sibling
|
||||
.useSprite(0, 6);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
.useSprite(1, 6);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
// Collapsed, delayed, not last sibling
|
||||
.useSprite(4, 5);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
.useSprite(5, 5);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
// Collapsed, delayed, last sibling
|
||||
.useSprite(4, 6);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
.useSprite(5, 6);
|
||||
}
|
||||
|
||||
// --- Expanded
|
||||
|
||||
.fancytree-exp-e span.fancytree-expander, // Expanded, not delayed, not last sibling
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
// Expanded, delayed, not last sibling
|
||||
.useSprite(2, 5);
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
.useSprite(3, 5);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander, // Expanded, not delayed, last sibling
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
// Expanded, delayed, last sibling
|
||||
.useSprite(2, 6);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
.useSprite(3, 6);
|
||||
}
|
||||
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander {
|
||||
span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover span.fancytree-expander,
|
||||
&.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-treefocus span.fancytree-expander,
|
||||
[class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Checkbox icon
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//span.fancytree-checkbox {
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
// .useSprite(0, 2);
|
||||
// &:hover {
|
||||
// .useSprite(1, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(1, 3);
|
||||
// }
|
||||
//}
|
||||
//.fancytree-partsel span.fancytree-checkbox {
|
||||
// .useSprite(4, 2);
|
||||
// &:hover {
|
||||
// .useSprite(5, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(4, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(5, 3);
|
||||
// }
|
||||
//}
|
||||
//// selected after partsel, so it takes precedence:
|
||||
//.fancytree-selected span.fancytree-checkbox {
|
||||
// .useSprite(2, 2);
|
||||
// &:hover {
|
||||
// .useSprite(3, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(3, 3);
|
||||
// }
|
||||
//}
|
||||
//// Unselectable is dimmed, without hover effects
|
||||
//.fancytree-unselectable {
|
||||
// span.fancytree-checkbox {
|
||||
// opacity: 0.4;
|
||||
// filter: alpha(opacity=40);
|
||||
// }
|
||||
// span.fancytree-checkbox:hover {
|
||||
// .useSprite(0, 2);
|
||||
// }
|
||||
// span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
// .useSprite(4, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox:hover {
|
||||
// .useSprite(2, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//// Auto-hide checkboxes unless selected or hovered
|
||||
//.fancytree-container.fancytree-checkbox-auto-hide {
|
||||
// span.fancytree-checkbox {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .fancytree-node:hover span.fancytree-checkbox,
|
||||
// tr:hover td span.fancytree-checkbox,
|
||||
// .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
// tr.fancytree-selected td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// &.fancytree-treefocus {
|
||||
// .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
// tr.fancytree-active td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-icon {
|
||||
// Default icon
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
// .useSprite(0, 0);
|
||||
}
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(1, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(3, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
.useSprite(5, 0);
|
||||
}
|
||||
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
.useSprite(0, 1);
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(1, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(3, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
.useSprite(5, 1);
|
||||
}
|
||||
|
||||
// 'Loading' status overrides all others
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: @fancy-loading-url;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Status node icons */
|
||||
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
.useSprite(0, 7);
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit; // #117, resolves to 'display: list-item;' for standard trees
|
||||
width: 100%;
|
||||
margin-top: @fancy-node-v-spacing;
|
||||
min-height: @fancy-line-height;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: @fancy-font-color; // inherit doesn't work on IE
|
||||
cursor: pointer;
|
||||
display: inline-block; // Better alignment, when title contains <br>
|
||||
vertical-align: top;
|
||||
min-height: @fancy-line-height;
|
||||
padding: 0 3px 0 3px; // Otherwise italic font will be outside right bounds
|
||||
margin: @fancy-title-ofs-top 0 0 @fancy-icon-spacing;
|
||||
// margin: 0px;
|
||||
// margin-top: @fancy-line-ofs-top;
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
.rounded-corners(@fancy-node-border-radius);
|
||||
// outline: 0; // @ Firefox, prevent dotted border after click
|
||||
// Set transparent border to prevent jumping when active node gets a border
|
||||
// (we can do this, because this theme doesn't use vertical lines)
|
||||
// border: 1px solid white; // Note: 'transparent' would not work in IE6
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Drag'n'drop support
|
||||
// *----------------------------------------------------------------------------*/
|
||||
///* ext-dnd5: */
|
||||
//span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
//}
|
||||
//
|
||||
///* ext-dnd: */
|
||||
//div.fancytree-drag-helper {
|
||||
// span.fancytree-childcounter,
|
||||
// span.fancytree-dnd-modifier {
|
||||
// display: inline-block;
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// min-width: 10px;
|
||||
// // min-height: 16px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// position: absolute;
|
||||
// // left: 16px;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// }
|
||||
// span.fancytree-dnd-modifier {
|
||||
// background: #5cb85c; // bootstrap green
|
||||
// border: none;
|
||||
// // min-height: 16px;
|
||||
// // font-size: 12px;
|
||||
// font-weight: bolder;
|
||||
// }
|
||||
// &.fancytree-drop-accept {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(2, 7);
|
||||
// }
|
||||
// }
|
||||
// &.fancytree-drop-reject {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(1, 7);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Drop marker icon *********************************************************/
|
||||
//#fancytree-drop-marker {
|
||||
// width: 2 * @fancy-icon-width; // was 24px, but 32 should be correct
|
||||
// position: absolute;
|
||||
// .useSprite(0, 8);
|
||||
// margin: 0;
|
||||
// &.fancytree-drop-after,
|
||||
// &.fancytree-drop-before {
|
||||
// width: 4 * @fancy-icon-width; // 64px;
|
||||
// .useSprite(0, 9);
|
||||
// }
|
||||
// &.fancytree-drop-copy {
|
||||
// .useSprite(4, 8);
|
||||
// }
|
||||
// &.fancytree-drop-move {
|
||||
// .useSprite(2, 8);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Source node while dragging ***********************************************/
|
||||
//
|
||||
//span.fancytree-drag-source {
|
||||
// &.fancytree-drag-remove {
|
||||
// // text-decoration: line-through;
|
||||
// opacity: 0.15;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Target node while dragging cursor is over it *****************************/
|
||||
//
|
||||
//span.fancytree-drop-target {
|
||||
// &.fancytree-drop-accept {
|
||||
// // outline: 1px dotted #5cb85c; // bootstrap sucess
|
||||
// }
|
||||
//}
|
||||
//span.fancytree-drop-reject {
|
||||
// // outline: 1px dotted #d9534f; // boostrap warning
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
.fancytree-container.fancytree-rtl {
|
||||
.fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/ /* optional: reverse title letters */
|
||||
}
|
||||
span.fancytree-connector,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-drag-helper-img {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
&.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
&.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl {
|
||||
ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
&.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("@{fancy-image-prefix}vline-rtl.gif");
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
&.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'table' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-table {
|
||||
// font-family: @fancy-font-family;
|
||||
// font-size: @fancy-font-size;
|
||||
// border-collapse: collapse;
|
||||
// span.fancytree-node {
|
||||
// display: inline-block; // #117
|
||||
// box-sizing: border-box; // #562
|
||||
// }
|
||||
// td.fancytree-status-merged {
|
||||
// text-align: center;
|
||||
// // font-weight: bold;
|
||||
// font-style: italic;
|
||||
// // line-height: 100px;
|
||||
// color: @fancy-font-color-dimm;
|
||||
// }
|
||||
// tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
// color: @fancy-font-error-color;
|
||||
// }
|
||||
// /* ext-ariagrid */
|
||||
// &.fancytree-ext-ariagrid.fancytree-cell-mode {
|
||||
// > tbody > tr.fancytree-active > td {
|
||||
// background-color: #eee;
|
||||
// }
|
||||
// > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #cbe8f6;
|
||||
// }
|
||||
// &.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #3875d7;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'columnview' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-columnview {
|
||||
// // border-collapse: collapse;
|
||||
// // width: 100%;
|
||||
// tbody tr td {
|
||||
// position: relative;
|
||||
// border: 1px solid gray;
|
||||
// vertical-align: top;
|
||||
// overflow: auto;
|
||||
// > ul {
|
||||
// padding: 0;
|
||||
// li {
|
||||
// list-style-image: none;
|
||||
// list-style-position: outside;
|
||||
// list-style-type: none;
|
||||
// -moz-background-clip: border;
|
||||
// -moz-background-inline-policy: continuous;
|
||||
// -moz-background-origin: padding;
|
||||
// background-attachment: scroll;
|
||||
// background-color: transparent;
|
||||
// .setBgPos(0, 0);
|
||||
// background-repeat: repeat-y;
|
||||
// background-image: none; /* no v-lines */
|
||||
//
|
||||
// margin: 0;
|
||||
// // padding: 1px 0 0 0; // issue #246
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// span.fancytree-node {
|
||||
// position: relative; /* allow positioning of embedded spans */
|
||||
// display: inline-block; // #117
|
||||
// }
|
||||
// span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #e0e0e0;
|
||||
// }
|
||||
// span.fancytree-node.fancytree-active {
|
||||
// background-color: #cbe8f6;
|
||||
// // background-color: royalblue;
|
||||
// }
|
||||
// .fancytree-has-children span.fancytree-cv-right {
|
||||
// position: absolute;
|
||||
// right: 3px;
|
||||
// .useSprite(0, 5);
|
||||
// &:hover {
|
||||
// .useSprite(1, 5);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'filter' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-filter-dimm {
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: bold;
|
||||
// }
|
||||
//}
|
||||
//.fancytree-ext-filter-hide {
|
||||
// tr.fancytree-hide,
|
||||
// span.fancytree-node.fancytree-hide {
|
||||
// display: none;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
//}
|
||||
///* Hide expanders if all child nodes are hidden by filter */
|
||||
//.fancytree-ext-filter-hide-expanders {
|
||||
// tr.fancytree-match span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
// visibility: visible;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//.fancytree-ext-childcounter,
|
||||
//.fancytree-ext-filter {
|
||||
// // span.fancytree-title mark {
|
||||
// // font-style: normal;
|
||||
// // background-color: #ead61c; // yellow
|
||||
// // border-radius: 3px;
|
||||
// // }
|
||||
// span.fancytree-icon,
|
||||
// span.fancytree-custom-icon {
|
||||
// position: relative;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #777; // #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// position: absolute;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// min-width: 10px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
//}
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'wide' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//ul.fancytree-ext-wide {
|
||||
// position: relative;
|
||||
// min-width: 100%;
|
||||
// z-index: 2;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
//
|
||||
// span.fancytree-node > span {
|
||||
// position: relative;
|
||||
// z-index: 2;
|
||||
// }
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// position: absolute; // Allow left: 0. Note: prevents smooth dropdown animation
|
||||
// z-index: 1; // Behind expander and checkbox
|
||||
// left: 0px;
|
||||
// min-width: 100%;
|
||||
// margin-left: 0;
|
||||
// margin-right: 0;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'fixed' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-fixed-wrapper {
|
||||
// .fancytree-ext-fixed-hidden {
|
||||
// display: none;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
// border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-right {
|
||||
// border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 3;
|
||||
// top: 0px;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tr {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// top: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-bl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-br {
|
||||
// position: absolute;
|
||||
// overflow: scroll;
|
||||
// z-index: 1;
|
||||
// }
|
||||
//}
|
||||
|
|
@ -0,0 +1,620 @@
|
|||
/*!
|
||||
* Fancytree "bootstrap" skin (highlighting the node span instead of title-only).
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: #c0c0c0;
|
||||
}
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin 1000ms infinite linear;
|
||||
animation: spin 1000ms infinite linear;
|
||||
}
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-container {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0;
|
||||
background-color: white;
|
||||
border: 1px dotted gray;
|
||||
min-height: 0%;
|
||||
position: relative;
|
||||
}
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 16px;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container ul > li:before {
|
||||
content: none;
|
||||
}
|
||||
ul.fancytree-container li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0em 0em;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
background-color: silver;
|
||||
}
|
||||
ul.fancytree-connectors.fancytree-container li {
|
||||
background-image: url("../skin-bootstrap-n/vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0em 0em;
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: 0px;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
display: inline-block;
|
||||
margin-left: 0.5em;
|
||||
background-position: 0em 0em;
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
margin-left: 0.5em;
|
||||
margin-top: 0px;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-expander {
|
||||
cursor: pointer;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
margin-top: 0;
|
||||
}
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
.fancytree-fade-expander:hover span.fancytree-expander,
|
||||
.fancytree-fade-expander.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander .fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander [class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Checkbox icon
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-checkbox {
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox {
|
||||
opacity: 0.4;
|
||||
filter: alpha(opacity=40);
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide span.fancytree-checkbox {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node:hover span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr:hover td span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr.fancytree-selected td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus tr.fancytree-active td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-icon {
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
/* Documents */
|
||||
/* Folders */
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: none;
|
||||
}
|
||||
/* Status node icons */
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit;
|
||||
width: 100%;
|
||||
margin-top: 1px;
|
||||
min-height: 1em;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: black;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
min-height: 1em;
|
||||
padding: 0 3px 0 3px;
|
||||
margin: 0px 0 0 0.5em;
|
||||
border: 1px solid transparent;
|
||||
-webkit-border-radius: 0px;
|
||||
-moz-border-radius: 0px;
|
||||
-ms-border-radius: 0px;
|
||||
-o-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: red;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Drag'n'drop support
|
||||
*----------------------------------------------------------------------------*/
|
||||
/* ext-dnd5: */
|
||||
span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
/* ext-dnd: */
|
||||
div.fancytree-drag-helper span.fancytree-childcounter,
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-childcounter {
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
background: #5cb85c;
|
||||
border: none;
|
||||
font-weight: bolder;
|
||||
}
|
||||
/*** Drop marker icon *********************************************************/
|
||||
#fancytree-drop-marker {
|
||||
width: 2em;
|
||||
position: absolute;
|
||||
margin: 0;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-after,
|
||||
#fancytree-drop-marker.fancytree-drop-before {
|
||||
width: 4em;
|
||||
}
|
||||
/*** Source node while dragging ***********************************************/
|
||||
span.fancytree-drag-source.fancytree-drag-remove {
|
||||
opacity: 0.15;
|
||||
}
|
||||
/*** Target node while dragging cursor is over it *****************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-container.fancytree-rtl .fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/
|
||||
/* optional: reverse title letters */
|
||||
}
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("../skin-bootstrap-n/vline-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl li.fancytree-lastsib,
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'table' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-table {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
border-collapse: collapse;
|
||||
/* ext-ariagrid */
|
||||
}
|
||||
table.fancytree-ext-table span.fancytree-node {
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
table.fancytree-ext-table td.fancytree-status-merged {
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
color: #c0c0c0;
|
||||
}
|
||||
table.fancytree-ext-table tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
color: red;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr.fancytree-active > td {
|
||||
background-color: #eee;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #3875d7;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'columnview' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-columnview tbody tr td {
|
||||
position: relative;
|
||||
border: 1px solid gray;
|
||||
vertical-align: top;
|
||||
overflow: auto;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul {
|
||||
padding: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0em 0em;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
/* no v-lines */
|
||||
margin: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node {
|
||||
position: relative;
|
||||
/* allow positioning of embedded spans */
|
||||
display: inline-block;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'filter' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-filter-dimm span.fancytree-node span.fancytree-title {
|
||||
color: #c0c0c0;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-hide,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-hide {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: #c0c0c0;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* Hide expanders if all child nodes are hidden by filter */
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-match span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-submatch span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
visibility: visible;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-icon,
|
||||
.fancytree-ext-filter span.fancytree-icon,
|
||||
.fancytree-ext-childcounter span.fancytree-custom-icon,
|
||||
.fancytree-ext-filter span.fancytree-custom-icon {
|
||||
position: relative;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-childcounter,
|
||||
.fancytree-ext-filter span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #777;
|
||||
border: 1px solid gray;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'wide' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-ext-wide {
|
||||
position: relative;
|
||||
min-width: 100%;
|
||||
z-index: 2;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node > span {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node span.fancytree-title {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: 0px;
|
||||
min-width: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'fixed' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-fixed-wrapper .fancytree-ext-fixed-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-right {
|
||||
border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 3;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tr {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
top: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-bl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-br {
|
||||
position: absolute;
|
||||
overflow: scroll;
|
||||
z-index: 1;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 1.5em;
|
||||
margin: 0;
|
||||
}
|
||||
/* Prevent focus frame */
|
||||
.fancytree-container:focus {
|
||||
outline: none;
|
||||
}
|
||||
.fancytree-container span.fancytree-statusnode-error span.fancytree-expander {
|
||||
color: red;
|
||||
}
|
||||
span.fancytree-node {
|
||||
border: 1px solid transparent;
|
||||
border-radius: 3px;
|
||||
padding-left: 8px;
|
||||
}
|
||||
span.fancytree-title {
|
||||
border-radius: 3px;
|
||||
}
|
||||
span.fancytree-node.fancytree-selected {
|
||||
background-color: #80c780;
|
||||
border-color: #80c780;
|
||||
}
|
||||
span.fancytree-node.fancytree-selected span.fancytree-title {
|
||||
background-color: #80c780;
|
||||
}
|
||||
span.fancytree-node.fancytree-active {
|
||||
background-color: #6aa3d5;
|
||||
}
|
||||
.fancytree-container.fancytree-treefocus span.fancytree-node:hover {
|
||||
background-color: #e9f2f9;
|
||||
}
|
||||
.fancytree-container.fancytree-treefocus span.fancytree-node.fancytree-focused {
|
||||
border-color: #428bca;
|
||||
}
|
||||
.fancytree-container.fancytree-treefocus span.fancytree-node.fancytree-selected {
|
||||
background-color: #5cb85c;
|
||||
}
|
||||
.fancytree-container.fancytree-treefocus span.fancytree-node.fancytree-selected span.fancytree-title {
|
||||
background-color: #5cb85c;
|
||||
}
|
||||
.fancytree-container.fancytree-treefocus span.fancytree-node.fancytree-active {
|
||||
background-color: #428bca;
|
||||
border-color: #428bca;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'table' extension
|
||||
*/
|
||||
table.fancytree-ext-table tbody tr td {
|
||||
border: 1px solid #eeeeee;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-selected {
|
||||
background-color: #80c780;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-selected span.fancytree-node {
|
||||
background-color: #80c780;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-selected span.fancytree-title {
|
||||
background-color: #80c780;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-active {
|
||||
background-color: #6aa3d5;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-active span.fancytree-node {
|
||||
background-color: #6aa3d5;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-treefocus tbody tr:hover {
|
||||
background-color: #e9f2f9;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-treefocus tbody tr.fancytree-focused span.fancytree-title {
|
||||
outline: 1px dotted #428bca;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-treefocus tbody tr.fancytree-selected {
|
||||
background-color: #5cb85c;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-treefocus tbody tr.fancytree-selected span.fancytree-node {
|
||||
background-color: #5cb85c;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-treefocus tbody tr.fancytree-selected span.fancytree-title {
|
||||
background-color: #5cb85c;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-treefocus tbody tr.fancytree-active {
|
||||
background-color: #428bca;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-treefocus tbody tr.fancytree-active span.fancytree-node {
|
||||
background-color: #428bca;
|
||||
}
|
||||
|
|
@ -0,0 +1,185 @@
|
|||
/*!
|
||||
* Fancytree "bootstrap" skin (highlighting the node span instead of title-only).
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
|
||||
// Import common styles
|
||||
@import "skin-common.less";
|
||||
|
||||
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
|
||||
|
||||
// local vars
|
||||
// @fancy-my-icon-size: 16px;
|
||||
|
||||
// Override the variable after the import.
|
||||
// NOTE: Variables are always resolved as the last definition, even if it is
|
||||
// after where it is used.
|
||||
@fancy-use-sprites: false; // false: suppress all background images (i.e. icons)
|
||||
@fancy-loading-url: none;
|
||||
|
||||
@fancy-icon-width: 1em;
|
||||
@fancy-icon-height: 1em;
|
||||
@fancy-line-height: 1em;
|
||||
@fancy-icon-spacing: 0.5em;
|
||||
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
// @fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
// Set to `true` to use `data-uri(...)` which will embed icons.gif into CSS
|
||||
// instead of linking to that file:
|
||||
// @fancy-inline-sprites: true;
|
||||
|
||||
// We need to define this variable here (not in skin-common.less) to make it
|
||||
// work with grunt and webpack:
|
||||
@fancy-image-prefix: "./skin-bootstrap-n/";
|
||||
|
||||
//default 10pt, which is used in a relative manner resulting in 13.3 in dokuwiki-template.
|
||||
@fancy-font-size: 93%; //@fancy-cst-size;
|
||||
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 1.5em;
|
||||
margin: 0;
|
||||
}
|
||||
/* Prevent focus frame */
|
||||
.fancytree-container:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
// Error status node
|
||||
.fancytree-container span.fancytree-statusnode-error span.fancytree-expander {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
/////
|
||||
// Original bootstrap colors (http://getbootstrap.com/css/#responsive-utilities)
|
||||
@gray-darker: lighten(#000, 13.5%); // #222
|
||||
@gray-dark: lighten(#000, 20%); // #333
|
||||
@gray: lighten(#000, 33.5%); // #555
|
||||
@gray-light: lighten(#000, 60%); // #999
|
||||
@gray-lighter: lighten(#000, 93.5%); // #eee
|
||||
|
||||
@brand-primary: #428bca; // blue
|
||||
@brand-success: #5cb85c; // green
|
||||
@brand-info: #5bc0de; // light blue
|
||||
@brand-warning: #f0ad4e; // orange
|
||||
@brand-danger: #d9534f; // red
|
||||
|
||||
@border-radius-base: 4px;
|
||||
@border-radius-large: 6px;
|
||||
@border-radius-small: 3px;
|
||||
/////////////
|
||||
|
||||
span.fancytree-node {
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
border-radius: @border-radius-small;
|
||||
padding-left: 8px;
|
||||
color: @fancy-font-color; //set icon color to font color as well
|
||||
}
|
||||
span.fancytree-title {
|
||||
border-radius: @border-radius-small;
|
||||
}
|
||||
// Inactive tree:
|
||||
span.fancytree-node.fancytree-selected { // selected nodes inside inactive tree
|
||||
background-color: lighten(@brand-success, 10%);
|
||||
border-color: lighten(@brand-success, 10%);
|
||||
span.fancytree-title {
|
||||
background-color: lighten(@brand-success, 10%); // green title, even when active
|
||||
}
|
||||
}
|
||||
span.fancytree-node.fancytree-active { // active nodes inside inactive tree
|
||||
background-color: lighten(@brand-primary, 10%);
|
||||
}
|
||||
// Active tree:
|
||||
.fancytree-container.fancytree-treefocus {
|
||||
span.fancytree-node:hover {
|
||||
background-color: lighten(@brand-primary, 42%);
|
||||
}
|
||||
span.fancytree-node.fancytree-focused {
|
||||
border-color: @brand-primary;
|
||||
}
|
||||
span.fancytree-node.fancytree-selected {
|
||||
background-color: @brand-success;
|
||||
span.fancytree-title {
|
||||
background-color: @brand-success; // green title, even when active
|
||||
}
|
||||
}
|
||||
span.fancytree-node.fancytree-active {
|
||||
background-color: @brand-primary;
|
||||
border-color: @brand-primary;
|
||||
}
|
||||
}
|
||||
|
||||
///*******************************************************************************
|
||||
// * 'table' extension
|
||||
// */
|
||||
//table.fancytree-ext-table tbody {
|
||||
// tr td {
|
||||
// border: 1px solid @gray-lighter;
|
||||
// }
|
||||
// // span.fancytree-node,
|
||||
// // span.fancytree-node:hover { // undo standard tree css
|
||||
// // border: none;
|
||||
// // background: none;
|
||||
// // }
|
||||
// // // Title get's a white background, when hovered. Undo standard node formatting
|
||||
// // span.fancytree-title:hover {
|
||||
// // border: none;
|
||||
// // background: inherit;
|
||||
// // background: transparent;
|
||||
// // background: none;
|
||||
// // filter: none;
|
||||
// // }
|
||||
// // dimmed, if inside inactive tree
|
||||
// tr.fancytree-selected {
|
||||
// background-color: lighten(@brand-success, 10%);
|
||||
// span.fancytree-node {
|
||||
// background-color: lighten(@brand-success, 10%);
|
||||
// }
|
||||
// span.fancytree-title {
|
||||
// background-color: lighten(@brand-success, 10%); // green title, even when active
|
||||
// }
|
||||
// }
|
||||
// tr.fancytree-active { // dimmed, if inside inactive tree
|
||||
// background-color: lighten(@brand-primary, 10%);
|
||||
// span.fancytree-node {
|
||||
// background-color: lighten(@brand-primary, 10%);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//table.fancytree-ext-table.fancytree-treefocus tbody {
|
||||
// tr:hover {
|
||||
// background-color: lighten(@brand-primary, 42%);
|
||||
// // outline: 1px solid @brand-primary;
|
||||
// }
|
||||
// tr.fancytree-focused span.fancytree-title {
|
||||
// outline: 1px dotted @brand-primary;
|
||||
// }
|
||||
// tr.fancytree-active:hover,
|
||||
// tr.fancytree-selected:hover {
|
||||
// // background-color: #CBE8F6;
|
||||
// // outline: 1px solid #26A0DA;
|
||||
// }
|
||||
// tr.fancytree-selected {
|
||||
// background-color: @brand-success;
|
||||
// span.fancytree-node {
|
||||
// background-color: @brand-success;
|
||||
// }
|
||||
// span.fancytree-title {
|
||||
// background-color: @brand-success; // green title, even when active
|
||||
// }
|
||||
// }
|
||||
// tr.fancytree-active {
|
||||
// background-color: @brand-primary;
|
||||
// span.fancytree-node {
|
||||
// background-color: @brand-primary;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
6
plugins/55/indexmenu/scripts/fancytree/skin-bootstrap-n/ui.fancytree.min.css
vendored
Normal file
6
plugins/55/indexmenu/scripts/fancytree/skin-bootstrap-n/ui.fancytree.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 842 B |
Binary file not shown.
|
After Width: | Height: | Size: 844 B |
1065
plugins/55/indexmenu/scripts/fancytree/skin-bootstrap/boot.css
Normal file
1065
plugins/55/indexmenu/scripts/fancytree/skin-bootstrap/boot.css
Normal file
File diff suppressed because it is too large
Load diff
|
|
@ -0,0 +1,972 @@
|
|||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
|
||||
// Variables (defaults, may be overwritten by the including .less files)
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
// @fancy-hide-connectors: true; // false: show vertical connector lines
|
||||
|
||||
@fancy-level-indent: 16px;
|
||||
@fancy-line-height: 16px; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-line-ofs-top: (@fancy-line-height - @fancy-icon-height) / 2;
|
||||
|
||||
// webpack uses /dist/skin-common.less as root path
|
||||
// grunt-less uses /dist/skin-Xxx/ui.fancyree.less as root path
|
||||
// So we define our theme LESS files for webpack compatibility, i.e.
|
||||
// define the image path n every main LESS file instead of here.
|
||||
// Prefix may be set to "", "/", "./", or any other value
|
||||
// Note: this variable must be defined by the main LESS files:
|
||||
// @fancy-image-prefix: "";
|
||||
|
||||
// Use 'url(...)' to link to the throbber image, or
|
||||
// use data-uri(...)' to inline the data in css instead:
|
||||
/* CHANGE use url, as less does not handel data-uri() correct. DokuWiki can eventually inline it */
|
||||
@fancy-loading-url: url("@{fancy-image-prefix}loading.gif");
|
||||
//@fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false; // data-uri() is not handle correct by phpless
|
||||
|
||||
@fancy-font-size: 10pt;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: black;
|
||||
@fancy-font-color-dimm: #c0c0c0;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
// Mixins
|
||||
//------------------------------------------------------------------------------
|
||||
.setBgPos(@x, @y, @cond:true) when (@cond) {
|
||||
background-position: (@x * -@fancy-icon-width) (@y * -@fancy-icon-height);
|
||||
}
|
||||
.clearBgImage(@cond:true) when (@cond) {
|
||||
background-image: none;
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and not (@fancy-inline-sprites) {
|
||||
background-image: url("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and (@fancy-inline-sprites) {
|
||||
background-image: data-uri("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.useSprite(@x, @y) when (@fancy-use-sprites) {
|
||||
.setBgPos(@x, @y);
|
||||
}
|
||||
.rounded-corners(@radius) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
-ms-border-radius: @radius;
|
||||
-o-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor) {
|
||||
border-color: @bordercolor;
|
||||
background: @bgcolor;
|
||||
color: @color;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor, @startColor, @stopColor) {
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor);
|
||||
// @c-start: argb(@startColor);
|
||||
// @c-end: argb(@stopColor);
|
||||
background: -moz-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // FF3.6+
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, @startColor),
|
||||
color-stop(100%, @stopColor)
|
||||
); // Chrome,Safari4+
|
||||
background: -webkit-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Chrome10+,Safari5.1+
|
||||
background: -o-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Opera 11.10+
|
||||
background: -ms-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // IE10+
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // W3C
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{stopColor}',GradientType=0 ); // IE6-9
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
// Redefine, in case jQuery-UI is not included
|
||||
// .ui-helper-hidden,
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
// tri-state checkbox
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: @fancy-font-color-dimm;
|
||||
}
|
||||
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
/* CHANGE: renamed spin to spin-fancytree */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin-fancytree 1000ms infinite linear;
|
||||
animation: spin-fancytree 1000ms infinite linear;
|
||||
}
|
||||
/* CHANGE: commented because it is wrong prefixed by phpless
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
*/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
ul.fancytree-container {
|
||||
font-family: @fancy-font-family;
|
||||
font-size: @fancy-font-size;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0; // DT issue 201
|
||||
//background-color: white; CHANGE
|
||||
//border: 1px dotted gray; CHANGE
|
||||
// overflow: auto; // ext-dnd5: otherwise this is always the scroll parent
|
||||
// height: 100%; // DT issue 263, 470
|
||||
min-height: 0%; // #192
|
||||
position: relative; // #235
|
||||
ul {
|
||||
padding: 0 0 0 @fancy-level-indent;
|
||||
margin: 0;
|
||||
}
|
||||
ul > li:before {
|
||||
// #538
|
||||
content: none;
|
||||
}
|
||||
li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
.setBgPos(0, 0);
|
||||
background-repeat: repeat-y;
|
||||
background-image: none; // no v-lines
|
||||
|
||||
margin: 0;
|
||||
// padding: 1px 0 0 0; // issue #246
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Style, when control is disabled
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
// filter: alpha(opacity=50); // Yields a css warning
|
||||
background-color: silver;
|
||||
}
|
||||
|
||||
ul.fancytree-connectors.fancytree-container {
|
||||
li {
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
/* CHANGE: phpless does not handle data-uri() correct */
|
||||
//background-image: data-uri("@{fancy-image-prefix}vline.gif");
|
||||
background-image: url("@{fancy-image-prefix}vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Suppress lines for last child node
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
// Fix jQuery UI 'blind' animation for jQuery UI (#717)
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
// display: -moz-inline-box; // @ FF 1+2 removed for issue 221
|
||||
// -moz-box-align: start; /* issue 221 */
|
||||
display: inline-block; // Required to make a span sizeable
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
// background-position: left;
|
||||
.setBgImageUrl("icons.gif");
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
display: inline-block;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-expander {
|
||||
// .useSprite(0, 5);
|
||||
cursor: pointer;
|
||||
}
|
||||
// span.fancytree-expander:hover {
|
||||
// // .useSprite(1, 5);
|
||||
// }
|
||||
|
||||
// --- End nodes (use connectors instead of expanders)
|
||||
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
// .clearBgImage( @fancy-hide-connectors );
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors {
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander, // End-node, not last sibling
|
||||
.fancytree-exp-n span.fancytree-expander:hover {
|
||||
.useSprite(0, 4);
|
||||
}
|
||||
.fancytree-exp-nl span.fancytree-expander, // End-node, last sibling
|
||||
.fancytree-exp-nl span.fancytree-expander:hover {
|
||||
.useSprite(1, 4);
|
||||
}
|
||||
}
|
||||
|
||||
// --- Collapsed
|
||||
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
// Collapsed, not delayed, not last sibling
|
||||
.useSprite(0, 5);
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
.useSprite(1, 5);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
// Collapsed, not delayed, last sibling
|
||||
.useSprite(0, 6);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
.useSprite(1, 6);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
// Collapsed, delayed, not last sibling
|
||||
.useSprite(4, 5);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
.useSprite(5, 5);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
// Collapsed, delayed, last sibling
|
||||
.useSprite(4, 6);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
.useSprite(5, 6);
|
||||
}
|
||||
|
||||
// --- Expanded
|
||||
|
||||
.fancytree-exp-e span.fancytree-expander, // Expanded, not delayed, not last sibling
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
// Expanded, delayed, not last sibling
|
||||
.useSprite(2, 5);
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
.useSprite(3, 5);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander, // Expanded, not delayed, last sibling
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
// Expanded, delayed, last sibling
|
||||
.useSprite(2, 6);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
.useSprite(3, 6);
|
||||
}
|
||||
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander {
|
||||
span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover span.fancytree-expander,
|
||||
&.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-treefocus span.fancytree-expander,
|
||||
[class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Checkbox icon
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//span.fancytree-checkbox {
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
// .useSprite(0, 2);
|
||||
// &:hover {
|
||||
// .useSprite(1, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(1, 3);
|
||||
// }
|
||||
//}
|
||||
//.fancytree-partsel span.fancytree-checkbox {
|
||||
// .useSprite(4, 2);
|
||||
// &:hover {
|
||||
// .useSprite(5, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(4, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(5, 3);
|
||||
// }
|
||||
//}
|
||||
//// selected after partsel, so it takes precedence:
|
||||
//.fancytree-selected span.fancytree-checkbox {
|
||||
// .useSprite(2, 2);
|
||||
// &:hover {
|
||||
// .useSprite(3, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(3, 3);
|
||||
// }
|
||||
//}
|
||||
//// Unselectable is dimmed, without hover effects
|
||||
//.fancytree-unselectable {
|
||||
// span.fancytree-checkbox {
|
||||
// opacity: 0.4;
|
||||
// filter: alpha(opacity=40);
|
||||
// }
|
||||
// span.fancytree-checkbox:hover {
|
||||
// .useSprite(0, 2);
|
||||
// }
|
||||
// span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
// .useSprite(4, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox:hover {
|
||||
// .useSprite(2, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//// Auto-hide checkboxes unless selected or hovered
|
||||
//.fancytree-container.fancytree-checkbox-auto-hide {
|
||||
// span.fancytree-checkbox {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .fancytree-node:hover span.fancytree-checkbox,
|
||||
// tr:hover td span.fancytree-checkbox,
|
||||
// .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
// tr.fancytree-selected td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// &.fancytree-treefocus {
|
||||
// .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
// tr.fancytree-active td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-icon {
|
||||
// Default icon
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
// .useSprite(0, 0);
|
||||
}
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(1, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(3, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
.useSprite(5, 0);
|
||||
}
|
||||
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
.useSprite(0, 1);
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(1, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(3, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
.useSprite(5, 1);
|
||||
}
|
||||
|
||||
// 'Loading' status overrides all others
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: @fancy-loading-url;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Status node icons */
|
||||
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
.useSprite(0, 7);
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit; // #117, resolves to 'display: list-item;' for standard trees
|
||||
width: 100%;
|
||||
margin-top: @fancy-node-v-spacing;
|
||||
min-height: @fancy-line-height;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: @fancy-font-color; // inherit doesn't work on IE
|
||||
cursor: pointer;
|
||||
display: inline-block; // Better alignment, when title contains <br>
|
||||
vertical-align: top;
|
||||
min-height: @fancy-line-height;
|
||||
padding: 0 3px 0 3px; // Otherwise italic font will be outside right bounds
|
||||
margin: @fancy-title-ofs-top 0 0 @fancy-icon-spacing;
|
||||
// margin: 0px;
|
||||
// margin-top: @fancy-line-ofs-top;
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
.rounded-corners(@fancy-node-border-radius);
|
||||
// outline: 0; // @ Firefox, prevent dotted border after click
|
||||
// Set transparent border to prevent jumping when active node gets a border
|
||||
// (we can do this, because this theme doesn't use vertical lines)
|
||||
// border: 1px solid white; // Note: 'transparent' would not work in IE6
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Drag'n'drop support
|
||||
// *----------------------------------------------------------------------------*/
|
||||
///* ext-dnd5: */
|
||||
//span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
//}
|
||||
//
|
||||
///* ext-dnd: */
|
||||
//div.fancytree-drag-helper {
|
||||
// span.fancytree-childcounter,
|
||||
// span.fancytree-dnd-modifier {
|
||||
// display: inline-block;
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// min-width: 10px;
|
||||
// // min-height: 16px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// position: absolute;
|
||||
// // left: 16px;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// }
|
||||
// span.fancytree-dnd-modifier {
|
||||
// background: #5cb85c; // bootstrap green
|
||||
// border: none;
|
||||
// // min-height: 16px;
|
||||
// // font-size: 12px;
|
||||
// font-weight: bolder;
|
||||
// }
|
||||
// &.fancytree-drop-accept {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(2, 7);
|
||||
// }
|
||||
// }
|
||||
// &.fancytree-drop-reject {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(1, 7);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Drop marker icon *********************************************************/
|
||||
//#fancytree-drop-marker {
|
||||
// width: 2 * @fancy-icon-width; // was 24px, but 32 should be correct
|
||||
// position: absolute;
|
||||
// .useSprite(0, 8);
|
||||
// margin: 0;
|
||||
// &.fancytree-drop-after,
|
||||
// &.fancytree-drop-before {
|
||||
// width: 4 * @fancy-icon-width; // 64px;
|
||||
// .useSprite(0, 9);
|
||||
// }
|
||||
// &.fancytree-drop-copy {
|
||||
// .useSprite(4, 8);
|
||||
// }
|
||||
// &.fancytree-drop-move {
|
||||
// .useSprite(2, 8);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Source node while dragging ***********************************************/
|
||||
//
|
||||
//span.fancytree-drag-source {
|
||||
// &.fancytree-drag-remove {
|
||||
// // text-decoration: line-through;
|
||||
// opacity: 0.15;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Target node while dragging cursor is over it *****************************/
|
||||
//
|
||||
//span.fancytree-drop-target {
|
||||
// &.fancytree-drop-accept {
|
||||
// // outline: 1px dotted #5cb85c; // bootstrap sucess
|
||||
// }
|
||||
//}
|
||||
//span.fancytree-drop-reject {
|
||||
// // outline: 1px dotted #d9534f; // boostrap warning
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
.fancytree-container.fancytree-rtl {
|
||||
.fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/ /* optional: reverse title letters */
|
||||
}
|
||||
span.fancytree-connector,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-drag-helper-img {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
&.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
&.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl {
|
||||
ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
&.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("@{fancy-image-prefix}vline-rtl.gif");
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
&.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'table' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-table {
|
||||
// font-family: @fancy-font-family;
|
||||
// font-size: @fancy-font-size;
|
||||
// border-collapse: collapse;
|
||||
// span.fancytree-node {
|
||||
// display: inline-block; // #117
|
||||
// box-sizing: border-box; // #562
|
||||
// }
|
||||
// td.fancytree-status-merged {
|
||||
// text-align: center;
|
||||
// // font-weight: bold;
|
||||
// font-style: italic;
|
||||
// // line-height: 100px;
|
||||
// color: @fancy-font-color-dimm;
|
||||
// }
|
||||
// tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
// color: @fancy-font-error-color;
|
||||
// }
|
||||
// /* ext-ariagrid */
|
||||
// &.fancytree-ext-ariagrid.fancytree-cell-mode {
|
||||
// > tbody > tr.fancytree-active > td {
|
||||
// background-color: #eee;
|
||||
// }
|
||||
// > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #cbe8f6;
|
||||
// }
|
||||
// &.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #3875d7;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'columnview' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-columnview {
|
||||
// // border-collapse: collapse;
|
||||
// // width: 100%;
|
||||
// tbody tr td {
|
||||
// position: relative;
|
||||
// border: 1px solid gray;
|
||||
// vertical-align: top;
|
||||
// overflow: auto;
|
||||
// > ul {
|
||||
// padding: 0;
|
||||
// li {
|
||||
// list-style-image: none;
|
||||
// list-style-position: outside;
|
||||
// list-style-type: none;
|
||||
// -moz-background-clip: border;
|
||||
// -moz-background-inline-policy: continuous;
|
||||
// -moz-background-origin: padding;
|
||||
// background-attachment: scroll;
|
||||
// background-color: transparent;
|
||||
// .setBgPos(0, 0);
|
||||
// background-repeat: repeat-y;
|
||||
// background-image: none; /* no v-lines */
|
||||
//
|
||||
// margin: 0;
|
||||
// // padding: 1px 0 0 0; // issue #246
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// span.fancytree-node {
|
||||
// position: relative; /* allow positioning of embedded spans */
|
||||
// display: inline-block; // #117
|
||||
// }
|
||||
// span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #e0e0e0;
|
||||
// }
|
||||
// span.fancytree-node.fancytree-active {
|
||||
// background-color: #cbe8f6;
|
||||
// // background-color: royalblue;
|
||||
// }
|
||||
// .fancytree-has-children span.fancytree-cv-right {
|
||||
// position: absolute;
|
||||
// right: 3px;
|
||||
// .useSprite(0, 5);
|
||||
// &:hover {
|
||||
// .useSprite(1, 5);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'filter' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-filter-dimm {
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: bold;
|
||||
// }
|
||||
//}
|
||||
//.fancytree-ext-filter-hide {
|
||||
// tr.fancytree-hide,
|
||||
// span.fancytree-node.fancytree-hide {
|
||||
// display: none;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
//}
|
||||
///* Hide expanders if all child nodes are hidden by filter */
|
||||
//.fancytree-ext-filter-hide-expanders {
|
||||
// tr.fancytree-match span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
// visibility: visible;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//.fancytree-ext-childcounter,
|
||||
//.fancytree-ext-filter {
|
||||
// // span.fancytree-title mark {
|
||||
// // font-style: normal;
|
||||
// // background-color: #ead61c; // yellow
|
||||
// // border-radius: 3px;
|
||||
// // }
|
||||
// span.fancytree-icon,
|
||||
// span.fancytree-custom-icon {
|
||||
// position: relative;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #777; // #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// position: absolute;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// min-width: 10px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
//}
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'wide' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//ul.fancytree-ext-wide {
|
||||
// position: relative;
|
||||
// min-width: 100%;
|
||||
// z-index: 2;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
//
|
||||
// span.fancytree-node > span {
|
||||
// position: relative;
|
||||
// z-index: 2;
|
||||
// }
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// position: absolute; // Allow left: 0. Note: prevents smooth dropdown animation
|
||||
// z-index: 1; // Behind expander and checkbox
|
||||
// left: 0px;
|
||||
// min-width: 100%;
|
||||
// margin-left: 0;
|
||||
// margin-right: 0;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'fixed' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-fixed-wrapper {
|
||||
// .fancytree-ext-fixed-hidden {
|
||||
// display: none;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
// border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-right {
|
||||
// border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 3;
|
||||
// top: 0px;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tr {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// top: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-bl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-br {
|
||||
// position: absolute;
|
||||
// overflow: scroll;
|
||||
// z-index: 1;
|
||||
// }
|
||||
//}
|
||||
|
|
@ -0,0 +1,680 @@
|
|||
/*!
|
||||
* Fancytree "bootstrap" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: #333333;
|
||||
}
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin 1000ms infinite linear;
|
||||
animation: spin 1000ms infinite linear;
|
||||
}
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-container {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0;
|
||||
background-color: white;
|
||||
border: 1px dotted gray;
|
||||
min-height: 0%;
|
||||
position: relative;
|
||||
}
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 16px;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container ul > li:before {
|
||||
content: none;
|
||||
}
|
||||
ul.fancytree-container li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0em 0em;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
background-color: silver;
|
||||
}
|
||||
ul.fancytree-connectors.fancytree-container li {
|
||||
background-image: url("../skin-bootstrap/vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0em 0em;
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: 2px;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
display: inline-block;
|
||||
margin-left: 0.5em;
|
||||
background-position: 0em 0em;
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
margin-left: 0.5em;
|
||||
margin-top: 2px;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-expander {
|
||||
cursor: pointer;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
margin-top: 0;
|
||||
}
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
.fancytree-fade-expander:hover span.fancytree-expander,
|
||||
.fancytree-fade-expander.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander .fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander [class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Checkbox icon
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-checkbox {
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox {
|
||||
opacity: 0.4;
|
||||
filter: alpha(opacity=40);
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide span.fancytree-checkbox {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node:hover span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr:hover td span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr.fancytree-selected td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus tr.fancytree-active td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-icon {
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
/* Documents */
|
||||
/* Folders */
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: none;
|
||||
}
|
||||
/* Status node icons */
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit;
|
||||
width: 100%;
|
||||
margin-top: 0px;
|
||||
min-height: 1em;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: #333333;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
min-height: 1em;
|
||||
padding: 0 3px 0 3px;
|
||||
margin: 0px 0 0 0.5em;
|
||||
border: 1px solid transparent;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
-ms-border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: #d9534f;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Drag'n'drop support
|
||||
*----------------------------------------------------------------------------*/
|
||||
/* ext-dnd5: */
|
||||
span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
/* ext-dnd: */
|
||||
div.fancytree-drag-helper span.fancytree-childcounter,
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-childcounter {
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
background: #5cb85c;
|
||||
border: none;
|
||||
font-weight: bolder;
|
||||
}
|
||||
/*** Drop marker icon *********************************************************/
|
||||
#fancytree-drop-marker {
|
||||
width: 2em;
|
||||
position: absolute;
|
||||
margin: 0;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-after,
|
||||
#fancytree-drop-marker.fancytree-drop-before {
|
||||
width: 4em;
|
||||
}
|
||||
/*** Source node while dragging ***********************************************/
|
||||
span.fancytree-drag-source.fancytree-drag-remove {
|
||||
opacity: 0.15;
|
||||
}
|
||||
/*** Target node while dragging cursor is over it *****************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-container.fancytree-rtl .fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/
|
||||
/* optional: reverse title letters */
|
||||
}
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("../skin-bootstrap/vline-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl li.fancytree-lastsib,
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'table' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-table {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
border-collapse: collapse;
|
||||
/* ext-ariagrid */
|
||||
}
|
||||
table.fancytree-ext-table span.fancytree-node {
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
table.fancytree-ext-table td.fancytree-status-merged {
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
color: #333333;
|
||||
}
|
||||
table.fancytree-ext-table tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
color: #d9534f;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr.fancytree-active > td {
|
||||
background-color: #eee;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #3875d7;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'columnview' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-columnview tbody tr td {
|
||||
position: relative;
|
||||
border: 1px solid gray;
|
||||
vertical-align: top;
|
||||
overflow: auto;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul {
|
||||
padding: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0em 0em;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
/* no v-lines */
|
||||
margin: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node {
|
||||
position: relative;
|
||||
/* allow positioning of embedded spans */
|
||||
display: inline-block;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'filter' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-filter-dimm span.fancytree-node span.fancytree-title {
|
||||
color: #333333;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-hide,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-hide {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: #333333;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* Hide expanders if all child nodes are hidden by filter */
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-match span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-submatch span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
visibility: visible;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-icon,
|
||||
.fancytree-ext-filter span.fancytree-icon,
|
||||
.fancytree-ext-childcounter span.fancytree-custom-icon,
|
||||
.fancytree-ext-filter span.fancytree-custom-icon {
|
||||
position: relative;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-childcounter,
|
||||
.fancytree-ext-filter span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #777;
|
||||
border: 1px solid gray;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'wide' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-ext-wide {
|
||||
position: relative;
|
||||
min-width: 100%;
|
||||
z-index: 2;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node > span {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node span.fancytree-title {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: 0px;
|
||||
min-width: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'fixed' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-fixed-wrapper .fancytree-ext-fixed-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-right {
|
||||
border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 3;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tr {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
top: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-bl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-br {
|
||||
position: absolute;
|
||||
overflow: scroll;
|
||||
z-index: 1;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
/*******************************************************************************
|
||||
* Plain tree
|
||||
* Modifier classes on <ul> container:
|
||||
* table-hover : Enable a light mouse hover effect
|
||||
* fancytree-colorize-selected: Give selected (checked) rows a color
|
||||
*/
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 1.5em;
|
||||
margin: 0;
|
||||
}
|
||||
/* Prevent focus frame */
|
||||
.fancytree-container:focus {
|
||||
outline: none;
|
||||
}
|
||||
.fancytree-container .fancytree-active span.fancytree-title input,
|
||||
.fancytree-container.fancytree-colorize-selected .fancytree-selected span.fancytree-title input {
|
||||
color: black;
|
||||
}
|
||||
.fancytree-container span.fancytree-statusnode-error span.fancytree-expander {
|
||||
color: #d9534f;
|
||||
}
|
||||
div.fancytree-drag-helper.fancytree-drop-reject,
|
||||
div.fancytree-drag-helper.fancytree-drop-reject span.fancytree-title {
|
||||
color: #d9534f;
|
||||
}
|
||||
span.fancytree-node.fancytree-drag-source {
|
||||
background-color: #5bc0de !important;
|
||||
}
|
||||
span.fancytree-node.fancytree-drop-target.fancytree-drop-reject span.fancytree.title {
|
||||
background-color: #d9534f !important;
|
||||
}
|
||||
span.fancytree-expander {
|
||||
color: #999;
|
||||
}
|
||||
.fancytree-expanded span.fancytree-expander {
|
||||
color: #333333;
|
||||
}
|
||||
span.fancytree-node span.fancytree-expander:hover {
|
||||
color: cyan;
|
||||
}
|
||||
.fancytree-plain.fancytree-colorize-selected span.fancytree-node.fancytree-selected,
|
||||
.fancytree-plain.fancytree-colorize-selected span.fancytree-node.fancytree-selected span.fancytree-title {
|
||||
background-color: #80c780;
|
||||
border-color: #80c780;
|
||||
color: #fff;
|
||||
}
|
||||
.fancytree-plain.fancytree-colorize-selected span.fancytree-node.fancytree-selected:hover span.fancytree-title {
|
||||
background-color: #6ec06e;
|
||||
}
|
||||
.fancytree-plain.fancytree-colorize-selected span.fancytree-node.fancytree-active.fancytree-selected span.fancytree-title {
|
||||
color: #80c780;
|
||||
}
|
||||
.fancytree-plain.fancytree-colorize-selected.fancytree-treefocus span.fancytree-title:hover {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.fancytree-plain.fancytree-colorize-selected.fancytree-treefocus span.fancytree-node.fancytree-selected span.fancytree-title {
|
||||
background-color: #5cb85c;
|
||||
}
|
||||
.fancytree-plain.fancytree-colorize-selected.fancytree-treefocus span.fancytree-node.fancytree-selected:hover span.fancytree-title {
|
||||
background-color: #4cae4c;
|
||||
}
|
||||
.fancytree-plain.fancytree-colorize-selected.fancytree-treefocus span.fancytree-node.fancytree-active.fancytree-selected span.fancytree-title {
|
||||
color: #5cb85c;
|
||||
}
|
||||
.fancytree-plain.fancytree-container span.fancytree-node {
|
||||
margin-top: 2px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
.fancytree-plain.fancytree-container span.fancytree-title {
|
||||
border: 1px solid transparent;
|
||||
border-radius: 3px;
|
||||
outline-radius: 3px;
|
||||
}
|
||||
.fancytree-plain.fancytree-container span.fancytree-title:hover {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.fancytree-plain.fancytree-container span.fancytree-node.fancytree-active span.fancytree-title {
|
||||
background-color: #5094ce;
|
||||
color: #fff;
|
||||
}
|
||||
.fancytree-plain.fancytree-container span.fancytree-node.fancytree-active:hover span.fancytree-title {
|
||||
background-color: #3c87c8;
|
||||
}
|
||||
.fancytree-plain.fancytree-container.fancytree-ext-wide span.fancytree-node.fancytree-active {
|
||||
color: #fff;
|
||||
}
|
||||
.fancytree-plain.fancytree-container.fancytree-treefocus span.fancytree-node.fancytree-focused span.fancytree-title {
|
||||
border-color: #337ab7;
|
||||
}
|
||||
.fancytree-plain.fancytree-container.fancytree-treefocus span.fancytree-node.fancytree-active span.fancytree-title {
|
||||
background-color: #337ab7;
|
||||
border-color: #337ab7;
|
||||
}
|
||||
.fancytree-plain.fancytree-container.fancytree-treefocus span.fancytree-node.fancytree-active:hover span.fancytree-title {
|
||||
background-color: #2e6da4;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'table' extension
|
||||
* Modifier classes on <table>:
|
||||
* table-hover : Enable a light mouse hover effect
|
||||
* fancytree-colorize-selected: Give selected (checked) rows a color
|
||||
*/
|
||||
table.fancytree-ext-table > tbody > tr > td span.fancytree-title {
|
||||
border: none;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-colorize-selected > tbody > tr.fancytree-selected > td {
|
||||
background-color: #80c780;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-colorize-selected > tbody > tr.fancytree-selected > td,
|
||||
table.fancytree-ext-table.fancytree-colorize-selected > tbody > tr.fancytree-selected > td span.fancytree-title {
|
||||
color: #fff;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-colorize-selected.fancytree-treefocus > tbody > tr.fancytree-selected > td {
|
||||
background-color: #5cb85c;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-colorize-selected.table-hover > tbody > tr.fancytree-selected:hover > td {
|
||||
background-color: #6ec06e;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-colorize-selected.fancytree-treefocus.table-hover > tbody > tr.fancytree-selected:hover > td {
|
||||
background-color: #4cae4c;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-colorize-selected.fancytree-treefocus.table-hover > tbody > tr.fancytree-selected.fancytree-active:hover > td,
|
||||
table.fancytree-ext-table.fancytree-colorize-selected.table-hover > tbody > tr.fancytree-selected.fancytree-active:hover > td {
|
||||
background-color: #2e6da4;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-colorize-selected > tbody > tr.fancytree-active.fancytree-selected {
|
||||
outline-width: 2px;
|
||||
outline-offset: -2px;
|
||||
outline-style: solid;
|
||||
outline-color: #80c780;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-container > tbody > tr.fancytree-active > td {
|
||||
background-color: #5094ce;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-container > tbody > tr.fancytree-active > td,
|
||||
table.fancytree-ext-table.fancytree-container > tbody > tr.fancytree-active > td span.fancytree-title {
|
||||
color: #fff;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-treefocus.fancytree-container > tbody > tr.fancytree-focused span.fancytree-title {
|
||||
outline: 1px dotted #000;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-treefocus.fancytree-container > tbody > tr.fancytree-active > td {
|
||||
background-color: #337ab7;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-treefocus.fancytree-container.table-hover > tbody > tr.fancytree-active:hover > td {
|
||||
background-color: #2e6da4;
|
||||
}
|
||||
|
|
@ -0,0 +1,356 @@
|
|||
/*!
|
||||
* Fancytree "bootstrap" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
|
||||
// Import common styles
|
||||
@import "skin-common.less";
|
||||
|
||||
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
|
||||
|
||||
// local vars
|
||||
// @fancy-my-icon-size: 16px;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
// Original bootstrap colors
|
||||
// See http://getbootstrap.com/css/#less-variables-colors and
|
||||
// https://github.com/twbs/bootstrap/blob/master/less/variables.less
|
||||
@gray-base: #000;
|
||||
@gray-darker: lighten(@gray-base, 13.5%); // #222
|
||||
@gray-dark: lighten(@gray-base, 20%); // #333
|
||||
@gray: lighten(@gray-base, 33.5%); // #555
|
||||
@gray-light: lighten(@gray-base, 46.7%); // #777
|
||||
@gray-lighter: lighten(@gray-base, 93.5%); // #eee
|
||||
|
||||
@brand-primary: darken(#428bca, 6.5%); // blue, #337ab7
|
||||
@brand-success: #5cb85c; // green
|
||||
@brand-info: #5bc0de; // light blue
|
||||
@brand-warning: #f0ad4e; // orange
|
||||
@brand-danger: #d9534f; // red
|
||||
|
||||
@font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
@font-family-serif: Georgia, "Times New Roman", Times, serif;
|
||||
//** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`.
|
||||
@font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
|
||||
@font-family-base: @font-family-sans-serif;
|
||||
|
||||
@font-size-base: 14px;
|
||||
@font-size-large: ceil((@font-size-base * 1.25)); // ~18px
|
||||
@font-size-small: ceil((@font-size-base * 0.85)); // ~12px
|
||||
|
||||
@border-radius-base: 4px;
|
||||
@border-radius-large: 6px;
|
||||
@border-radius-small: 3px;
|
||||
|
||||
@text-color: @gray-dark;
|
||||
//** Default background color used for all tables.
|
||||
@table-bg: transparent;
|
||||
//** Background color used for `.table-striped`.
|
||||
@table-bg-accent: #f9f9f9;
|
||||
//** Background color used for `.table-hover`.
|
||||
@table-bg-hover: #f5f5f5;
|
||||
@table-bg-active: @table-bg-hover;
|
||||
|
||||
//** Border color for table and cell borders.
|
||||
@table-border-color: #ddd;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
|
||||
// Override the variable after the import.
|
||||
// NOTE: Variables are always resolved as the last definition, even if it is
|
||||
// after where it is used.
|
||||
@fancy-use-sprites: false; // false: suppress all background images (i.e. icons)
|
||||
@fancy-loading-url: none;
|
||||
|
||||
@fancy-line-height: 1em; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 0px; // gap between two node borders
|
||||
@fancy-icon-width: 1em;
|
||||
@fancy-icon-height: 1em;
|
||||
@fancy-icon-spacing: 0.5em; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 2px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: @border-radius-small;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
@fancy-font-family: @font-family-base;
|
||||
@fancy-font-size: @font-size-base;
|
||||
@fancy-font-color: @text-color;
|
||||
@fancy-font-color-dimm: @gray-dark;
|
||||
@fancy-font-error-color: @brand-danger;
|
||||
|
||||
@fancy-active-text: #fff;
|
||||
@fancy-active-color: @brand-primary;
|
||||
@fancy-select-color: @brand-success;
|
||||
@fancy-hover-color: @table-bg-hover;
|
||||
|
||||
// We need to define this variable here (not in skin-common.less) to make it
|
||||
// work with grunt and webpack:
|
||||
@fancy-image-prefix: "./skin-bootstrap/";
|
||||
|
||||
/*******************************************************************************
|
||||
* Plain tree
|
||||
* Modifier classes on <ul> container:
|
||||
* table-hover : Enable a light mouse hover effect
|
||||
* fancytree-colorize-selected: Give selected (checked) rows a color
|
||||
*/
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 1.5em;
|
||||
margin: 0;
|
||||
}
|
||||
/* Prevent focus frame */
|
||||
.fancytree-container:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
// Active and (optionally) selected nodes are white on colored bg. Undo this for input controls:
|
||||
.fancytree-container .fancytree-active span.fancytree-title input,
|
||||
.fancytree-container.fancytree-colorize-selected .fancytree-selected span.fancytree-title input {
|
||||
color: black;
|
||||
}
|
||||
|
||||
// Error status node
|
||||
.fancytree-container span.fancytree-statusnode-error span.fancytree-expander {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
// set icon color to font color as well
|
||||
span.fancytree-node {
|
||||
color: @fancy-font-color;
|
||||
}
|
||||
|
||||
//// ------------------------------------------------------------------------------
|
||||
//// * Drag'n'drop support
|
||||
//// *----------------------------------------------------------------------------
|
||||
//// div.fancytree-drag-helper {
|
||||
//// }
|
||||
//// div.fancytree-drag-helper a {
|
||||
//// border: 1px solid gray;
|
||||
//// background-color: white;
|
||||
//// padding-left: 5px;
|
||||
//// padding-right: 5px;
|
||||
//// opacity: 0.8;
|
||||
//// }
|
||||
//// span.fancytree-drag-helper-img {
|
||||
//// // position: relative;
|
||||
//// // left: -16px;
|
||||
//// }
|
||||
//div.fancytree-drag-helper.fancytree-drop-reject,
|
||||
//div.fancytree-drag-helper.fancytree-drop-reject span.fancytree-title
|
||||
//{
|
||||
// color: @fancy-font-error-color;
|
||||
//}
|
||||
//// div.fancytree-drop-accept span.fancytree-drag-helper-img {
|
||||
//// .useSprite(2, 7);
|
||||
//// }
|
||||
//// div.fancytree-drop-reject span.fancytree-drag-helper-img {
|
||||
//// .useSprite(1, 7);
|
||||
//// }
|
||||
//
|
||||
//// //--- Drop marker icon ---------------------------------------------------------
|
||||
//// #fancytree-drop-marker {
|
||||
//// width: 2 * @fancy-icon-width; // was 24px, but 32 should be correct
|
||||
//// position: absolute;
|
||||
//// .useSprite(0, 8);
|
||||
//// margin: 0;
|
||||
//// &.fancytree-drop-after,
|
||||
//// &.fancytree-drop-before {
|
||||
//// width: 4 * @fancy-icon-width; // 64px;
|
||||
//// .useSprite(0, 9);
|
||||
//// }
|
||||
//// &.fancytree-drop-copy {
|
||||
//// .useSprite(4, 8);
|
||||
//// }
|
||||
//// &.fancytree-drop-move {
|
||||
//// .useSprite(2, 8);
|
||||
//// }
|
||||
//// }
|
||||
////
|
||||
////--- Source node while dragging -----------------------------------------------
|
||||
//
|
||||
//span.fancytree-node.fancytree-drag-source {
|
||||
// background-color: @brand-info !important;
|
||||
// span.fancytree.title {
|
||||
// // outline: 1px solid @brand-info;
|
||||
// // color: @brand-primary;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
////--- Target node while dragging cursor is over it -----------------------------
|
||||
//
|
||||
//span.fancytree-node.fancytree-drop-target {
|
||||
// &.fancytree-drop-accept span.fancytree.title {
|
||||
// // background-color: @brand-danger !important;
|
||||
// // outline: 1px solid @brand-success;
|
||||
// // color: white !important;
|
||||
// }
|
||||
// &.fancytree-drop-reject span.fancytree.title {
|
||||
// background-color: @brand-danger !important;
|
||||
// // outline: 1px solid @brand-danger;
|
||||
// // color: white !important;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//span.fancytree-expander {
|
||||
// color: #999; // colpased expander is gray
|
||||
//}
|
||||
//.fancytree-expanded span.fancytree-expander {
|
||||
// color: @fancy-font-color;
|
||||
//}
|
||||
//span.fancytree-node span.fancytree-expander:hover {
|
||||
// color: cyan;
|
||||
//}
|
||||
|
||||
// Inactive tree:
|
||||
.fancytree-plain {
|
||||
&.fancytree-colorize-selected {
|
||||
span.fancytree-node.fancytree-selected,
|
||||
span.fancytree-node.fancytree-selected span.fancytree-title { // selected nodes inside inactive tree
|
||||
background-color: lighten(@fancy-select-color, 10%);
|
||||
border-color: lighten(@fancy-select-color, 10%);
|
||||
color: @fancy-active-text;
|
||||
}
|
||||
span.fancytree-node.fancytree-selected:hover span.fancytree-title {
|
||||
background-color: lighten(@fancy-select-color, 5%);
|
||||
}
|
||||
span.fancytree-node.fancytree-active.fancytree-selected span.fancytree-title { // active nodes inside inactive tree
|
||||
color: lighten(@fancy-select-color, 10%);
|
||||
}
|
||||
&.fancytree-treefocus {
|
||||
span.fancytree-title:hover {
|
||||
background-color: @fancy-hover-color;
|
||||
}
|
||||
span.fancytree-node.fancytree-selected span.fancytree-title {
|
||||
background-color: @fancy-select-color;
|
||||
}
|
||||
span.fancytree-node.fancytree-selected:hover span.fancytree-title {
|
||||
background-color: darken(@fancy-select-color, 5%);
|
||||
}
|
||||
span.fancytree-node.fancytree-active.fancytree-selected span.fancytree-title {
|
||||
color: @fancy-select-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.fancytree-container { // adding this class to increase specificity, so we can override .fancytree-colorize-selected
|
||||
span.fancytree-node {
|
||||
margin-top: 2px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
span.fancytree-title {
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
border-radius: @border-radius-small;
|
||||
outline-radius: @border-radius-small;
|
||||
}
|
||||
span.fancytree-title:hover {
|
||||
background-color: @fancy-hover-color;
|
||||
}
|
||||
span.fancytree-node.fancytree-active span.fancytree-title { // active nodes inside inactive tree
|
||||
background-color: lighten(@fancy-active-color, 10%);
|
||||
color: @fancy-active-text;
|
||||
}
|
||||
span.fancytree-node.fancytree-active:hover span.fancytree-title {
|
||||
background-color: lighten(@fancy-active-color, 5%);
|
||||
}
|
||||
&.fancytree-ext-wide span.fancytree-node.fancytree-active { // in wide mode, icons of active nodes must be white-on-color
|
||||
color: @fancy-active-text;
|
||||
}
|
||||
|
||||
// Active tree:
|
||||
&.fancytree-treefocus {
|
||||
span.fancytree-node.fancytree-focused span.fancytree-title {
|
||||
border-color: @brand-primary;
|
||||
}
|
||||
span.fancytree-node.fancytree-active span.fancytree-title {
|
||||
background-color: @fancy-active-color;
|
||||
border-color: @fancy-active-color;
|
||||
}
|
||||
span.fancytree-node.fancytree-active:hover span.fancytree-title {
|
||||
background-color: darken(@fancy-active-color, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
///*******************************************************************************
|
||||
// * 'table' extension
|
||||
// * Modifier classes on <table>:
|
||||
// * table-hover : Enable a light mouse hover effect
|
||||
// * fancytree-colorize-selected: Give selected (checked) rows a color
|
||||
// */
|
||||
//table.fancytree-ext-table {
|
||||
// >tbody >tr >td span.fancytree-title {
|
||||
// border: none;
|
||||
// }
|
||||
//
|
||||
// // Give a separate color for selected (checked) rows
|
||||
// // Define *before* the .fancytree-active rules, because active color should
|
||||
// // override selected color.
|
||||
// &.fancytree-colorize-selected {
|
||||
// >tbody >tr.fancytree-selected >td {
|
||||
// // dimmed, if inside inactive tree
|
||||
// background-color: lighten(@fancy-select-color, 10%);
|
||||
// // white text for selected nodes
|
||||
// &,
|
||||
// span.fancytree-title {
|
||||
// color: @fancy-active-text;
|
||||
// }
|
||||
// }
|
||||
// &.fancytree-treefocus >tbody >tr.fancytree-selected >td {
|
||||
// background-color: @fancy-select-color;
|
||||
// }
|
||||
// &.table-hover >tbody >tr.fancytree-selected:hover >td {
|
||||
// // dimmed, if inside inactive tree
|
||||
// background-color: lighten(@fancy-select-color, 5%);
|
||||
// }
|
||||
// &.fancytree-treefocus.table-hover >tbody >tr.fancytree-selected:hover >td {
|
||||
// background-color: darken(@fancy-select-color, 5%);
|
||||
// }
|
||||
// &.fancytree-treefocus.table-hover >tbody >tr.fancytree-selected.fancytree-active:hover >td,
|
||||
// &.table-hover >tbody >tr.fancytree-selected.fancytree-active:hover >td {
|
||||
// background-color: darken(@fancy-active-color, 5%);
|
||||
// }
|
||||
// >tbody >tr.fancytree-active.fancytree-selected {
|
||||
// outline-width: 2px;
|
||||
// outline-offset: -2px;
|
||||
// outline-style: solid;
|
||||
// outline-color: lighten(@fancy-select-color, 10%);
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// // General tree (slightly dimmed, since we also define colors for inactive
|
||||
// // mode here).
|
||||
//
|
||||
// &.fancytree-container >tbody >tr.fancytree-active >td {
|
||||
// background-color: lighten(@fancy-active-color, 10%);
|
||||
// // white text for selected nodes
|
||||
// &,
|
||||
// span.fancytree-title {
|
||||
// color: @fancy-active-text;
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// // Reset to standard colors if tree has keyboard focus.
|
||||
// // We add .fancytree-container to increase specificity, so we can override
|
||||
// // .fancytree-colorize-selected defined above
|
||||
//
|
||||
// &.fancytree-treefocus.fancytree-container {
|
||||
// >tbody >tr.fancytree-focused span.fancytree-title {
|
||||
// outline: 1px dotted #000;
|
||||
// }
|
||||
// >tbody >tr.fancytree-active >td {
|
||||
// background-color: @fancy-active-color;
|
||||
// }
|
||||
// &.table-hover >tbody >tr.fancytree-active:hover >td {
|
||||
// background-color: darken(@fancy-active-color, 5%);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
6
plugins/55/indexmenu/scripts/fancytree/skin-bootstrap/ui.fancytree.min.css
vendored
Normal file
6
plugins/55/indexmenu/scripts/fancytree/skin-bootstrap/ui.fancytree.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 842 B |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-bootstrap/vline.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-bootstrap/vline.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 844 B |
972
plugins/55/indexmenu/scripts/fancytree/skin-common.less
Normal file
972
plugins/55/indexmenu/scripts/fancytree/skin-common.less
Normal file
|
|
@ -0,0 +1,972 @@
|
|||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
|
||||
// Variables (defaults, may be overwritten by the including .less files)
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
// @fancy-hide-connectors: true; // false: show vertical connector lines
|
||||
|
||||
@fancy-level-indent: 16px;
|
||||
@fancy-line-height: 16px; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-line-ofs-top: (@fancy-line-height - @fancy-icon-height) / 2;
|
||||
|
||||
// webpack uses /dist/skin-common.less as root path
|
||||
// grunt-less uses /dist/skin-Xxx/ui.fancyree.less as root path
|
||||
// So we define our theme LESS files for webpack compatibility, i.e.
|
||||
// define the image path n every main LESS file instead of here.
|
||||
// Prefix may be set to "", "/", "./", or any other value
|
||||
// Note: this variable must be defined by the main LESS files:
|
||||
// @fancy-image-prefix: "";
|
||||
|
||||
// Use 'url(...)' to link to the throbber image, or
|
||||
// use data-uri(...)' to inline the data in css instead:
|
||||
/* CHANGE use url, as less does not handel data-uri() correct. DokuWiki can eventually inline it */
|
||||
@fancy-loading-url: url("@{fancy-image-prefix}loading.gif");
|
||||
//@fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false; // data-uri() is not handle correct by phpless
|
||||
|
||||
@fancy-font-size: 10pt;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: black;
|
||||
@fancy-font-color-dimm: #c0c0c0;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
// Mixins
|
||||
//------------------------------------------------------------------------------
|
||||
.setBgPos(@x, @y, @cond:true) when (@cond) {
|
||||
background-position: (@x * -@fancy-icon-width) (@y * -@fancy-icon-height);
|
||||
}
|
||||
.clearBgImage(@cond:true) when (@cond) {
|
||||
background-image: none;
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and not (@fancy-inline-sprites) {
|
||||
background-image: url("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and (@fancy-inline-sprites) {
|
||||
background-image: data-uri("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.useSprite(@x, @y) when (@fancy-use-sprites) {
|
||||
.setBgPos(@x, @y);
|
||||
}
|
||||
.rounded-corners(@radius) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
-ms-border-radius: @radius;
|
||||
-o-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor) {
|
||||
border-color: @bordercolor;
|
||||
background: @bgcolor;
|
||||
color: @color;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor, @startColor, @stopColor) {
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor);
|
||||
// @c-start: argb(@startColor);
|
||||
// @c-end: argb(@stopColor);
|
||||
background: -moz-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // FF3.6+
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, @startColor),
|
||||
color-stop(100%, @stopColor)
|
||||
); // Chrome,Safari4+
|
||||
background: -webkit-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Chrome10+,Safari5.1+
|
||||
background: -o-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Opera 11.10+
|
||||
background: -ms-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // IE10+
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // W3C
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{stopColor}',GradientType=0 ); // IE6-9
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
// Redefine, in case jQuery-UI is not included
|
||||
// .ui-helper-hidden,
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
// tri-state checkbox
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: @fancy-font-color-dimm;
|
||||
}
|
||||
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
/* CHANGE: renamed spin to spin-fancytree */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin-fancytree 1000ms infinite linear;
|
||||
animation: spin-fancytree 1000ms infinite linear;
|
||||
}
|
||||
/* CHANGE: commented because it is wrong prefixed by phpless
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
*/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
ul.fancytree-container {
|
||||
font-family: @fancy-font-family;
|
||||
font-size: @fancy-font-size;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0; // DT issue 201
|
||||
//background-color: white; CHANGE
|
||||
//border: 1px dotted gray; CHANGE
|
||||
// overflow: auto; // ext-dnd5: otherwise this is always the scroll parent
|
||||
// height: 100%; // DT issue 263, 470
|
||||
min-height: 0%; // #192
|
||||
position: relative; // #235
|
||||
ul {
|
||||
padding: 0 0 0 @fancy-level-indent;
|
||||
margin: 0;
|
||||
}
|
||||
ul > li:before {
|
||||
// #538
|
||||
content: none;
|
||||
}
|
||||
li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
.setBgPos(0, 0);
|
||||
background-repeat: repeat-y;
|
||||
background-image: none; // no v-lines
|
||||
|
||||
margin: 0;
|
||||
// padding: 1px 0 0 0; // issue #246
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Style, when control is disabled
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
// filter: alpha(opacity=50); // Yields a css warning
|
||||
background-color: silver;
|
||||
}
|
||||
|
||||
ul.fancytree-connectors.fancytree-container {
|
||||
li {
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
/* CHANGE: phpless does not handle data-uri() correct */
|
||||
//background-image: data-uri("@{fancy-image-prefix}vline.gif");
|
||||
background-image: url("@{fancy-image-prefix}vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Suppress lines for last child node
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
// Fix jQuery UI 'blind' animation for jQuery UI (#717)
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
// display: -moz-inline-box; // @ FF 1+2 removed for issue 221
|
||||
// -moz-box-align: start; /* issue 221 */
|
||||
display: inline-block; // Required to make a span sizeable
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
// background-position: left;
|
||||
.setBgImageUrl("icons.gif");
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
display: inline-block;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-expander {
|
||||
// .useSprite(0, 5);
|
||||
cursor: pointer;
|
||||
}
|
||||
// span.fancytree-expander:hover {
|
||||
// // .useSprite(1, 5);
|
||||
// }
|
||||
|
||||
// --- End nodes (use connectors instead of expanders)
|
||||
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
// .clearBgImage( @fancy-hide-connectors );
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors {
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander, // End-node, not last sibling
|
||||
.fancytree-exp-n span.fancytree-expander:hover {
|
||||
.useSprite(0, 4);
|
||||
}
|
||||
.fancytree-exp-nl span.fancytree-expander, // End-node, last sibling
|
||||
.fancytree-exp-nl span.fancytree-expander:hover {
|
||||
.useSprite(1, 4);
|
||||
}
|
||||
}
|
||||
|
||||
// --- Collapsed
|
||||
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
// Collapsed, not delayed, not last sibling
|
||||
.useSprite(0, 5);
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
.useSprite(1, 5);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
// Collapsed, not delayed, last sibling
|
||||
.useSprite(0, 6);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
.useSprite(1, 6);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
// Collapsed, delayed, not last sibling
|
||||
.useSprite(4, 5);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
.useSprite(5, 5);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
// Collapsed, delayed, last sibling
|
||||
.useSprite(4, 6);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
.useSprite(5, 6);
|
||||
}
|
||||
|
||||
// --- Expanded
|
||||
|
||||
.fancytree-exp-e span.fancytree-expander, // Expanded, not delayed, not last sibling
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
// Expanded, delayed, not last sibling
|
||||
.useSprite(2, 5);
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
.useSprite(3, 5);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander, // Expanded, not delayed, last sibling
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
// Expanded, delayed, last sibling
|
||||
.useSprite(2, 6);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
.useSprite(3, 6);
|
||||
}
|
||||
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander {
|
||||
span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover span.fancytree-expander,
|
||||
&.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-treefocus span.fancytree-expander,
|
||||
[class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Checkbox icon
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//span.fancytree-checkbox {
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
// .useSprite(0, 2);
|
||||
// &:hover {
|
||||
// .useSprite(1, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(1, 3);
|
||||
// }
|
||||
//}
|
||||
//.fancytree-partsel span.fancytree-checkbox {
|
||||
// .useSprite(4, 2);
|
||||
// &:hover {
|
||||
// .useSprite(5, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(4, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(5, 3);
|
||||
// }
|
||||
//}
|
||||
//// selected after partsel, so it takes precedence:
|
||||
//.fancytree-selected span.fancytree-checkbox {
|
||||
// .useSprite(2, 2);
|
||||
// &:hover {
|
||||
// .useSprite(3, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(3, 3);
|
||||
// }
|
||||
//}
|
||||
//// Unselectable is dimmed, without hover effects
|
||||
//.fancytree-unselectable {
|
||||
// span.fancytree-checkbox {
|
||||
// opacity: 0.4;
|
||||
// filter: alpha(opacity=40);
|
||||
// }
|
||||
// span.fancytree-checkbox:hover {
|
||||
// .useSprite(0, 2);
|
||||
// }
|
||||
// span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
// .useSprite(4, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox:hover {
|
||||
// .useSprite(2, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//// Auto-hide checkboxes unless selected or hovered
|
||||
//.fancytree-container.fancytree-checkbox-auto-hide {
|
||||
// span.fancytree-checkbox {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .fancytree-node:hover span.fancytree-checkbox,
|
||||
// tr:hover td span.fancytree-checkbox,
|
||||
// .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
// tr.fancytree-selected td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// &.fancytree-treefocus {
|
||||
// .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
// tr.fancytree-active td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-icon {
|
||||
// Default icon
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
// .useSprite(0, 0);
|
||||
}
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(1, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(3, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
.useSprite(5, 0);
|
||||
}
|
||||
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
.useSprite(0, 1);
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(1, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(3, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
.useSprite(5, 1);
|
||||
}
|
||||
|
||||
// 'Loading' status overrides all others
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: @fancy-loading-url;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Status node icons */
|
||||
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
.useSprite(0, 7);
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit; // #117, resolves to 'display: list-item;' for standard trees
|
||||
width: 100%;
|
||||
margin-top: @fancy-node-v-spacing;
|
||||
min-height: @fancy-line-height;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: @fancy-font-color; // inherit doesn't work on IE
|
||||
cursor: pointer;
|
||||
display: inline-block; // Better alignment, when title contains <br>
|
||||
vertical-align: top;
|
||||
min-height: @fancy-line-height;
|
||||
padding: 0 3px 0 3px; // Otherwise italic font will be outside right bounds
|
||||
margin: @fancy-title-ofs-top 0 0 @fancy-icon-spacing;
|
||||
// margin: 0px;
|
||||
// margin-top: @fancy-line-ofs-top;
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
.rounded-corners(@fancy-node-border-radius);
|
||||
// outline: 0; // @ Firefox, prevent dotted border after click
|
||||
// Set transparent border to prevent jumping when active node gets a border
|
||||
// (we can do this, because this theme doesn't use vertical lines)
|
||||
// border: 1px solid white; // Note: 'transparent' would not work in IE6
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Drag'n'drop support
|
||||
// *----------------------------------------------------------------------------*/
|
||||
///* ext-dnd5: */
|
||||
//span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
//}
|
||||
//
|
||||
///* ext-dnd: */
|
||||
//div.fancytree-drag-helper {
|
||||
// span.fancytree-childcounter,
|
||||
// span.fancytree-dnd-modifier {
|
||||
// display: inline-block;
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// min-width: 10px;
|
||||
// // min-height: 16px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// position: absolute;
|
||||
// // left: 16px;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// }
|
||||
// span.fancytree-dnd-modifier {
|
||||
// background: #5cb85c; // bootstrap green
|
||||
// border: none;
|
||||
// // min-height: 16px;
|
||||
// // font-size: 12px;
|
||||
// font-weight: bolder;
|
||||
// }
|
||||
// &.fancytree-drop-accept {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(2, 7);
|
||||
// }
|
||||
// }
|
||||
// &.fancytree-drop-reject {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(1, 7);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Drop marker icon *********************************************************/
|
||||
//#fancytree-drop-marker {
|
||||
// width: 2 * @fancy-icon-width; // was 24px, but 32 should be correct
|
||||
// position: absolute;
|
||||
// .useSprite(0, 8);
|
||||
// margin: 0;
|
||||
// &.fancytree-drop-after,
|
||||
// &.fancytree-drop-before {
|
||||
// width: 4 * @fancy-icon-width; // 64px;
|
||||
// .useSprite(0, 9);
|
||||
// }
|
||||
// &.fancytree-drop-copy {
|
||||
// .useSprite(4, 8);
|
||||
// }
|
||||
// &.fancytree-drop-move {
|
||||
// .useSprite(2, 8);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Source node while dragging ***********************************************/
|
||||
//
|
||||
//span.fancytree-drag-source {
|
||||
// &.fancytree-drag-remove {
|
||||
// // text-decoration: line-through;
|
||||
// opacity: 0.15;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Target node while dragging cursor is over it *****************************/
|
||||
//
|
||||
//span.fancytree-drop-target {
|
||||
// &.fancytree-drop-accept {
|
||||
// // outline: 1px dotted #5cb85c; // bootstrap sucess
|
||||
// }
|
||||
//}
|
||||
//span.fancytree-drop-reject {
|
||||
// // outline: 1px dotted #d9534f; // boostrap warning
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
.fancytree-container.fancytree-rtl {
|
||||
.fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/ /* optional: reverse title letters */
|
||||
}
|
||||
span.fancytree-connector,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-drag-helper-img {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
&.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
&.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl {
|
||||
ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
&.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("@{fancy-image-prefix}vline-rtl.gif");
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
&.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'table' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-table {
|
||||
// font-family: @fancy-font-family;
|
||||
// font-size: @fancy-font-size;
|
||||
// border-collapse: collapse;
|
||||
// span.fancytree-node {
|
||||
// display: inline-block; // #117
|
||||
// box-sizing: border-box; // #562
|
||||
// }
|
||||
// td.fancytree-status-merged {
|
||||
// text-align: center;
|
||||
// // font-weight: bold;
|
||||
// font-style: italic;
|
||||
// // line-height: 100px;
|
||||
// color: @fancy-font-color-dimm;
|
||||
// }
|
||||
// tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
// color: @fancy-font-error-color;
|
||||
// }
|
||||
// /* ext-ariagrid */
|
||||
// &.fancytree-ext-ariagrid.fancytree-cell-mode {
|
||||
// > tbody > tr.fancytree-active > td {
|
||||
// background-color: #eee;
|
||||
// }
|
||||
// > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #cbe8f6;
|
||||
// }
|
||||
// &.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #3875d7;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'columnview' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-columnview {
|
||||
// // border-collapse: collapse;
|
||||
// // width: 100%;
|
||||
// tbody tr td {
|
||||
// position: relative;
|
||||
// border: 1px solid gray;
|
||||
// vertical-align: top;
|
||||
// overflow: auto;
|
||||
// > ul {
|
||||
// padding: 0;
|
||||
// li {
|
||||
// list-style-image: none;
|
||||
// list-style-position: outside;
|
||||
// list-style-type: none;
|
||||
// -moz-background-clip: border;
|
||||
// -moz-background-inline-policy: continuous;
|
||||
// -moz-background-origin: padding;
|
||||
// background-attachment: scroll;
|
||||
// background-color: transparent;
|
||||
// .setBgPos(0, 0);
|
||||
// background-repeat: repeat-y;
|
||||
// background-image: none; /* no v-lines */
|
||||
//
|
||||
// margin: 0;
|
||||
// // padding: 1px 0 0 0; // issue #246
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// span.fancytree-node {
|
||||
// position: relative; /* allow positioning of embedded spans */
|
||||
// display: inline-block; // #117
|
||||
// }
|
||||
// span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #e0e0e0;
|
||||
// }
|
||||
// span.fancytree-node.fancytree-active {
|
||||
// background-color: #cbe8f6;
|
||||
// // background-color: royalblue;
|
||||
// }
|
||||
// .fancytree-has-children span.fancytree-cv-right {
|
||||
// position: absolute;
|
||||
// right: 3px;
|
||||
// .useSprite(0, 5);
|
||||
// &:hover {
|
||||
// .useSprite(1, 5);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'filter' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-filter-dimm {
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: bold;
|
||||
// }
|
||||
//}
|
||||
//.fancytree-ext-filter-hide {
|
||||
// tr.fancytree-hide,
|
||||
// span.fancytree-node.fancytree-hide {
|
||||
// display: none;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
//}
|
||||
///* Hide expanders if all child nodes are hidden by filter */
|
||||
//.fancytree-ext-filter-hide-expanders {
|
||||
// tr.fancytree-match span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
// visibility: visible;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//.fancytree-ext-childcounter,
|
||||
//.fancytree-ext-filter {
|
||||
// // span.fancytree-title mark {
|
||||
// // font-style: normal;
|
||||
// // background-color: #ead61c; // yellow
|
||||
// // border-radius: 3px;
|
||||
// // }
|
||||
// span.fancytree-icon,
|
||||
// span.fancytree-custom-icon {
|
||||
// position: relative;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #777; // #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// position: absolute;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// min-width: 10px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
//}
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'wide' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//ul.fancytree-ext-wide {
|
||||
// position: relative;
|
||||
// min-width: 100%;
|
||||
// z-index: 2;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
//
|
||||
// span.fancytree-node > span {
|
||||
// position: relative;
|
||||
// z-index: 2;
|
||||
// }
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// position: absolute; // Allow left: 0. Note: prevents smooth dropdown animation
|
||||
// z-index: 1; // Behind expander and checkbox
|
||||
// left: 0px;
|
||||
// min-width: 100%;
|
||||
// margin-left: 0;
|
||||
// margin-right: 0;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'fixed' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-fixed-wrapper {
|
||||
// .fancytree-ext-fixed-hidden {
|
||||
// display: none;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
// border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-right {
|
||||
// border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 3;
|
||||
// top: 0px;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tr {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// top: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-bl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-br {
|
||||
// position: absolute;
|
||||
// overflow: scroll;
|
||||
// z-index: 1;
|
||||
// }
|
||||
//}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
### Creating Custom Skins
|
||||
|
||||
1. Create a folder like this (recommended name: 'src/skin-custom-...')
|
||||
2. For a start, copy files from one of the existing skin folders (src/skin-...)
|
||||
to the custom folder:
|
||||
- ui.fancytree.less (required)
|
||||
- icons.gif (if needed)
|
||||
- loading.gif (if needed)
|
||||
3. cd to your fancytree folder and run `grunt dev` from the console.<br>
|
||||
Note: NPM and Grunt are required.
|
||||
Read [how to install the toolset](https://github.com/mar10/fancytree/wiki/HowtoContribute#install-the-source-code-and-tools-for-debugging-and-contributing).
|
||||
4. Edit and save your ui.fancytree.less file.<br>
|
||||
The `ui.fancytree.css` will be generated and updated automatically from
|
||||
the LESS file.
|
||||
BIN
plugins/55/indexmenu/scripts/fancytree/skin-lion/icons-rtl.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-lion/icons-rtl.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-lion/icons.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-lion/icons.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-lion/loading.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-lion/loading.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
|
|
@ -0,0 +1,972 @@
|
|||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
|
||||
// Variables (defaults, may be overwritten by the including .less files)
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
// @fancy-hide-connectors: true; // false: show vertical connector lines
|
||||
|
||||
@fancy-level-indent: 16px;
|
||||
@fancy-line-height: 16px; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-line-ofs-top: (@fancy-line-height - @fancy-icon-height) / 2;
|
||||
|
||||
// webpack uses /dist/skin-common.less as root path
|
||||
// grunt-less uses /dist/skin-Xxx/ui.fancyree.less as root path
|
||||
// So we define our theme LESS files for webpack compatibility, i.e.
|
||||
// define the image path n every main LESS file instead of here.
|
||||
// Prefix may be set to "", "/", "./", or any other value
|
||||
// Note: this variable must be defined by the main LESS files:
|
||||
// @fancy-image-prefix: "";
|
||||
|
||||
// Use 'url(...)' to link to the throbber image, or
|
||||
// use data-uri(...)' to inline the data in css instead:
|
||||
/* CHANGE use url, as less does not handel data-uri() correct. DokuWiki can eventually inline it */
|
||||
@fancy-loading-url: url("@{fancy-image-prefix}loading.gif");
|
||||
//@fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false; // data-uri() is not handle correct by phpless
|
||||
|
||||
@fancy-font-size: 10pt;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: black;
|
||||
@fancy-font-color-dimm: #c0c0c0;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
// Mixins
|
||||
//------------------------------------------------------------------------------
|
||||
.setBgPos(@x, @y, @cond:true) when (@cond) {
|
||||
background-position: (@x * -@fancy-icon-width) (@y * -@fancy-icon-height);
|
||||
}
|
||||
.clearBgImage(@cond:true) when (@cond) {
|
||||
background-image: none;
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and not (@fancy-inline-sprites) {
|
||||
background-image: url("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and (@fancy-inline-sprites) {
|
||||
background-image: data-uri("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.useSprite(@x, @y) when (@fancy-use-sprites) {
|
||||
.setBgPos(@x, @y);
|
||||
}
|
||||
.rounded-corners(@radius) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
-ms-border-radius: @radius;
|
||||
-o-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor) {
|
||||
border-color: @bordercolor;
|
||||
background: @bgcolor;
|
||||
color: @color;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor, @startColor, @stopColor) {
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor);
|
||||
// @c-start: argb(@startColor);
|
||||
// @c-end: argb(@stopColor);
|
||||
background: -moz-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // FF3.6+
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, @startColor),
|
||||
color-stop(100%, @stopColor)
|
||||
); // Chrome,Safari4+
|
||||
background: -webkit-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Chrome10+,Safari5.1+
|
||||
background: -o-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Opera 11.10+
|
||||
background: -ms-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // IE10+
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // W3C
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{stopColor}',GradientType=0 ); // IE6-9
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
// Redefine, in case jQuery-UI is not included
|
||||
// .ui-helper-hidden,
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
// tri-state checkbox
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: @fancy-font-color-dimm;
|
||||
}
|
||||
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
/* CHANGE: renamed spin to spin-fancytree */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin-fancytree 1000ms infinite linear;
|
||||
animation: spin-fancytree 1000ms infinite linear;
|
||||
}
|
||||
/* CHANGE: commented because it is wrong prefixed by phpless
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
*/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
ul.fancytree-container {
|
||||
font-family: @fancy-font-family;
|
||||
font-size: @fancy-font-size;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0; // DT issue 201
|
||||
//background-color: white; CHANGE
|
||||
//border: 1px dotted gray; CHANGE
|
||||
// overflow: auto; // ext-dnd5: otherwise this is always the scroll parent
|
||||
// height: 100%; // DT issue 263, 470
|
||||
min-height: 0%; // #192
|
||||
position: relative; // #235
|
||||
ul {
|
||||
padding: 0 0 0 @fancy-level-indent;
|
||||
margin: 0;
|
||||
}
|
||||
ul > li:before {
|
||||
// #538
|
||||
content: none;
|
||||
}
|
||||
li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
.setBgPos(0, 0);
|
||||
background-repeat: repeat-y;
|
||||
background-image: none; // no v-lines
|
||||
|
||||
margin: 0;
|
||||
// padding: 1px 0 0 0; // issue #246
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Style, when control is disabled
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
// filter: alpha(opacity=50); // Yields a css warning
|
||||
background-color: silver;
|
||||
}
|
||||
|
||||
ul.fancytree-connectors.fancytree-container {
|
||||
li {
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
/* CHANGE: phpless does not handle data-uri() correct */
|
||||
//background-image: data-uri("@{fancy-image-prefix}vline.gif");
|
||||
background-image: url("@{fancy-image-prefix}vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Suppress lines for last child node
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
// Fix jQuery UI 'blind' animation for jQuery UI (#717)
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
// display: -moz-inline-box; // @ FF 1+2 removed for issue 221
|
||||
// -moz-box-align: start; /* issue 221 */
|
||||
display: inline-block; // Required to make a span sizeable
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
// background-position: left;
|
||||
.setBgImageUrl("icons.gif");
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
display: inline-block;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-expander {
|
||||
// .useSprite(0, 5);
|
||||
cursor: pointer;
|
||||
}
|
||||
// span.fancytree-expander:hover {
|
||||
// // .useSprite(1, 5);
|
||||
// }
|
||||
|
||||
// --- End nodes (use connectors instead of expanders)
|
||||
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
// .clearBgImage( @fancy-hide-connectors );
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors {
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander, // End-node, not last sibling
|
||||
.fancytree-exp-n span.fancytree-expander:hover {
|
||||
.useSprite(0, 4);
|
||||
}
|
||||
.fancytree-exp-nl span.fancytree-expander, // End-node, last sibling
|
||||
.fancytree-exp-nl span.fancytree-expander:hover {
|
||||
.useSprite(1, 4);
|
||||
}
|
||||
}
|
||||
|
||||
// --- Collapsed
|
||||
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
// Collapsed, not delayed, not last sibling
|
||||
.useSprite(0, 5);
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
.useSprite(1, 5);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
// Collapsed, not delayed, last sibling
|
||||
.useSprite(0, 6);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
.useSprite(1, 6);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
// Collapsed, delayed, not last sibling
|
||||
.useSprite(4, 5);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
.useSprite(5, 5);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
// Collapsed, delayed, last sibling
|
||||
.useSprite(4, 6);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
.useSprite(5, 6);
|
||||
}
|
||||
|
||||
// --- Expanded
|
||||
|
||||
.fancytree-exp-e span.fancytree-expander, // Expanded, not delayed, not last sibling
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
// Expanded, delayed, not last sibling
|
||||
.useSprite(2, 5);
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
.useSprite(3, 5);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander, // Expanded, not delayed, last sibling
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
// Expanded, delayed, last sibling
|
||||
.useSprite(2, 6);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
.useSprite(3, 6);
|
||||
}
|
||||
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander {
|
||||
span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover span.fancytree-expander,
|
||||
&.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-treefocus span.fancytree-expander,
|
||||
[class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Checkbox icon
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//span.fancytree-checkbox {
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
// .useSprite(0, 2);
|
||||
// &:hover {
|
||||
// .useSprite(1, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(1, 3);
|
||||
// }
|
||||
//}
|
||||
//.fancytree-partsel span.fancytree-checkbox {
|
||||
// .useSprite(4, 2);
|
||||
// &:hover {
|
||||
// .useSprite(5, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(4, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(5, 3);
|
||||
// }
|
||||
//}
|
||||
//// selected after partsel, so it takes precedence:
|
||||
//.fancytree-selected span.fancytree-checkbox {
|
||||
// .useSprite(2, 2);
|
||||
// &:hover {
|
||||
// .useSprite(3, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(3, 3);
|
||||
// }
|
||||
//}
|
||||
//// Unselectable is dimmed, without hover effects
|
||||
//.fancytree-unselectable {
|
||||
// span.fancytree-checkbox {
|
||||
// opacity: 0.4;
|
||||
// filter: alpha(opacity=40);
|
||||
// }
|
||||
// span.fancytree-checkbox:hover {
|
||||
// .useSprite(0, 2);
|
||||
// }
|
||||
// span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
// .useSprite(4, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox:hover {
|
||||
// .useSprite(2, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//// Auto-hide checkboxes unless selected or hovered
|
||||
//.fancytree-container.fancytree-checkbox-auto-hide {
|
||||
// span.fancytree-checkbox {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .fancytree-node:hover span.fancytree-checkbox,
|
||||
// tr:hover td span.fancytree-checkbox,
|
||||
// .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
// tr.fancytree-selected td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// &.fancytree-treefocus {
|
||||
// .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
// tr.fancytree-active td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-icon {
|
||||
// Default icon
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
// .useSprite(0, 0);
|
||||
}
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(1, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(3, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
.useSprite(5, 0);
|
||||
}
|
||||
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
.useSprite(0, 1);
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(1, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(3, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
.useSprite(5, 1);
|
||||
}
|
||||
|
||||
// 'Loading' status overrides all others
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: @fancy-loading-url;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Status node icons */
|
||||
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
.useSprite(0, 7);
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit; // #117, resolves to 'display: list-item;' for standard trees
|
||||
width: 100%;
|
||||
margin-top: @fancy-node-v-spacing;
|
||||
min-height: @fancy-line-height;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: @fancy-font-color; // inherit doesn't work on IE
|
||||
cursor: pointer;
|
||||
display: inline-block; // Better alignment, when title contains <br>
|
||||
vertical-align: top;
|
||||
min-height: @fancy-line-height;
|
||||
padding: 0 3px 0 3px; // Otherwise italic font will be outside right bounds
|
||||
margin: @fancy-title-ofs-top 0 0 @fancy-icon-spacing;
|
||||
// margin: 0px;
|
||||
// margin-top: @fancy-line-ofs-top;
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
.rounded-corners(@fancy-node-border-radius);
|
||||
// outline: 0; // @ Firefox, prevent dotted border after click
|
||||
// Set transparent border to prevent jumping when active node gets a border
|
||||
// (we can do this, because this theme doesn't use vertical lines)
|
||||
// border: 1px solid white; // Note: 'transparent' would not work in IE6
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Drag'n'drop support
|
||||
// *----------------------------------------------------------------------------*/
|
||||
///* ext-dnd5: */
|
||||
//span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
//}
|
||||
//
|
||||
///* ext-dnd: */
|
||||
//div.fancytree-drag-helper {
|
||||
// span.fancytree-childcounter,
|
||||
// span.fancytree-dnd-modifier {
|
||||
// display: inline-block;
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// min-width: 10px;
|
||||
// // min-height: 16px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// position: absolute;
|
||||
// // left: 16px;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// }
|
||||
// span.fancytree-dnd-modifier {
|
||||
// background: #5cb85c; // bootstrap green
|
||||
// border: none;
|
||||
// // min-height: 16px;
|
||||
// // font-size: 12px;
|
||||
// font-weight: bolder;
|
||||
// }
|
||||
// &.fancytree-drop-accept {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(2, 7);
|
||||
// }
|
||||
// }
|
||||
// &.fancytree-drop-reject {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(1, 7);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Drop marker icon *********************************************************/
|
||||
//#fancytree-drop-marker {
|
||||
// width: 2 * @fancy-icon-width; // was 24px, but 32 should be correct
|
||||
// position: absolute;
|
||||
// .useSprite(0, 8);
|
||||
// margin: 0;
|
||||
// &.fancytree-drop-after,
|
||||
// &.fancytree-drop-before {
|
||||
// width: 4 * @fancy-icon-width; // 64px;
|
||||
// .useSprite(0, 9);
|
||||
// }
|
||||
// &.fancytree-drop-copy {
|
||||
// .useSprite(4, 8);
|
||||
// }
|
||||
// &.fancytree-drop-move {
|
||||
// .useSprite(2, 8);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Source node while dragging ***********************************************/
|
||||
//
|
||||
//span.fancytree-drag-source {
|
||||
// &.fancytree-drag-remove {
|
||||
// // text-decoration: line-through;
|
||||
// opacity: 0.15;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Target node while dragging cursor is over it *****************************/
|
||||
//
|
||||
//span.fancytree-drop-target {
|
||||
// &.fancytree-drop-accept {
|
||||
// // outline: 1px dotted #5cb85c; // bootstrap sucess
|
||||
// }
|
||||
//}
|
||||
//span.fancytree-drop-reject {
|
||||
// // outline: 1px dotted #d9534f; // boostrap warning
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
.fancytree-container.fancytree-rtl {
|
||||
.fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/ /* optional: reverse title letters */
|
||||
}
|
||||
span.fancytree-connector,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-drag-helper-img {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
&.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
&.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl {
|
||||
ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
&.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("@{fancy-image-prefix}vline-rtl.gif");
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
&.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'table' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-table {
|
||||
// font-family: @fancy-font-family;
|
||||
// font-size: @fancy-font-size;
|
||||
// border-collapse: collapse;
|
||||
// span.fancytree-node {
|
||||
// display: inline-block; // #117
|
||||
// box-sizing: border-box; // #562
|
||||
// }
|
||||
// td.fancytree-status-merged {
|
||||
// text-align: center;
|
||||
// // font-weight: bold;
|
||||
// font-style: italic;
|
||||
// // line-height: 100px;
|
||||
// color: @fancy-font-color-dimm;
|
||||
// }
|
||||
// tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
// color: @fancy-font-error-color;
|
||||
// }
|
||||
// /* ext-ariagrid */
|
||||
// &.fancytree-ext-ariagrid.fancytree-cell-mode {
|
||||
// > tbody > tr.fancytree-active > td {
|
||||
// background-color: #eee;
|
||||
// }
|
||||
// > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #cbe8f6;
|
||||
// }
|
||||
// &.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #3875d7;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'columnview' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-columnview {
|
||||
// // border-collapse: collapse;
|
||||
// // width: 100%;
|
||||
// tbody tr td {
|
||||
// position: relative;
|
||||
// border: 1px solid gray;
|
||||
// vertical-align: top;
|
||||
// overflow: auto;
|
||||
// > ul {
|
||||
// padding: 0;
|
||||
// li {
|
||||
// list-style-image: none;
|
||||
// list-style-position: outside;
|
||||
// list-style-type: none;
|
||||
// -moz-background-clip: border;
|
||||
// -moz-background-inline-policy: continuous;
|
||||
// -moz-background-origin: padding;
|
||||
// background-attachment: scroll;
|
||||
// background-color: transparent;
|
||||
// .setBgPos(0, 0);
|
||||
// background-repeat: repeat-y;
|
||||
// background-image: none; /* no v-lines */
|
||||
//
|
||||
// margin: 0;
|
||||
// // padding: 1px 0 0 0; // issue #246
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// span.fancytree-node {
|
||||
// position: relative; /* allow positioning of embedded spans */
|
||||
// display: inline-block; // #117
|
||||
// }
|
||||
// span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #e0e0e0;
|
||||
// }
|
||||
// span.fancytree-node.fancytree-active {
|
||||
// background-color: #cbe8f6;
|
||||
// // background-color: royalblue;
|
||||
// }
|
||||
// .fancytree-has-children span.fancytree-cv-right {
|
||||
// position: absolute;
|
||||
// right: 3px;
|
||||
// .useSprite(0, 5);
|
||||
// &:hover {
|
||||
// .useSprite(1, 5);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'filter' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-filter-dimm {
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: bold;
|
||||
// }
|
||||
//}
|
||||
//.fancytree-ext-filter-hide {
|
||||
// tr.fancytree-hide,
|
||||
// span.fancytree-node.fancytree-hide {
|
||||
// display: none;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
//}
|
||||
///* Hide expanders if all child nodes are hidden by filter */
|
||||
//.fancytree-ext-filter-hide-expanders {
|
||||
// tr.fancytree-match span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
// visibility: visible;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//.fancytree-ext-childcounter,
|
||||
//.fancytree-ext-filter {
|
||||
// // span.fancytree-title mark {
|
||||
// // font-style: normal;
|
||||
// // background-color: #ead61c; // yellow
|
||||
// // border-radius: 3px;
|
||||
// // }
|
||||
// span.fancytree-icon,
|
||||
// span.fancytree-custom-icon {
|
||||
// position: relative;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #777; // #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// position: absolute;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// min-width: 10px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
//}
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'wide' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//ul.fancytree-ext-wide {
|
||||
// position: relative;
|
||||
// min-width: 100%;
|
||||
// z-index: 2;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
//
|
||||
// span.fancytree-node > span {
|
||||
// position: relative;
|
||||
// z-index: 2;
|
||||
// }
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// position: absolute; // Allow left: 0. Note: prevents smooth dropdown animation
|
||||
// z-index: 1; // Behind expander and checkbox
|
||||
// left: 0px;
|
||||
// min-width: 100%;
|
||||
// margin-left: 0;
|
||||
// margin-right: 0;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'fixed' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-fixed-wrapper {
|
||||
// .fancytree-ext-fixed-hidden {
|
||||
// display: none;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
// border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-right {
|
||||
// border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 3;
|
||||
// top: 0px;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tr {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// top: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-bl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-br {
|
||||
// position: absolute;
|
||||
// overflow: scroll;
|
||||
// z-index: 1;
|
||||
// }
|
||||
//}
|
||||
|
|
@ -0,0 +1,757 @@
|
|||
/*!
|
||||
* Fancytree "Lion" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
/*
|
||||
Lion colors:
|
||||
gray highlight bar: #D4D4D4
|
||||
blue highlight-bar and -border #3875D7
|
||||
|
||||
*/
|
||||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: #c0c0c0;
|
||||
}
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin 1000ms infinite linear;
|
||||
animation: spin 1000ms infinite linear;
|
||||
}
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-container {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0;
|
||||
background-color: white;
|
||||
border: 1px dotted gray;
|
||||
min-height: 0%;
|
||||
position: relative;
|
||||
}
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 16px;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container ul > li:before {
|
||||
content: none;
|
||||
}
|
||||
ul.fancytree-container li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0px 0px;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
background-color: silver;
|
||||
}
|
||||
ul.fancytree-connectors.fancytree-container li {
|
||||
background-image: url("../skin-lion/vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url("../skin-lion/icons.gif");
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: 0px;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
margin-left: 3px;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-left: 3px;
|
||||
margin-top: 0px;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-expander {
|
||||
cursor: pointer;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: url("../skin-lion/icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander:hover {
|
||||
background-position: 0px -64px;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander:hover {
|
||||
background-position: -16px -64px;
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
background-position: 0px -80px;
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
background-position: -16px -80px;
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
background-position: 0px -96px;
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
background-position: -16px -96px;
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
background-position: -64px -80px;
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
background-position: -80px -80px;
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
background-position: -64px -96px;
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
background-position: -80px -96px;
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander,
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
background-position: -32px -80px;
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
background-position: -48px -80px;
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander,
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
background-position: -32px -96px;
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
background-position: -48px -96px;
|
||||
}
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
.fancytree-fade-expander:hover span.fancytree-expander,
|
||||
.fancytree-fade-expander.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander .fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander [class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Checkbox icon
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-checkbox {
|
||||
margin-left: 3px;
|
||||
background-position: 0px -32px;
|
||||
}
|
||||
span.fancytree-checkbox:hover {
|
||||
background-position: -16px -32px;
|
||||
}
|
||||
span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: 0px -48px;
|
||||
}
|
||||
span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -16px -48px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox {
|
||||
background-position: -64px -32px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
background-position: -80px -32px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: -64px -48px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -80px -48px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox {
|
||||
background-position: -32px -32px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox:hover {
|
||||
background-position: -48px -32px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: -32px -48px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -48px -48px;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox {
|
||||
opacity: 0.4;
|
||||
filter: alpha(opacity=40);
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox:hover {
|
||||
background-position: 0px -32px;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: 0px -48px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
background-position: -64px -32px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-selected span.fancytree-checkbox:hover {
|
||||
background-position: -32px -32px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -32px -48px;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide span.fancytree-checkbox {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node:hover span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr:hover td span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr.fancytree-selected td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus tr.fancytree-active td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-icon {
|
||||
margin-left: 3px;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
background-position: -16px 0px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
background-position: -32px 0px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
background-position: -48px 0px;
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
background-position: -64px 0px;
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
background-position: -80px 0px;
|
||||
}
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
background-position: 0px -16px;
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
background-position: -16px -16px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
background-position: -32px -16px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
background-position: -48px -16px;
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
background-position: -64px -16px;
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
background-position: -80px -16px;
|
||||
}
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: url("../skin-lion/loading.gif");
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Status node icons */
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
background-position: 0px -112px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit;
|
||||
width: 100%;
|
||||
margin-top: 1px;
|
||||
min-height: 16px;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: black;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
min-height: 16px;
|
||||
padding: 0 3px 0 3px;
|
||||
margin: 0px 0 0 3px;
|
||||
border: 1px solid transparent;
|
||||
-webkit-border-radius: 0px;
|
||||
-moz-border-radius: 0px;
|
||||
-ms-border-radius: 0px;
|
||||
-o-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: red;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Drag'n'drop support
|
||||
*----------------------------------------------------------------------------*/
|
||||
/* ext-dnd5: */
|
||||
span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
/* ext-dnd: */
|
||||
div.fancytree-drag-helper span.fancytree-childcounter,
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-childcounter {
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
background: #5cb85c;
|
||||
border: none;
|
||||
font-weight: bolder;
|
||||
}
|
||||
div.fancytree-drag-helper.fancytree-drop-accept span.fancytree-drag-helper-img {
|
||||
background-position: -32px -112px;
|
||||
}
|
||||
div.fancytree-drag-helper.fancytree-drop-reject span.fancytree-drag-helper-img {
|
||||
background-position: -16px -112px;
|
||||
}
|
||||
/*** Drop marker icon *********************************************************/
|
||||
#fancytree-drop-marker {
|
||||
width: 32px;
|
||||
position: absolute;
|
||||
background-position: 0px -128px;
|
||||
margin: 0;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-after,
|
||||
#fancytree-drop-marker.fancytree-drop-before {
|
||||
width: 64px;
|
||||
background-position: 0px -144px;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-copy {
|
||||
background-position: -64px -128px;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-move {
|
||||
background-position: -32px -128px;
|
||||
}
|
||||
/*** Source node while dragging ***********************************************/
|
||||
span.fancytree-drag-source.fancytree-drag-remove {
|
||||
opacity: 0.15;
|
||||
}
|
||||
/*** Target node while dragging cursor is over it *****************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-container.fancytree-rtl .fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/
|
||||
/* optional: reverse title letters */
|
||||
}
|
||||
.fancytree-container.fancytree-rtl span.fancytree-connector,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-icon,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-drag-helper-img {
|
||||
background-image: url("../skin-lion/icons-rtl.gif");
|
||||
}
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
.fancytree-container.fancytree-rtl.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: url("../skin-lion/icons-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("../skin-lion/vline-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl li.fancytree-lastsib,
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
background-image: url("../skin-lion/icons-rtl.gif");
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'table' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-table {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
border-collapse: collapse;
|
||||
/* ext-ariagrid */
|
||||
}
|
||||
table.fancytree-ext-table span.fancytree-node {
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
table.fancytree-ext-table td.fancytree-status-merged {
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
color: #c0c0c0;
|
||||
}
|
||||
table.fancytree-ext-table tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
color: red;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr.fancytree-active > td {
|
||||
background-color: #eee;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #3875d7;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'columnview' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-columnview tbody tr td {
|
||||
position: relative;
|
||||
border: 1px solid gray;
|
||||
vertical-align: top;
|
||||
overflow: auto;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul {
|
||||
padding: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0px 0px;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
/* no v-lines */
|
||||
margin: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node {
|
||||
position: relative;
|
||||
/* allow positioning of embedded spans */
|
||||
display: inline-block;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
background-position: 0px -80px;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right:hover {
|
||||
background-position: -16px -80px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'filter' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-filter-dimm span.fancytree-node span.fancytree-title {
|
||||
color: #c0c0c0;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-hide,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-hide {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: #c0c0c0;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* Hide expanders if all child nodes are hidden by filter */
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-match span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-submatch span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
visibility: visible;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-icon,
|
||||
.fancytree-ext-filter span.fancytree-icon,
|
||||
.fancytree-ext-childcounter span.fancytree-custom-icon,
|
||||
.fancytree-ext-filter span.fancytree-custom-icon {
|
||||
position: relative;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-childcounter,
|
||||
.fancytree-ext-filter span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #777;
|
||||
border: 1px solid gray;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'wide' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-ext-wide {
|
||||
position: relative;
|
||||
min-width: 100%;
|
||||
z-index: 2;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node > span {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node span.fancytree-title {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: 0px;
|
||||
min-width: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'fixed' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-fixed-wrapper .fancytree-ext-fixed-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-right {
|
||||
border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 3;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tr {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
top: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-bl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-br {
|
||||
position: absolute;
|
||||
overflow: scroll;
|
||||
z-index: 1;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
span.fancytree-title {
|
||||
border: 1px solid transparent;
|
||||
border-radius: 0;
|
||||
}
|
||||
span.fancytree-focused span.fancytree-title {
|
||||
outline: 1px dotted black;
|
||||
}
|
||||
span.fancytree-selected span.fancytree-title,
|
||||
span.fancytree-active span.fancytree-title {
|
||||
background-color: #D4D4D4;
|
||||
}
|
||||
span.fancytree-selected span.fancytree-title {
|
||||
font-style: italic;
|
||||
}
|
||||
.fancytree-treefocus span.fancytree-selected span.fancytree-title,
|
||||
.fancytree-treefocus span.fancytree-active span.fancytree-title {
|
||||
color: white;
|
||||
background-color: #3875D7;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'table' extension
|
||||
*/
|
||||
table.fancytree-ext-table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-focused {
|
||||
background-color: #99DEFD;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-active {
|
||||
background-color: royalblue;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-selected {
|
||||
background-color: #99DEFD;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'columnview' extension
|
||||
*/
|
||||
table.fancytree-ext-columnview tbody tr td {
|
||||
border: 1px solid gray;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #ccc;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: royalblue;
|
||||
}
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
/*!
|
||||
* Fancytree "Lion" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
|
||||
/*
|
||||
Lion colors:
|
||||
gray highlight bar: #D4D4D4
|
||||
blue highlight-bar and -border #3875D7
|
||||
|
||||
*/
|
||||
// Import common styles
|
||||
@import "skin-common.less";
|
||||
|
||||
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
|
||||
// Override the variable after the import.
|
||||
// NOTE: Variables are always resolved as the last definition, even if it is
|
||||
// after where it is used.
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-line-height: 16px;
|
||||
@fancy-icon-spacing: 3px;
|
||||
|
||||
// We need to define this variable here (not in skin-common.less) to make it
|
||||
// work with grunt and webpack:
|
||||
@fancy-image-prefix: "./skin-lion/";
|
||||
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
// @fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
// Set to `true` to use `data-uri(...)` which will embed icons.gif into CSS
|
||||
// instead of linking to that file:
|
||||
// @fancy-inline-sprites: true;
|
||||
|
||||
//default 10pt, which is used in a relative manner resulting in 13.3 in dokuwiki-template.
|
||||
@fancy-font-size: 93%;
|
||||
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
span.fancytree-title {
|
||||
border: 1px solid transparent; // reserve some space for status borders
|
||||
border-radius: 0;
|
||||
}
|
||||
span.fancytree-focused span.fancytree-title {
|
||||
outline: 1px dotted black;
|
||||
}
|
||||
span.fancytree-selected span.fancytree-title,
|
||||
span.fancytree-active span.fancytree-title {
|
||||
background-color: #D4D4D4; // gray
|
||||
}
|
||||
span.fancytree-selected span.fancytree-title {
|
||||
font-style: italic;
|
||||
}
|
||||
.fancytree-treefocus span.fancytree-selected span.fancytree-title,
|
||||
.fancytree-treefocus span.fancytree-active span.fancytree-title {
|
||||
color: white;
|
||||
background-color: #3875D7; // blue
|
||||
}
|
||||
|
||||
///*******************************************************************************
|
||||
// * 'table' extension
|
||||
// */
|
||||
//table.fancytree-ext-table {
|
||||
// border-collapse: collapse;
|
||||
// tbody {
|
||||
// tr.fancytree-focused {
|
||||
// background-color: #99DEFD;
|
||||
// }
|
||||
// tr.fancytree-active {
|
||||
// background-color: royalblue;
|
||||
// }
|
||||
// tr.fancytree-selected {
|
||||
// background-color: #99DEFD;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*******************************************************************************
|
||||
// * 'columnview' extension
|
||||
// */
|
||||
//
|
||||
//table.fancytree-ext-columnview tbody tr td {
|
||||
// border: 1px solid gray;
|
||||
//}
|
||||
//table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #ccc;
|
||||
//}
|
||||
//table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
// background-color: royalblue;
|
||||
//}
|
||||
6
plugins/55/indexmenu/scripts/fancytree/skin-lion/ui.fancytree.min.css
vendored
Normal file
6
plugins/55/indexmenu/scripts/fancytree/skin-lion/ui.fancytree.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
BIN
plugins/55/indexmenu/scripts/fancytree/skin-lion/vline-rtl.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-lion/vline-rtl.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 852 B |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-lion/vline.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-lion/vline.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 852 B |
|
|
@ -0,0 +1,972 @@
|
|||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
|
||||
// Variables (defaults, may be overwritten by the including .less files)
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
// @fancy-hide-connectors: true; // false: show vertical connector lines
|
||||
|
||||
@fancy-level-indent: 16px;
|
||||
@fancy-line-height: 16px; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-line-ofs-top: (@fancy-line-height - @fancy-icon-height) / 2;
|
||||
|
||||
// webpack uses /dist/skin-common.less as root path
|
||||
// grunt-less uses /dist/skin-Xxx/ui.fancyree.less as root path
|
||||
// So we define our theme LESS files for webpack compatibility, i.e.
|
||||
// define the image path n every main LESS file instead of here.
|
||||
// Prefix may be set to "", "/", "./", or any other value
|
||||
// Note: this variable must be defined by the main LESS files:
|
||||
// @fancy-image-prefix: "";
|
||||
|
||||
// Use 'url(...)' to link to the throbber image, or
|
||||
// use data-uri(...)' to inline the data in css instead:
|
||||
/* CHANGE use url, as less does not handel data-uri() correct. DokuWiki can eventually inline it */
|
||||
@fancy-loading-url: url("@{fancy-image-prefix}loading.gif");
|
||||
//@fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false; // data-uri() is not handle correct by phpless
|
||||
|
||||
@fancy-font-size: 10pt;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: black;
|
||||
@fancy-font-color-dimm: #c0c0c0;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
// Mixins
|
||||
//------------------------------------------------------------------------------
|
||||
.setBgPos(@x, @y, @cond:true) when (@cond) {
|
||||
background-position: (@x * -@fancy-icon-width) (@y * -@fancy-icon-height);
|
||||
}
|
||||
.clearBgImage(@cond:true) when (@cond) {
|
||||
background-image: none;
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and not (@fancy-inline-sprites) {
|
||||
background-image: url("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and (@fancy-inline-sprites) {
|
||||
background-image: data-uri("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.useSprite(@x, @y) when (@fancy-use-sprites) {
|
||||
.setBgPos(@x, @y);
|
||||
}
|
||||
.rounded-corners(@radius) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
-ms-border-radius: @radius;
|
||||
-o-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor) {
|
||||
border-color: @bordercolor;
|
||||
background: @bgcolor;
|
||||
color: @color;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor, @startColor, @stopColor) {
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor);
|
||||
// @c-start: argb(@startColor);
|
||||
// @c-end: argb(@stopColor);
|
||||
background: -moz-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // FF3.6+
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, @startColor),
|
||||
color-stop(100%, @stopColor)
|
||||
); // Chrome,Safari4+
|
||||
background: -webkit-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Chrome10+,Safari5.1+
|
||||
background: -o-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Opera 11.10+
|
||||
background: -ms-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // IE10+
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // W3C
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{stopColor}',GradientType=0 ); // IE6-9
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
// Redefine, in case jQuery-UI is not included
|
||||
// .ui-helper-hidden,
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
// tri-state checkbox
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: @fancy-font-color-dimm;
|
||||
}
|
||||
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
/* CHANGE: renamed spin to spin-fancytree */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin-fancytree 1000ms infinite linear;
|
||||
animation: spin-fancytree 1000ms infinite linear;
|
||||
}
|
||||
/* CHANGE: commented because it is wrong prefixed by phpless
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
*/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
ul.fancytree-container {
|
||||
font-family: @fancy-font-family;
|
||||
font-size: @fancy-font-size;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0; // DT issue 201
|
||||
//background-color: white; CHANGE
|
||||
//border: 1px dotted gray; CHANGE
|
||||
// overflow: auto; // ext-dnd5: otherwise this is always the scroll parent
|
||||
// height: 100%; // DT issue 263, 470
|
||||
min-height: 0%; // #192
|
||||
position: relative; // #235
|
||||
ul {
|
||||
padding: 0 0 0 @fancy-level-indent;
|
||||
margin: 0;
|
||||
}
|
||||
ul > li:before {
|
||||
// #538
|
||||
content: none;
|
||||
}
|
||||
li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
.setBgPos(0, 0);
|
||||
background-repeat: repeat-y;
|
||||
background-image: none; // no v-lines
|
||||
|
||||
margin: 0;
|
||||
// padding: 1px 0 0 0; // issue #246
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Style, when control is disabled
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
// filter: alpha(opacity=50); // Yields a css warning
|
||||
background-color: silver;
|
||||
}
|
||||
|
||||
ul.fancytree-connectors.fancytree-container {
|
||||
li {
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
/* CHANGE: phpless does not handle data-uri() correct */
|
||||
//background-image: data-uri("@{fancy-image-prefix}vline.gif");
|
||||
background-image: url("@{fancy-image-prefix}vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Suppress lines for last child node
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
// Fix jQuery UI 'blind' animation for jQuery UI (#717)
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
// display: -moz-inline-box; // @ FF 1+2 removed for issue 221
|
||||
// -moz-box-align: start; /* issue 221 */
|
||||
display: inline-block; // Required to make a span sizeable
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
// background-position: left;
|
||||
.setBgImageUrl("icons.gif");
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
display: inline-block;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-expander {
|
||||
// .useSprite(0, 5);
|
||||
cursor: pointer;
|
||||
}
|
||||
// span.fancytree-expander:hover {
|
||||
// // .useSprite(1, 5);
|
||||
// }
|
||||
|
||||
// --- End nodes (use connectors instead of expanders)
|
||||
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
// .clearBgImage( @fancy-hide-connectors );
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors {
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander, // End-node, not last sibling
|
||||
.fancytree-exp-n span.fancytree-expander:hover {
|
||||
.useSprite(0, 4);
|
||||
}
|
||||
.fancytree-exp-nl span.fancytree-expander, // End-node, last sibling
|
||||
.fancytree-exp-nl span.fancytree-expander:hover {
|
||||
.useSprite(1, 4);
|
||||
}
|
||||
}
|
||||
|
||||
// --- Collapsed
|
||||
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
// Collapsed, not delayed, not last sibling
|
||||
.useSprite(0, 5);
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
.useSprite(1, 5);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
// Collapsed, not delayed, last sibling
|
||||
.useSprite(0, 6);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
.useSprite(1, 6);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
// Collapsed, delayed, not last sibling
|
||||
.useSprite(4, 5);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
.useSprite(5, 5);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
// Collapsed, delayed, last sibling
|
||||
.useSprite(4, 6);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
.useSprite(5, 6);
|
||||
}
|
||||
|
||||
// --- Expanded
|
||||
|
||||
.fancytree-exp-e span.fancytree-expander, // Expanded, not delayed, not last sibling
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
// Expanded, delayed, not last sibling
|
||||
.useSprite(2, 5);
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
.useSprite(3, 5);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander, // Expanded, not delayed, last sibling
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
// Expanded, delayed, last sibling
|
||||
.useSprite(2, 6);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
.useSprite(3, 6);
|
||||
}
|
||||
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander {
|
||||
span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover span.fancytree-expander,
|
||||
&.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-treefocus span.fancytree-expander,
|
||||
[class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Checkbox icon
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//span.fancytree-checkbox {
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
// .useSprite(0, 2);
|
||||
// &:hover {
|
||||
// .useSprite(1, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(1, 3);
|
||||
// }
|
||||
//}
|
||||
//.fancytree-partsel span.fancytree-checkbox {
|
||||
// .useSprite(4, 2);
|
||||
// &:hover {
|
||||
// .useSprite(5, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(4, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(5, 3);
|
||||
// }
|
||||
//}
|
||||
//// selected after partsel, so it takes precedence:
|
||||
//.fancytree-selected span.fancytree-checkbox {
|
||||
// .useSprite(2, 2);
|
||||
// &:hover {
|
||||
// .useSprite(3, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(3, 3);
|
||||
// }
|
||||
//}
|
||||
//// Unselectable is dimmed, without hover effects
|
||||
//.fancytree-unselectable {
|
||||
// span.fancytree-checkbox {
|
||||
// opacity: 0.4;
|
||||
// filter: alpha(opacity=40);
|
||||
// }
|
||||
// span.fancytree-checkbox:hover {
|
||||
// .useSprite(0, 2);
|
||||
// }
|
||||
// span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
// .useSprite(4, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox:hover {
|
||||
// .useSprite(2, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//// Auto-hide checkboxes unless selected or hovered
|
||||
//.fancytree-container.fancytree-checkbox-auto-hide {
|
||||
// span.fancytree-checkbox {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .fancytree-node:hover span.fancytree-checkbox,
|
||||
// tr:hover td span.fancytree-checkbox,
|
||||
// .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
// tr.fancytree-selected td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// &.fancytree-treefocus {
|
||||
// .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
// tr.fancytree-active td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-icon {
|
||||
// Default icon
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
// .useSprite(0, 0);
|
||||
}
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(1, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(3, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
.useSprite(5, 0);
|
||||
}
|
||||
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
.useSprite(0, 1);
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(1, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(3, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
.useSprite(5, 1);
|
||||
}
|
||||
|
||||
// 'Loading' status overrides all others
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: @fancy-loading-url;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Status node icons */
|
||||
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
.useSprite(0, 7);
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit; // #117, resolves to 'display: list-item;' for standard trees
|
||||
width: 100%;
|
||||
margin-top: @fancy-node-v-spacing;
|
||||
min-height: @fancy-line-height;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: @fancy-font-color; // inherit doesn't work on IE
|
||||
cursor: pointer;
|
||||
display: inline-block; // Better alignment, when title contains <br>
|
||||
vertical-align: top;
|
||||
min-height: @fancy-line-height;
|
||||
padding: 0 3px 0 3px; // Otherwise italic font will be outside right bounds
|
||||
margin: @fancy-title-ofs-top 0 0 @fancy-icon-spacing;
|
||||
// margin: 0px;
|
||||
// margin-top: @fancy-line-ofs-top;
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
.rounded-corners(@fancy-node-border-radius);
|
||||
// outline: 0; // @ Firefox, prevent dotted border after click
|
||||
// Set transparent border to prevent jumping when active node gets a border
|
||||
// (we can do this, because this theme doesn't use vertical lines)
|
||||
// border: 1px solid white; // Note: 'transparent' would not work in IE6
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Drag'n'drop support
|
||||
// *----------------------------------------------------------------------------*/
|
||||
///* ext-dnd5: */
|
||||
//span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
//}
|
||||
//
|
||||
///* ext-dnd: */
|
||||
//div.fancytree-drag-helper {
|
||||
// span.fancytree-childcounter,
|
||||
// span.fancytree-dnd-modifier {
|
||||
// display: inline-block;
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// min-width: 10px;
|
||||
// // min-height: 16px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// position: absolute;
|
||||
// // left: 16px;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// }
|
||||
// span.fancytree-dnd-modifier {
|
||||
// background: #5cb85c; // bootstrap green
|
||||
// border: none;
|
||||
// // min-height: 16px;
|
||||
// // font-size: 12px;
|
||||
// font-weight: bolder;
|
||||
// }
|
||||
// &.fancytree-drop-accept {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(2, 7);
|
||||
// }
|
||||
// }
|
||||
// &.fancytree-drop-reject {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(1, 7);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Drop marker icon *********************************************************/
|
||||
//#fancytree-drop-marker {
|
||||
// width: 2 * @fancy-icon-width; // was 24px, but 32 should be correct
|
||||
// position: absolute;
|
||||
// .useSprite(0, 8);
|
||||
// margin: 0;
|
||||
// &.fancytree-drop-after,
|
||||
// &.fancytree-drop-before {
|
||||
// width: 4 * @fancy-icon-width; // 64px;
|
||||
// .useSprite(0, 9);
|
||||
// }
|
||||
// &.fancytree-drop-copy {
|
||||
// .useSprite(4, 8);
|
||||
// }
|
||||
// &.fancytree-drop-move {
|
||||
// .useSprite(2, 8);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Source node while dragging ***********************************************/
|
||||
//
|
||||
//span.fancytree-drag-source {
|
||||
// &.fancytree-drag-remove {
|
||||
// // text-decoration: line-through;
|
||||
// opacity: 0.15;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Target node while dragging cursor is over it *****************************/
|
||||
//
|
||||
//span.fancytree-drop-target {
|
||||
// &.fancytree-drop-accept {
|
||||
// // outline: 1px dotted #5cb85c; // bootstrap sucess
|
||||
// }
|
||||
//}
|
||||
//span.fancytree-drop-reject {
|
||||
// // outline: 1px dotted #d9534f; // boostrap warning
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
.fancytree-container.fancytree-rtl {
|
||||
.fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/ /* optional: reverse title letters */
|
||||
}
|
||||
span.fancytree-connector,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-drag-helper-img {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
&.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
&.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl {
|
||||
ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
&.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("@{fancy-image-prefix}vline-rtl.gif");
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
&.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'table' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-table {
|
||||
// font-family: @fancy-font-family;
|
||||
// font-size: @fancy-font-size;
|
||||
// border-collapse: collapse;
|
||||
// span.fancytree-node {
|
||||
// display: inline-block; // #117
|
||||
// box-sizing: border-box; // #562
|
||||
// }
|
||||
// td.fancytree-status-merged {
|
||||
// text-align: center;
|
||||
// // font-weight: bold;
|
||||
// font-style: italic;
|
||||
// // line-height: 100px;
|
||||
// color: @fancy-font-color-dimm;
|
||||
// }
|
||||
// tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
// color: @fancy-font-error-color;
|
||||
// }
|
||||
// /* ext-ariagrid */
|
||||
// &.fancytree-ext-ariagrid.fancytree-cell-mode {
|
||||
// > tbody > tr.fancytree-active > td {
|
||||
// background-color: #eee;
|
||||
// }
|
||||
// > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #cbe8f6;
|
||||
// }
|
||||
// &.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #3875d7;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'columnview' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-columnview {
|
||||
// // border-collapse: collapse;
|
||||
// // width: 100%;
|
||||
// tbody tr td {
|
||||
// position: relative;
|
||||
// border: 1px solid gray;
|
||||
// vertical-align: top;
|
||||
// overflow: auto;
|
||||
// > ul {
|
||||
// padding: 0;
|
||||
// li {
|
||||
// list-style-image: none;
|
||||
// list-style-position: outside;
|
||||
// list-style-type: none;
|
||||
// -moz-background-clip: border;
|
||||
// -moz-background-inline-policy: continuous;
|
||||
// -moz-background-origin: padding;
|
||||
// background-attachment: scroll;
|
||||
// background-color: transparent;
|
||||
// .setBgPos(0, 0);
|
||||
// background-repeat: repeat-y;
|
||||
// background-image: none; /* no v-lines */
|
||||
//
|
||||
// margin: 0;
|
||||
// // padding: 1px 0 0 0; // issue #246
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// span.fancytree-node {
|
||||
// position: relative; /* allow positioning of embedded spans */
|
||||
// display: inline-block; // #117
|
||||
// }
|
||||
// span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #e0e0e0;
|
||||
// }
|
||||
// span.fancytree-node.fancytree-active {
|
||||
// background-color: #cbe8f6;
|
||||
// // background-color: royalblue;
|
||||
// }
|
||||
// .fancytree-has-children span.fancytree-cv-right {
|
||||
// position: absolute;
|
||||
// right: 3px;
|
||||
// .useSprite(0, 5);
|
||||
// &:hover {
|
||||
// .useSprite(1, 5);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'filter' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-filter-dimm {
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: bold;
|
||||
// }
|
||||
//}
|
||||
//.fancytree-ext-filter-hide {
|
||||
// tr.fancytree-hide,
|
||||
// span.fancytree-node.fancytree-hide {
|
||||
// display: none;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
//}
|
||||
///* Hide expanders if all child nodes are hidden by filter */
|
||||
//.fancytree-ext-filter-hide-expanders {
|
||||
// tr.fancytree-match span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
// visibility: visible;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//.fancytree-ext-childcounter,
|
||||
//.fancytree-ext-filter {
|
||||
// // span.fancytree-title mark {
|
||||
// // font-style: normal;
|
||||
// // background-color: #ead61c; // yellow
|
||||
// // border-radius: 3px;
|
||||
// // }
|
||||
// span.fancytree-icon,
|
||||
// span.fancytree-custom-icon {
|
||||
// position: relative;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #777; // #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// position: absolute;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// min-width: 10px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
//}
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'wide' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//ul.fancytree-ext-wide {
|
||||
// position: relative;
|
||||
// min-width: 100%;
|
||||
// z-index: 2;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
//
|
||||
// span.fancytree-node > span {
|
||||
// position: relative;
|
||||
// z-index: 2;
|
||||
// }
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// position: absolute; // Allow left: 0. Note: prevents smooth dropdown animation
|
||||
// z-index: 1; // Behind expander and checkbox
|
||||
// left: 0px;
|
||||
// min-width: 100%;
|
||||
// margin-left: 0;
|
||||
// margin-right: 0;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'fixed' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-fixed-wrapper {
|
||||
// .fancytree-ext-fixed-hidden {
|
||||
// display: none;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
// border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-right {
|
||||
// border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 3;
|
||||
// top: 0px;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tr {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// top: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-bl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-br {
|
||||
// position: absolute;
|
||||
// overflow: scroll;
|
||||
// z-index: 1;
|
||||
// }
|
||||
//}
|
||||
|
|
@ -0,0 +1,581 @@
|
|||
/*!
|
||||
* Fancytree "material" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: silver;
|
||||
}
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin 1000ms infinite linear;
|
||||
animation: spin 1000ms infinite linear;
|
||||
}
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-container {
|
||||
font-family: "Roboto Regular", tahoma, arial, helvetica;
|
||||
font-size: 24px;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0;
|
||||
background-color: white;
|
||||
border: 1px dotted gray;
|
||||
min-height: 0%;
|
||||
position: relative;
|
||||
}
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 24px;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container ul > li:before {
|
||||
content: none;
|
||||
}
|
||||
ul.fancytree-container li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0px 0px;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
background-color: silver;
|
||||
}
|
||||
ul.fancytree-connectors.fancytree-container li {
|
||||
background-image: url("../skin-material/vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: 0px;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
display: inline-block;
|
||||
margin-left: 3px;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
margin-left: 3px;
|
||||
margin-top: 0px;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-expander {
|
||||
cursor: pointer;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
margin-top: 0;
|
||||
}
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
.fancytree-fade-expander:hover span.fancytree-expander,
|
||||
.fancytree-fade-expander.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander .fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander [class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Checkbox icon
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-checkbox {
|
||||
margin-left: 3px;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox {
|
||||
opacity: 0.4;
|
||||
filter: alpha(opacity=40);
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide span.fancytree-checkbox {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node:hover span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr:hover td span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr.fancytree-selected td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus tr.fancytree-active td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-icon {
|
||||
margin-left: 3px;
|
||||
}
|
||||
/* Documents */
|
||||
/* Folders */
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: none;
|
||||
}
|
||||
/* Status node icons */
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit;
|
||||
width: 100%;
|
||||
margin-top: 1px;
|
||||
min-height: 24px;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: #212121;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
min-height: 24px;
|
||||
padding: 0 3px 0 3px;
|
||||
margin: 0px 0 0 3px;
|
||||
border: 1px solid transparent;
|
||||
-webkit-border-radius: 0px;
|
||||
-moz-border-radius: 0px;
|
||||
-ms-border-radius: 0px;
|
||||
-o-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: red;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Drag'n'drop support
|
||||
*----------------------------------------------------------------------------*/
|
||||
/* ext-dnd5: */
|
||||
span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
/* ext-dnd: */
|
||||
div.fancytree-drag-helper span.fancytree-childcounter,
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-childcounter {
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
background: #5cb85c;
|
||||
border: none;
|
||||
font-weight: bolder;
|
||||
}
|
||||
/*** Drop marker icon *********************************************************/
|
||||
#fancytree-drop-marker {
|
||||
width: 48px;
|
||||
position: absolute;
|
||||
margin: 0;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-after,
|
||||
#fancytree-drop-marker.fancytree-drop-before {
|
||||
width: 96px;
|
||||
}
|
||||
/*** Source node while dragging ***********************************************/
|
||||
span.fancytree-drag-source.fancytree-drag-remove {
|
||||
opacity: 0.15;
|
||||
}
|
||||
/*** Target node while dragging cursor is over it *****************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-container.fancytree-rtl .fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/
|
||||
/* optional: reverse title letters */
|
||||
}
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("../skin-material/vline-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl li.fancytree-lastsib,
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'table' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-table {
|
||||
font-family: "Roboto Regular", tahoma, arial, helvetica;
|
||||
font-size: 24px;
|
||||
border-collapse: collapse;
|
||||
/* ext-ariagrid */
|
||||
}
|
||||
table.fancytree-ext-table span.fancytree-node {
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
table.fancytree-ext-table td.fancytree-status-merged {
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
color: silver;
|
||||
}
|
||||
table.fancytree-ext-table tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
color: red;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr.fancytree-active > td {
|
||||
background-color: #eee;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #3875d7;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'columnview' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-columnview tbody tr td {
|
||||
position: relative;
|
||||
border: 1px solid gray;
|
||||
vertical-align: top;
|
||||
overflow: auto;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul {
|
||||
padding: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0px 0px;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
/* no v-lines */
|
||||
margin: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node {
|
||||
position: relative;
|
||||
/* allow positioning of embedded spans */
|
||||
display: inline-block;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'filter' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-filter-dimm span.fancytree-node span.fancytree-title {
|
||||
color: silver;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-hide,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-hide {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: silver;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* Hide expanders if all child nodes are hidden by filter */
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-match span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-submatch span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
visibility: visible;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-icon,
|
||||
.fancytree-ext-filter span.fancytree-icon,
|
||||
.fancytree-ext-childcounter span.fancytree-custom-icon,
|
||||
.fancytree-ext-filter span.fancytree-custom-icon {
|
||||
position: relative;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-childcounter,
|
||||
.fancytree-ext-filter span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #777;
|
||||
border: 1px solid gray;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'wide' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-ext-wide {
|
||||
position: relative;
|
||||
min-width: 100%;
|
||||
z-index: 2;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node > span {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node span.fancytree-title {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: 0px;
|
||||
min-width: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'fixed' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-fixed-wrapper .fancytree-ext-fixed-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-right {
|
||||
border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 3;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tr {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
top: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-bl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-br {
|
||||
position: absolute;
|
||||
overflow: scroll;
|
||||
z-index: 1;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
/*
|
||||
https://material.io/guidelines/components/data-tables.html#data-tables-structure
|
||||
*/
|
||||
ul.fancytree-container ul {
|
||||
padding: 0.3em 0 0 1em;
|
||||
margin: 0;
|
||||
font-size: 24px;
|
||||
color: #212121;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
.fancytree-plain span.fancytree-selected span.fancytree-title {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.fancytree-plain span.fancytree-selected span.fancytree-title:hover,
|
||||
.fancytree-plain span.fancytree-active span.fancytree-title {
|
||||
background-color: #eeeeee;
|
||||
}
|
||||
.fancytree-container span.fancytree-checkbox {
|
||||
color: #ff4081;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'table' extension
|
||||
*/
|
||||
table.fancytree-ext-table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-focused,
|
||||
table.fancytree-ext-table tbody tr.fancytree-selected {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-active,
|
||||
table.fancytree-ext-table tbody tr:hover {
|
||||
background-color: #eeeeee;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'columnview' extension
|
||||
*/
|
||||
table.fancytree-ext-columnview tbody tr td {
|
||||
border: 1px solid gray;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #ccc;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: royalblue;
|
||||
}
|
||||
|
|
@ -0,0 +1,131 @@
|
|||
/*!
|
||||
* Fancytree "material" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
|
||||
// Import common styles
|
||||
@import "skin-common.less";
|
||||
|
||||
// We need to define this variable here (not in skin-common.less) to make it
|
||||
// work with grunt and webpack:
|
||||
@fancy-image-prefix: "./skin-material/";
|
||||
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
/*
|
||||
https://material.io/guidelines/components/data-tables.html#data-tables-structure
|
||||
*/
|
||||
// local vars
|
||||
@fancy-cst-size: 18px;
|
||||
@fancy-cst-primary-color: #3f51b5; // primary app color (of indigo-pink)
|
||||
@fancy-cst-secondary-color: #ff4081; // secondary app color (of indigo-pink): checkbox
|
||||
@fancy-cst-black-87: #212121; // 87% black: table content
|
||||
@fancy-cst-black-54: #757575; // 54% black: column headers
|
||||
@fancy-cst-select-bg: #f5f5f5; // Grey 100: selected row backround
|
||||
@fancy-cst-hover-bg: #eeeeee; // Grey 200: hovered row backround
|
||||
|
||||
// Override the variable after the import.
|
||||
// NOTE: Variables are always resolved as the last definition, even if it is
|
||||
// after where it is used.
|
||||
@fancy-use-sprites: false; // false: suppress all background images (i.e. icons)
|
||||
@fancy-loading-url: none;
|
||||
|
||||
@fancy-level-indent: @fancy-cst-size; //@fancy-cst-size;
|
||||
@fancy-line-height: @fancy-cst-size; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: @fancy-cst-size;
|
||||
@fancy-icon-height: @fancy-cst-size;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false;
|
||||
|
||||
//default 10pt, which is used in a relative manner resulting in 13.3 in dokuwiki-template.
|
||||
@fancy-font-size: 93%; //@fancy-cst-size;
|
||||
@fancy-font-family: "Roboto Regular", tahoma, arial, helvetica;
|
||||
@fancy-font-color: @fancy-cst-black-87;
|
||||
@fancy-font-color-dimm: silver;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
|
||||
ul.fancytree-container ul
|
||||
{
|
||||
padding: 0 0 0 1em; //0.3em 0 0 1em;
|
||||
margin: 0;
|
||||
//font-size: @fancy-cst-size;
|
||||
//color: @fancy-cst-black-87;
|
||||
}
|
||||
|
||||
ul.fancytree-container span.fancytree-icon.material-icons
|
||||
{
|
||||
font-size: @fancy-cst-size;
|
||||
color: @fancy-cst-black-87;
|
||||
}
|
||||
|
||||
|
||||
// set icon color to font color as well
|
||||
span.fancytree-node {
|
||||
color: @fancy-font-color;
|
||||
}
|
||||
span.fancytree-expander {
|
||||
font-size: @fancy-cst-size;
|
||||
}
|
||||
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
|
||||
.fancytree-plain {
|
||||
span.fancytree-selected span.fancytree-title {
|
||||
background-color: @fancy-cst-select-bg;
|
||||
}
|
||||
span.fancytree-selected span.fancytree-title:hover,
|
||||
span.fancytree-active span.fancytree-title {
|
||||
background-color: @fancy-cst-hover-bg;
|
||||
}
|
||||
}
|
||||
|
||||
.fancytree-container span.fancytree-checkbox {
|
||||
color: @fancy-cst-secondary-color;
|
||||
}
|
||||
|
||||
///*******************************************************************************
|
||||
// * 'table' extension
|
||||
// */
|
||||
//table.fancytree-ext-table {
|
||||
// border-collapse: collapse;
|
||||
// tbody {
|
||||
// tr.fancytree-focused, tr.fancytree-selected {
|
||||
// background-color: @fancy-cst-select-bg;
|
||||
// }
|
||||
// tr.fancytree-active, tr:hover {
|
||||
// background-color: @fancy-cst-hover-bg;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*******************************************************************************
|
||||
// * 'columnview' extension
|
||||
// */
|
||||
//
|
||||
//table.fancytree-ext-columnview tbody tr td {
|
||||
// border: 1px solid gray;
|
||||
//}
|
||||
//table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #ccc;
|
||||
//}
|
||||
//table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
// background-color: royalblue;
|
||||
//}
|
||||
6
plugins/55/indexmenu/scripts/fancytree/skin-material/ui.fancytree.min.css
vendored
Normal file
6
plugins/55/indexmenu/scripts/fancytree/skin-material/ui.fancytree.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 842 B |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-material/vline.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-material/vline.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 844 B |
972
plugins/55/indexmenu/scripts/fancytree/skin-mdi/skin-common.less
Normal file
972
plugins/55/indexmenu/scripts/fancytree/skin-mdi/skin-common.less
Normal file
|
|
@ -0,0 +1,972 @@
|
|||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
|
||||
// Variables (defaults, may be overwritten by the including .less files)
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
// @fancy-hide-connectors: true; // false: show vertical connector lines
|
||||
|
||||
@fancy-level-indent: 16px;
|
||||
@fancy-line-height: 16px; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-line-ofs-top: (@fancy-line-height - @fancy-icon-height) / 2;
|
||||
|
||||
// webpack uses /dist/skin-common.less as root path
|
||||
// grunt-less uses /dist/skin-Xxx/ui.fancyree.less as root path
|
||||
// So we define our theme LESS files for webpack compatibility, i.e.
|
||||
// define the image path n every main LESS file instead of here.
|
||||
// Prefix may be set to "", "/", "./", or any other value
|
||||
// Note: this variable must be defined by the main LESS files:
|
||||
// @fancy-image-prefix: "";
|
||||
|
||||
// Use 'url(...)' to link to the throbber image, or
|
||||
// use data-uri(...)' to inline the data in css instead:
|
||||
/* CHANGE use url, as less does not handel data-uri() correct. DokuWiki can eventually inline it */
|
||||
@fancy-loading-url: url("@{fancy-image-prefix}loading.gif");
|
||||
//@fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false; // data-uri() is not handle correct by phpless
|
||||
|
||||
@fancy-font-size: 10pt;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: black;
|
||||
@fancy-font-color-dimm: #c0c0c0;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
// Mixins
|
||||
//------------------------------------------------------------------------------
|
||||
.setBgPos(@x, @y, @cond:true) when (@cond) {
|
||||
background-position: (@x * -@fancy-icon-width) (@y * -@fancy-icon-height);
|
||||
}
|
||||
.clearBgImage(@cond:true) when (@cond) {
|
||||
background-image: none;
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and not (@fancy-inline-sprites) {
|
||||
background-image: url("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and (@fancy-inline-sprites) {
|
||||
background-image: data-uri("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.useSprite(@x, @y) when (@fancy-use-sprites) {
|
||||
.setBgPos(@x, @y);
|
||||
}
|
||||
.rounded-corners(@radius) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
-ms-border-radius: @radius;
|
||||
-o-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor) {
|
||||
border-color: @bordercolor;
|
||||
background: @bgcolor;
|
||||
color: @color;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor, @startColor, @stopColor) {
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor);
|
||||
// @c-start: argb(@startColor);
|
||||
// @c-end: argb(@stopColor);
|
||||
background: -moz-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // FF3.6+
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, @startColor),
|
||||
color-stop(100%, @stopColor)
|
||||
); // Chrome,Safari4+
|
||||
background: -webkit-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Chrome10+,Safari5.1+
|
||||
background: -o-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Opera 11.10+
|
||||
background: -ms-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // IE10+
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // W3C
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{stopColor}',GradientType=0 ); // IE6-9
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
// Redefine, in case jQuery-UI is not included
|
||||
// .ui-helper-hidden,
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
// tri-state checkbox
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: @fancy-font-color-dimm;
|
||||
}
|
||||
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
/* CHANGE: renamed spin to spin-fancytree */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin-fancytree 1000ms infinite linear;
|
||||
animation: spin-fancytree 1000ms infinite linear;
|
||||
}
|
||||
/* CHANGE: commented because it is wrong prefixed by phpless
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
*/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
ul.fancytree-container {
|
||||
font-family: @fancy-font-family;
|
||||
font-size: @fancy-font-size;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0; // DT issue 201
|
||||
//background-color: white; CHANGE
|
||||
//border: 1px dotted gray; CHANGE
|
||||
// overflow: auto; // ext-dnd5: otherwise this is always the scroll parent
|
||||
// height: 100%; // DT issue 263, 470
|
||||
min-height: 0%; // #192
|
||||
position: relative; // #235
|
||||
ul {
|
||||
padding: 0 0 0 @fancy-level-indent;
|
||||
margin: 0;
|
||||
}
|
||||
ul > li:before {
|
||||
// #538
|
||||
content: none;
|
||||
}
|
||||
li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
.setBgPos(0, 0);
|
||||
background-repeat: repeat-y;
|
||||
background-image: none; // no v-lines
|
||||
|
||||
margin: 0;
|
||||
// padding: 1px 0 0 0; // issue #246
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Style, when control is disabled
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
// filter: alpha(opacity=50); // Yields a css warning
|
||||
background-color: silver;
|
||||
}
|
||||
|
||||
ul.fancytree-connectors.fancytree-container {
|
||||
li {
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
/* CHANGE: phpless does not handle data-uri() correct */
|
||||
//background-image: data-uri("@{fancy-image-prefix}vline.gif");
|
||||
background-image: url("@{fancy-image-prefix}vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Suppress lines for last child node
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
// Fix jQuery UI 'blind' animation for jQuery UI (#717)
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
// display: -moz-inline-box; // @ FF 1+2 removed for issue 221
|
||||
// -moz-box-align: start; /* issue 221 */
|
||||
display: inline-block; // Required to make a span sizeable
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
// background-position: left;
|
||||
.setBgImageUrl("icons.gif");
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
display: inline-block;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-expander {
|
||||
// .useSprite(0, 5);
|
||||
cursor: pointer;
|
||||
}
|
||||
// span.fancytree-expander:hover {
|
||||
// // .useSprite(1, 5);
|
||||
// }
|
||||
|
||||
// --- End nodes (use connectors instead of expanders)
|
||||
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
// .clearBgImage( @fancy-hide-connectors );
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors {
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander, // End-node, not last sibling
|
||||
.fancytree-exp-n span.fancytree-expander:hover {
|
||||
.useSprite(0, 4);
|
||||
}
|
||||
.fancytree-exp-nl span.fancytree-expander, // End-node, last sibling
|
||||
.fancytree-exp-nl span.fancytree-expander:hover {
|
||||
.useSprite(1, 4);
|
||||
}
|
||||
}
|
||||
|
||||
// --- Collapsed
|
||||
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
// Collapsed, not delayed, not last sibling
|
||||
.useSprite(0, 5);
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
.useSprite(1, 5);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
// Collapsed, not delayed, last sibling
|
||||
.useSprite(0, 6);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
.useSprite(1, 6);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
// Collapsed, delayed, not last sibling
|
||||
.useSprite(4, 5);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
.useSprite(5, 5);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
// Collapsed, delayed, last sibling
|
||||
.useSprite(4, 6);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
.useSprite(5, 6);
|
||||
}
|
||||
|
||||
// --- Expanded
|
||||
|
||||
.fancytree-exp-e span.fancytree-expander, // Expanded, not delayed, not last sibling
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
// Expanded, delayed, not last sibling
|
||||
.useSprite(2, 5);
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
.useSprite(3, 5);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander, // Expanded, not delayed, last sibling
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
// Expanded, delayed, last sibling
|
||||
.useSprite(2, 6);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
.useSprite(3, 6);
|
||||
}
|
||||
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander {
|
||||
span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover span.fancytree-expander,
|
||||
&.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-treefocus span.fancytree-expander,
|
||||
[class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Checkbox icon
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//span.fancytree-checkbox {
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
// .useSprite(0, 2);
|
||||
// &:hover {
|
||||
// .useSprite(1, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(1, 3);
|
||||
// }
|
||||
//}
|
||||
//.fancytree-partsel span.fancytree-checkbox {
|
||||
// .useSprite(4, 2);
|
||||
// &:hover {
|
||||
// .useSprite(5, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(4, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(5, 3);
|
||||
// }
|
||||
//}
|
||||
//// selected after partsel, so it takes precedence:
|
||||
//.fancytree-selected span.fancytree-checkbox {
|
||||
// .useSprite(2, 2);
|
||||
// &:hover {
|
||||
// .useSprite(3, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(3, 3);
|
||||
// }
|
||||
//}
|
||||
//// Unselectable is dimmed, without hover effects
|
||||
//.fancytree-unselectable {
|
||||
// span.fancytree-checkbox {
|
||||
// opacity: 0.4;
|
||||
// filter: alpha(opacity=40);
|
||||
// }
|
||||
// span.fancytree-checkbox:hover {
|
||||
// .useSprite(0, 2);
|
||||
// }
|
||||
// span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
// .useSprite(4, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox:hover {
|
||||
// .useSprite(2, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//// Auto-hide checkboxes unless selected or hovered
|
||||
//.fancytree-container.fancytree-checkbox-auto-hide {
|
||||
// span.fancytree-checkbox {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .fancytree-node:hover span.fancytree-checkbox,
|
||||
// tr:hover td span.fancytree-checkbox,
|
||||
// .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
// tr.fancytree-selected td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// &.fancytree-treefocus {
|
||||
// .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
// tr.fancytree-active td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-icon {
|
||||
// Default icon
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
// .useSprite(0, 0);
|
||||
}
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(1, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(3, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
.useSprite(5, 0);
|
||||
}
|
||||
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
.useSprite(0, 1);
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(1, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(3, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
.useSprite(5, 1);
|
||||
}
|
||||
|
||||
// 'Loading' status overrides all others
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: @fancy-loading-url;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Status node icons */
|
||||
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
.useSprite(0, 7);
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit; // #117, resolves to 'display: list-item;' for standard trees
|
||||
width: 100%;
|
||||
margin-top: @fancy-node-v-spacing;
|
||||
min-height: @fancy-line-height;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: @fancy-font-color; // inherit doesn't work on IE
|
||||
cursor: pointer;
|
||||
display: inline-block; // Better alignment, when title contains <br>
|
||||
vertical-align: top;
|
||||
min-height: @fancy-line-height;
|
||||
padding: 0 3px 0 3px; // Otherwise italic font will be outside right bounds
|
||||
margin: @fancy-title-ofs-top 0 0 @fancy-icon-spacing;
|
||||
// margin: 0px;
|
||||
// margin-top: @fancy-line-ofs-top;
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
.rounded-corners(@fancy-node-border-radius);
|
||||
// outline: 0; // @ Firefox, prevent dotted border after click
|
||||
// Set transparent border to prevent jumping when active node gets a border
|
||||
// (we can do this, because this theme doesn't use vertical lines)
|
||||
// border: 1px solid white; // Note: 'transparent' would not work in IE6
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Drag'n'drop support
|
||||
// *----------------------------------------------------------------------------*/
|
||||
///* ext-dnd5: */
|
||||
//span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
//}
|
||||
//
|
||||
///* ext-dnd: */
|
||||
//div.fancytree-drag-helper {
|
||||
// span.fancytree-childcounter,
|
||||
// span.fancytree-dnd-modifier {
|
||||
// display: inline-block;
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// min-width: 10px;
|
||||
// // min-height: 16px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// position: absolute;
|
||||
// // left: 16px;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// }
|
||||
// span.fancytree-dnd-modifier {
|
||||
// background: #5cb85c; // bootstrap green
|
||||
// border: none;
|
||||
// // min-height: 16px;
|
||||
// // font-size: 12px;
|
||||
// font-weight: bolder;
|
||||
// }
|
||||
// &.fancytree-drop-accept {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(2, 7);
|
||||
// }
|
||||
// }
|
||||
// &.fancytree-drop-reject {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(1, 7);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Drop marker icon *********************************************************/
|
||||
//#fancytree-drop-marker {
|
||||
// width: 2 * @fancy-icon-width; // was 24px, but 32 should be correct
|
||||
// position: absolute;
|
||||
// .useSprite(0, 8);
|
||||
// margin: 0;
|
||||
// &.fancytree-drop-after,
|
||||
// &.fancytree-drop-before {
|
||||
// width: 4 * @fancy-icon-width; // 64px;
|
||||
// .useSprite(0, 9);
|
||||
// }
|
||||
// &.fancytree-drop-copy {
|
||||
// .useSprite(4, 8);
|
||||
// }
|
||||
// &.fancytree-drop-move {
|
||||
// .useSprite(2, 8);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Source node while dragging ***********************************************/
|
||||
//
|
||||
//span.fancytree-drag-source {
|
||||
// &.fancytree-drag-remove {
|
||||
// // text-decoration: line-through;
|
||||
// opacity: 0.15;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Target node while dragging cursor is over it *****************************/
|
||||
//
|
||||
//span.fancytree-drop-target {
|
||||
// &.fancytree-drop-accept {
|
||||
// // outline: 1px dotted #5cb85c; // bootstrap sucess
|
||||
// }
|
||||
//}
|
||||
//span.fancytree-drop-reject {
|
||||
// // outline: 1px dotted #d9534f; // boostrap warning
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
.fancytree-container.fancytree-rtl {
|
||||
.fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/ /* optional: reverse title letters */
|
||||
}
|
||||
span.fancytree-connector,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-drag-helper-img {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
&.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
&.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl {
|
||||
ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
&.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("@{fancy-image-prefix}vline-rtl.gif");
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
&.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'table' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-table {
|
||||
// font-family: @fancy-font-family;
|
||||
// font-size: @fancy-font-size;
|
||||
// border-collapse: collapse;
|
||||
// span.fancytree-node {
|
||||
// display: inline-block; // #117
|
||||
// box-sizing: border-box; // #562
|
||||
// }
|
||||
// td.fancytree-status-merged {
|
||||
// text-align: center;
|
||||
// // font-weight: bold;
|
||||
// font-style: italic;
|
||||
// // line-height: 100px;
|
||||
// color: @fancy-font-color-dimm;
|
||||
// }
|
||||
// tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
// color: @fancy-font-error-color;
|
||||
// }
|
||||
// /* ext-ariagrid */
|
||||
// &.fancytree-ext-ariagrid.fancytree-cell-mode {
|
||||
// > tbody > tr.fancytree-active > td {
|
||||
// background-color: #eee;
|
||||
// }
|
||||
// > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #cbe8f6;
|
||||
// }
|
||||
// &.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #3875d7;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'columnview' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-columnview {
|
||||
// // border-collapse: collapse;
|
||||
// // width: 100%;
|
||||
// tbody tr td {
|
||||
// position: relative;
|
||||
// border: 1px solid gray;
|
||||
// vertical-align: top;
|
||||
// overflow: auto;
|
||||
// > ul {
|
||||
// padding: 0;
|
||||
// li {
|
||||
// list-style-image: none;
|
||||
// list-style-position: outside;
|
||||
// list-style-type: none;
|
||||
// -moz-background-clip: border;
|
||||
// -moz-background-inline-policy: continuous;
|
||||
// -moz-background-origin: padding;
|
||||
// background-attachment: scroll;
|
||||
// background-color: transparent;
|
||||
// .setBgPos(0, 0);
|
||||
// background-repeat: repeat-y;
|
||||
// background-image: none; /* no v-lines */
|
||||
//
|
||||
// margin: 0;
|
||||
// // padding: 1px 0 0 0; // issue #246
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// span.fancytree-node {
|
||||
// position: relative; /* allow positioning of embedded spans */
|
||||
// display: inline-block; // #117
|
||||
// }
|
||||
// span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #e0e0e0;
|
||||
// }
|
||||
// span.fancytree-node.fancytree-active {
|
||||
// background-color: #cbe8f6;
|
||||
// // background-color: royalblue;
|
||||
// }
|
||||
// .fancytree-has-children span.fancytree-cv-right {
|
||||
// position: absolute;
|
||||
// right: 3px;
|
||||
// .useSprite(0, 5);
|
||||
// &:hover {
|
||||
// .useSprite(1, 5);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'filter' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-filter-dimm {
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: bold;
|
||||
// }
|
||||
//}
|
||||
//.fancytree-ext-filter-hide {
|
||||
// tr.fancytree-hide,
|
||||
// span.fancytree-node.fancytree-hide {
|
||||
// display: none;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
//}
|
||||
///* Hide expanders if all child nodes are hidden by filter */
|
||||
//.fancytree-ext-filter-hide-expanders {
|
||||
// tr.fancytree-match span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
// visibility: visible;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//.fancytree-ext-childcounter,
|
||||
//.fancytree-ext-filter {
|
||||
// // span.fancytree-title mark {
|
||||
// // font-style: normal;
|
||||
// // background-color: #ead61c; // yellow
|
||||
// // border-radius: 3px;
|
||||
// // }
|
||||
// span.fancytree-icon,
|
||||
// span.fancytree-custom-icon {
|
||||
// position: relative;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #777; // #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// position: absolute;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// min-width: 10px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
//}
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'wide' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//ul.fancytree-ext-wide {
|
||||
// position: relative;
|
||||
// min-width: 100%;
|
||||
// z-index: 2;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
//
|
||||
// span.fancytree-node > span {
|
||||
// position: relative;
|
||||
// z-index: 2;
|
||||
// }
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// position: absolute; // Allow left: 0. Note: prevents smooth dropdown animation
|
||||
// z-index: 1; // Behind expander and checkbox
|
||||
// left: 0px;
|
||||
// min-width: 100%;
|
||||
// margin-left: 0;
|
||||
// margin-right: 0;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'fixed' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-fixed-wrapper {
|
||||
// .fancytree-ext-fixed-hidden {
|
||||
// display: none;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
// border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-right {
|
||||
// border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 3;
|
||||
// top: 0px;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tr {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// top: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-bl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-br {
|
||||
// position: absolute;
|
||||
// overflow: scroll;
|
||||
// z-index: 1;
|
||||
// }
|
||||
//}
|
||||
|
|
@ -0,0 +1,131 @@
|
|||
/*!
|
||||
* Fancytree "material" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
|
||||
// Import common styles
|
||||
@import "skin-common.less";
|
||||
|
||||
// We need to define this variable here (not in skin-common.less) to make it
|
||||
// work with grunt and webpack:
|
||||
@fancy-image-prefix: "./skin-mdi/";
|
||||
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
/*
|
||||
https://material.io/guidelines/components/data-tables.html#data-tables-structure
|
||||
*/
|
||||
// local vars
|
||||
@fancy-cst-size: 18px;
|
||||
@fancy-cst-primary-color: #3f51b5; // primary app color (of indigo-pink)
|
||||
@fancy-cst-secondary-color: #ff4081; // secondary app color (of indigo-pink): checkbox
|
||||
@fancy-cst-black-87: #212121; // 87% black: table content
|
||||
@fancy-cst-black-54: #757575; // 54% black: column headers
|
||||
@fancy-cst-select-bg: #f5f5f5; // Grey 100: selected row backround
|
||||
@fancy-cst-hover-bg: #eeeeee; // Grey 200: hovered row backround
|
||||
|
||||
// Override the variable after the import.
|
||||
// NOTE: Variables are always resolved as the last definition, even if it is
|
||||
// after where it is used.
|
||||
@fancy-use-sprites: false; // false: suppress all background images (i.e. icons)
|
||||
@fancy-loading-url: none;
|
||||
|
||||
@fancy-level-indent: @fancy-cst-size; //@fancy-cst-size;
|
||||
@fancy-line-height: @fancy-cst-size; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: @fancy-cst-size;
|
||||
@fancy-icon-height: @fancy-cst-size;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: -2px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false;
|
||||
|
||||
//default 10pt, which is used in a relative manner resulting in 13.3 in dokuwiki-template.
|
||||
@fancy-font-size: 93%; //@fancy-cst-size;
|
||||
@fancy-font-family: "Roboto Regular", tahoma, arial, helvetica;
|
||||
@fancy-font-color: @fancy-cst-black-87;
|
||||
@fancy-font-color-dimm: silver;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
|
||||
ul.fancytree-container ul
|
||||
{
|
||||
padding: 0 0 0 1em; //0.3em 0 0 1em;
|
||||
margin: 0;
|
||||
//font-size: @fancy-cst-size;
|
||||
//color: @fancy-cst-black-87;
|
||||
}
|
||||
|
||||
ul.fancytree-container span.fancytree-icon.mdi
|
||||
{
|
||||
font-size: @fancy-cst-size;
|
||||
color: @fancy-cst-black-87;
|
||||
}
|
||||
|
||||
|
||||
// set icon color to font color as well
|
||||
span.fancytree-node {
|
||||
color: @fancy-font-color;
|
||||
}
|
||||
span.fancytree-expander {
|
||||
font-size: @fancy-cst-size;
|
||||
}
|
||||
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
|
||||
.fancytree-plain {
|
||||
span.fancytree-selected span.fancytree-title {
|
||||
background-color: @fancy-cst-select-bg;
|
||||
}
|
||||
span.fancytree-selected span.fancytree-title:hover,
|
||||
span.fancytree-active span.fancytree-title {
|
||||
background-color: @fancy-cst-hover-bg;
|
||||
}
|
||||
}
|
||||
|
||||
.fancytree-container span.fancytree-checkbox {
|
||||
color: @fancy-cst-secondary-color;
|
||||
}
|
||||
|
||||
///*******************************************************************************
|
||||
// * 'table' extension
|
||||
// */
|
||||
//table.fancytree-ext-table {
|
||||
// border-collapse: collapse;
|
||||
// tbody {
|
||||
// tr.fancytree-focused, tr.fancytree-selected {
|
||||
// background-color: @fancy-cst-select-bg;
|
||||
// }
|
||||
// tr.fancytree-active, tr:hover {
|
||||
// background-color: @fancy-cst-hover-bg;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*******************************************************************************
|
||||
// * 'columnview' extension
|
||||
// */
|
||||
//
|
||||
//table.fancytree-ext-columnview tbody tr td {
|
||||
// border: 1px solid gray;
|
||||
//}
|
||||
//table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #ccc;
|
||||
//}
|
||||
//table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
// background-color: royalblue;
|
||||
//}
|
||||
BIN
plugins/55/indexmenu/scripts/fancytree/skin-mdi/vline-rtl.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-mdi/vline-rtl.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 842 B |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-mdi/vline.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-mdi/vline.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 844 B |
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
|
|
@ -0,0 +1,716 @@
|
|||
/*!
|
||||
* Fancytree "ThemeRoller" skin.
|
||||
* This file should be included after a jQuery Themeroller style sheet.
|
||||
* It is meant to be used together with the ext-themeroller extension.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: #c0c0c0;
|
||||
}
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin 1000ms infinite linear;
|
||||
animation: spin 1000ms infinite linear;
|
||||
}
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-container {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0;
|
||||
background-color: white;
|
||||
border: 1px dotted gray;
|
||||
min-height: 0%;
|
||||
position: relative;
|
||||
}
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 16px;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container ul > li:before {
|
||||
content: none;
|
||||
}
|
||||
ul.fancytree-container li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0px 0px;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
background-color: silver;
|
||||
}
|
||||
ul.fancytree-connectors.fancytree-container li {
|
||||
background-image: url("../skin-themeroller/vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url("../skin-themeroller/icons.gif");
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: 2px;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
margin-left: 3px;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-left: 3px;
|
||||
margin-top: 2px;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-expander {
|
||||
cursor: pointer;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: url("../skin-themeroller/icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander:hover {
|
||||
background-position: 0px -64px;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander:hover {
|
||||
background-position: -16px -64px;
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
background-position: 0px -80px;
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
background-position: -16px -80px;
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
background-position: 0px -96px;
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
background-position: -16px -96px;
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
background-position: -64px -80px;
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
background-position: -80px -80px;
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
background-position: -64px -96px;
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
background-position: -80px -96px;
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander,
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
background-position: -32px -80px;
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
background-position: -48px -80px;
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander,
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
background-position: -32px -96px;
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
background-position: -48px -96px;
|
||||
}
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
.fancytree-fade-expander:hover span.fancytree-expander,
|
||||
.fancytree-fade-expander.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander .fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander [class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Checkbox icon
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-checkbox {
|
||||
margin-left: 3px;
|
||||
background-position: 0px -32px;
|
||||
}
|
||||
span.fancytree-checkbox:hover {
|
||||
background-position: -16px -32px;
|
||||
}
|
||||
span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: 0px -48px;
|
||||
}
|
||||
span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -16px -48px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox {
|
||||
background-position: -64px -32px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
background-position: -80px -32px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: -64px -48px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -80px -48px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox {
|
||||
background-position: -32px -32px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox:hover {
|
||||
background-position: -48px -32px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: -32px -48px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -48px -48px;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox {
|
||||
opacity: 0.4;
|
||||
filter: alpha(opacity=40);
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox:hover {
|
||||
background-position: 0px -32px;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: 0px -48px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
background-position: -64px -32px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-selected span.fancytree-checkbox:hover {
|
||||
background-position: -32px -32px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -32px -48px;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide span.fancytree-checkbox {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node:hover span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr:hover td span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr.fancytree-selected td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus tr.fancytree-active td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-icon {
|
||||
margin-left: 3px;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
background-position: -16px 0px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
background-position: -32px 0px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
background-position: -48px 0px;
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
background-position: -64px 0px;
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
background-position: -80px 0px;
|
||||
}
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
background-position: 0px -16px;
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
background-position: -16px -16px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
background-position: -32px -16px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
background-position: -48px -16px;
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
background-position: -64px -16px;
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
background-position: -80px -16px;
|
||||
}
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: url("../skin-themeroller/loading.gif");
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Status node icons */
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
background-position: 0px -112px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit;
|
||||
width: 100%;
|
||||
margin-top: 0px;
|
||||
min-height: 20px;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: black;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
min-height: 20px;
|
||||
padding: 0 3px 0 3px;
|
||||
margin: 0px 0 0 3px;
|
||||
border: 1px solid transparent;
|
||||
-webkit-border-radius: 0px;
|
||||
-moz-border-radius: 0px;
|
||||
-ms-border-radius: 0px;
|
||||
-o-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: red;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Drag'n'drop support
|
||||
*----------------------------------------------------------------------------*/
|
||||
/* ext-dnd5: */
|
||||
span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
/* ext-dnd: */
|
||||
div.fancytree-drag-helper span.fancytree-childcounter,
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-childcounter {
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
background: #5cb85c;
|
||||
border: none;
|
||||
font-weight: bolder;
|
||||
}
|
||||
div.fancytree-drag-helper.fancytree-drop-accept span.fancytree-drag-helper-img {
|
||||
background-position: -32px -112px;
|
||||
}
|
||||
div.fancytree-drag-helper.fancytree-drop-reject span.fancytree-drag-helper-img {
|
||||
background-position: -16px -112px;
|
||||
}
|
||||
/*** Drop marker icon *********************************************************/
|
||||
#fancytree-drop-marker {
|
||||
width: 32px;
|
||||
position: absolute;
|
||||
background-position: 0px -128px;
|
||||
margin: 0;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-after,
|
||||
#fancytree-drop-marker.fancytree-drop-before {
|
||||
width: 64px;
|
||||
background-position: 0px -144px;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-copy {
|
||||
background-position: -64px -128px;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-move {
|
||||
background-position: -32px -128px;
|
||||
}
|
||||
/*** Source node while dragging ***********************************************/
|
||||
span.fancytree-drag-source.fancytree-drag-remove {
|
||||
opacity: 0.15;
|
||||
}
|
||||
/*** Target node while dragging cursor is over it *****************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-container.fancytree-rtl .fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/
|
||||
/* optional: reverse title letters */
|
||||
}
|
||||
.fancytree-container.fancytree-rtl span.fancytree-connector,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-icon,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-drag-helper-img {
|
||||
background-image: url("../skin-themeroller/icons-rtl.gif");
|
||||
}
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
.fancytree-container.fancytree-rtl.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: url("../skin-themeroller/icons-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("../skin-themeroller/vline-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl li.fancytree-lastsib,
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
background-image: url("../skin-themeroller/icons-rtl.gif");
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'table' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-table {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
border-collapse: collapse;
|
||||
/* ext-ariagrid */
|
||||
}
|
||||
table.fancytree-ext-table span.fancytree-node {
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
table.fancytree-ext-table td.fancytree-status-merged {
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
color: #c0c0c0;
|
||||
}
|
||||
table.fancytree-ext-table tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
color: red;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr.fancytree-active > td {
|
||||
background-color: #eee;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #3875d7;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'columnview' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-columnview tbody tr td {
|
||||
position: relative;
|
||||
border: 1px solid gray;
|
||||
vertical-align: top;
|
||||
overflow: auto;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul {
|
||||
padding: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0px 0px;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
/* no v-lines */
|
||||
margin: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node {
|
||||
position: relative;
|
||||
/* allow positioning of embedded spans */
|
||||
display: inline-block;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
background-position: 0px -80px;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right:hover {
|
||||
background-position: -16px -80px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'filter' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-filter-dimm span.fancytree-node span.fancytree-title {
|
||||
color: #c0c0c0;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-hide,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-hide {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: #c0c0c0;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* Hide expanders if all child nodes are hidden by filter */
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-match span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-submatch span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
visibility: visible;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-icon,
|
||||
.fancytree-ext-filter span.fancytree-icon,
|
||||
.fancytree-ext-childcounter span.fancytree-custom-icon,
|
||||
.fancytree-ext-filter span.fancytree-custom-icon {
|
||||
position: relative;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-childcounter,
|
||||
.fancytree-ext-filter span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #777;
|
||||
border: 1px solid gray;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'wide' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-ext-wide {
|
||||
position: relative;
|
||||
min-width: 100%;
|
||||
z-index: 2;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node > span {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node span.fancytree-title {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: 0px;
|
||||
min-width: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'fixed' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-fixed-wrapper .fancytree-ext-fixed-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-right {
|
||||
border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 3;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tr {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
top: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-bl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-br {
|
||||
position: absolute;
|
||||
overflow: scroll;
|
||||
z-index: 1;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
.fancytree-plain span.fancytree-node {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'table' extension
|
||||
*/
|
||||
table.fancytree-ext-table tbody tr td {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
|
@ -0,0 +1,64 @@
|
|||
/*!
|
||||
* Fancytree "ThemeRoller" skin.
|
||||
* This file should be included after a jQuery Themeroller style sheet.
|
||||
* It is meant to be used together with the ext-themeroller extension.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
|
||||
// Import common styles
|
||||
@import "../skin-common.less";
|
||||
|
||||
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
|
||||
|
||||
// Override the variable after the import.
|
||||
// NOTE: Variables are always resolved as the last definition, even if it is
|
||||
// after where it is used.
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
|
||||
@fancy-line-height: 20px; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 0px; // gap between two node borders
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 2px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
|
||||
// We need to define this variable here (not in skin-common.less) to make it
|
||||
// work with grunt and webpack:
|
||||
@fancy-image-prefix: "./skin-themeroller/";
|
||||
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
// @fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
// Set to `true` to use `data-uri(...)` which will embed icons.gif into CSS
|
||||
// instead of linking to that file:
|
||||
// @fancy-inline-sprites: true;
|
||||
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
.fancytree-plain {
|
||||
span.fancytree-node {
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
}
|
||||
}
|
||||
|
||||
/*******************************************************************************
|
||||
* 'table' extension
|
||||
*/
|
||||
table.fancytree-ext-table tbody {
|
||||
tr td {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
}
|
||||
8
plugins/55/indexmenu/scripts/fancytree/skin-themeroller/ui.fancytree.min.css
vendored
Normal file
8
plugins/55/indexmenu/scripts/fancytree/skin-themeroller/ui.fancytree.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 852 B |
Binary file not shown.
|
After Width: | Height: | Size: 852 B |
|
|
@ -0,0 +1,972 @@
|
|||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
|
||||
// Variables (defaults, may be overwritten by the including .less files)
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
// @fancy-hide-connectors: true; // false: show vertical connector lines
|
||||
|
||||
@fancy-level-indent: 16px;
|
||||
@fancy-line-height: 16px; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-line-ofs-top: (@fancy-line-height - @fancy-icon-height) / 2;
|
||||
|
||||
// webpack uses /dist/skin-common.less as root path
|
||||
// grunt-less uses /dist/skin-Xxx/ui.fancyree.less as root path
|
||||
// So we define our theme LESS files for webpack compatibility, i.e.
|
||||
// define the image path n every main LESS file instead of here.
|
||||
// Prefix may be set to "", "/", "./", or any other value
|
||||
// Note: this variable must be defined by the main LESS files:
|
||||
// @fancy-image-prefix: "";
|
||||
|
||||
// Use 'url(...)' to link to the throbber image, or
|
||||
// use data-uri(...)' to inline the data in css instead:
|
||||
/* CHANGE use url, as less does not handel data-uri() correct. DokuWiki can eventually inline it */
|
||||
@fancy-loading-url: url("@{fancy-image-prefix}loading.gif");
|
||||
//@fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false; // data-uri() is not handle correct by phpless
|
||||
|
||||
@fancy-font-size: 10pt;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: black;
|
||||
@fancy-font-color-dimm: #c0c0c0;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
// Mixins
|
||||
//------------------------------------------------------------------------------
|
||||
.setBgPos(@x, @y, @cond:true) when (@cond) {
|
||||
background-position: (@x * -@fancy-icon-width) (@y * -@fancy-icon-height);
|
||||
}
|
||||
.clearBgImage(@cond:true) when (@cond) {
|
||||
background-image: none;
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and not (@fancy-inline-sprites) {
|
||||
background-image: url("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and (@fancy-inline-sprites) {
|
||||
background-image: data-uri("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.useSprite(@x, @y) when (@fancy-use-sprites) {
|
||||
.setBgPos(@x, @y);
|
||||
}
|
||||
.rounded-corners(@radius) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
-ms-border-radius: @radius;
|
||||
-o-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor) {
|
||||
border-color: @bordercolor;
|
||||
background: @bgcolor;
|
||||
color: @color;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor, @startColor, @stopColor) {
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor);
|
||||
// @c-start: argb(@startColor);
|
||||
// @c-end: argb(@stopColor);
|
||||
background: -moz-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // FF3.6+
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, @startColor),
|
||||
color-stop(100%, @stopColor)
|
||||
); // Chrome,Safari4+
|
||||
background: -webkit-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Chrome10+,Safari5.1+
|
||||
background: -o-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Opera 11.10+
|
||||
background: -ms-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // IE10+
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // W3C
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{stopColor}',GradientType=0 ); // IE6-9
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
// Redefine, in case jQuery-UI is not included
|
||||
// .ui-helper-hidden,
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
// tri-state checkbox
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: @fancy-font-color-dimm;
|
||||
}
|
||||
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
/* CHANGE: renamed spin to spin-fancytree */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin-fancytree 1000ms infinite linear;
|
||||
animation: spin-fancytree 1000ms infinite linear;
|
||||
}
|
||||
/* CHANGE: commented because it is wrong prefixed by phpless
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
*/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
ul.fancytree-container {
|
||||
font-family: @fancy-font-family;
|
||||
font-size: @fancy-font-size;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0; // DT issue 201
|
||||
//background-color: white; CHANGE
|
||||
//border: 1px dotted gray; CHANGE
|
||||
// overflow: auto; // ext-dnd5: otherwise this is always the scroll parent
|
||||
// height: 100%; // DT issue 263, 470
|
||||
min-height: 0%; // #192
|
||||
position: relative; // #235
|
||||
ul {
|
||||
padding: 0 0 0 @fancy-level-indent;
|
||||
margin: 0;
|
||||
}
|
||||
ul > li:before {
|
||||
// #538
|
||||
content: none;
|
||||
}
|
||||
li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
.setBgPos(0, 0);
|
||||
background-repeat: repeat-y;
|
||||
background-image: none; // no v-lines
|
||||
|
||||
margin: 0;
|
||||
// padding: 1px 0 0 0; // issue #246
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Style, when control is disabled
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
// filter: alpha(opacity=50); // Yields a css warning
|
||||
background-color: silver;
|
||||
}
|
||||
|
||||
ul.fancytree-connectors.fancytree-container {
|
||||
li {
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
/* CHANGE: phpless does not handle data-uri() correct */
|
||||
//background-image: data-uri("@{fancy-image-prefix}vline.gif");
|
||||
background-image: url("@{fancy-image-prefix}vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Suppress lines for last child node
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
// Fix jQuery UI 'blind' animation for jQuery UI (#717)
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
// display: -moz-inline-box; // @ FF 1+2 removed for issue 221
|
||||
// -moz-box-align: start; /* issue 221 */
|
||||
display: inline-block; // Required to make a span sizeable
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
// background-position: left;
|
||||
.setBgImageUrl("icons.gif");
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
display: inline-block;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-expander {
|
||||
// .useSprite(0, 5);
|
||||
cursor: pointer;
|
||||
}
|
||||
// span.fancytree-expander:hover {
|
||||
// // .useSprite(1, 5);
|
||||
// }
|
||||
|
||||
// --- End nodes (use connectors instead of expanders)
|
||||
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
// .clearBgImage( @fancy-hide-connectors );
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors {
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander, // End-node, not last sibling
|
||||
.fancytree-exp-n span.fancytree-expander:hover {
|
||||
.useSprite(0, 4);
|
||||
}
|
||||
.fancytree-exp-nl span.fancytree-expander, // End-node, last sibling
|
||||
.fancytree-exp-nl span.fancytree-expander:hover {
|
||||
.useSprite(1, 4);
|
||||
}
|
||||
}
|
||||
|
||||
// --- Collapsed
|
||||
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
// Collapsed, not delayed, not last sibling
|
||||
.useSprite(0, 5);
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
.useSprite(1, 5);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
// Collapsed, not delayed, last sibling
|
||||
.useSprite(0, 6);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
.useSprite(1, 6);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
// Collapsed, delayed, not last sibling
|
||||
.useSprite(4, 5);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
.useSprite(5, 5);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
// Collapsed, delayed, last sibling
|
||||
.useSprite(4, 6);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
.useSprite(5, 6);
|
||||
}
|
||||
|
||||
// --- Expanded
|
||||
|
||||
.fancytree-exp-e span.fancytree-expander, // Expanded, not delayed, not last sibling
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
// Expanded, delayed, not last sibling
|
||||
.useSprite(2, 5);
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
.useSprite(3, 5);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander, // Expanded, not delayed, last sibling
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
// Expanded, delayed, last sibling
|
||||
.useSprite(2, 6);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
.useSprite(3, 6);
|
||||
}
|
||||
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander {
|
||||
span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover span.fancytree-expander,
|
||||
&.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-treefocus span.fancytree-expander,
|
||||
[class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Checkbox icon
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//span.fancytree-checkbox {
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
// .useSprite(0, 2);
|
||||
// &:hover {
|
||||
// .useSprite(1, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(1, 3);
|
||||
// }
|
||||
//}
|
||||
//.fancytree-partsel span.fancytree-checkbox {
|
||||
// .useSprite(4, 2);
|
||||
// &:hover {
|
||||
// .useSprite(5, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(4, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(5, 3);
|
||||
// }
|
||||
//}
|
||||
//// selected after partsel, so it takes precedence:
|
||||
//.fancytree-selected span.fancytree-checkbox {
|
||||
// .useSprite(2, 2);
|
||||
// &:hover {
|
||||
// .useSprite(3, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(3, 3);
|
||||
// }
|
||||
//}
|
||||
//// Unselectable is dimmed, without hover effects
|
||||
//.fancytree-unselectable {
|
||||
// span.fancytree-checkbox {
|
||||
// opacity: 0.4;
|
||||
// filter: alpha(opacity=40);
|
||||
// }
|
||||
// span.fancytree-checkbox:hover {
|
||||
// .useSprite(0, 2);
|
||||
// }
|
||||
// span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
// .useSprite(4, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox:hover {
|
||||
// .useSprite(2, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//// Auto-hide checkboxes unless selected or hovered
|
||||
//.fancytree-container.fancytree-checkbox-auto-hide {
|
||||
// span.fancytree-checkbox {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .fancytree-node:hover span.fancytree-checkbox,
|
||||
// tr:hover td span.fancytree-checkbox,
|
||||
// .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
// tr.fancytree-selected td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// &.fancytree-treefocus {
|
||||
// .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
// tr.fancytree-active td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-icon {
|
||||
// Default icon
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
// .useSprite(0, 0);
|
||||
}
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(1, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(3, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
.useSprite(5, 0);
|
||||
}
|
||||
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
.useSprite(0, 1);
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(1, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(3, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
.useSprite(5, 1);
|
||||
}
|
||||
|
||||
// 'Loading' status overrides all others
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: @fancy-loading-url;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Status node icons */
|
||||
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
.useSprite(0, 7);
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit; // #117, resolves to 'display: list-item;' for standard trees
|
||||
width: 100%;
|
||||
margin-top: @fancy-node-v-spacing;
|
||||
min-height: @fancy-line-height;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: @fancy-font-color; // inherit doesn't work on IE
|
||||
cursor: pointer;
|
||||
display: inline-block; // Better alignment, when title contains <br>
|
||||
vertical-align: top;
|
||||
min-height: @fancy-line-height;
|
||||
padding: 0 3px 0 3px; // Otherwise italic font will be outside right bounds
|
||||
margin: @fancy-title-ofs-top 0 0 @fancy-icon-spacing;
|
||||
// margin: 0px;
|
||||
// margin-top: @fancy-line-ofs-top;
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
.rounded-corners(@fancy-node-border-radius);
|
||||
// outline: 0; // @ Firefox, prevent dotted border after click
|
||||
// Set transparent border to prevent jumping when active node gets a border
|
||||
// (we can do this, because this theme doesn't use vertical lines)
|
||||
// border: 1px solid white; // Note: 'transparent' would not work in IE6
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Drag'n'drop support
|
||||
// *----------------------------------------------------------------------------*/
|
||||
///* ext-dnd5: */
|
||||
//span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
//}
|
||||
//
|
||||
///* ext-dnd: */
|
||||
//div.fancytree-drag-helper {
|
||||
// span.fancytree-childcounter,
|
||||
// span.fancytree-dnd-modifier {
|
||||
// display: inline-block;
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// min-width: 10px;
|
||||
// // min-height: 16px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// position: absolute;
|
||||
// // left: 16px;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// }
|
||||
// span.fancytree-dnd-modifier {
|
||||
// background: #5cb85c; // bootstrap green
|
||||
// border: none;
|
||||
// // min-height: 16px;
|
||||
// // font-size: 12px;
|
||||
// font-weight: bolder;
|
||||
// }
|
||||
// &.fancytree-drop-accept {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(2, 7);
|
||||
// }
|
||||
// }
|
||||
// &.fancytree-drop-reject {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(1, 7);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Drop marker icon *********************************************************/
|
||||
//#fancytree-drop-marker {
|
||||
// width: 2 * @fancy-icon-width; // was 24px, but 32 should be correct
|
||||
// position: absolute;
|
||||
// .useSprite(0, 8);
|
||||
// margin: 0;
|
||||
// &.fancytree-drop-after,
|
||||
// &.fancytree-drop-before {
|
||||
// width: 4 * @fancy-icon-width; // 64px;
|
||||
// .useSprite(0, 9);
|
||||
// }
|
||||
// &.fancytree-drop-copy {
|
||||
// .useSprite(4, 8);
|
||||
// }
|
||||
// &.fancytree-drop-move {
|
||||
// .useSprite(2, 8);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Source node while dragging ***********************************************/
|
||||
//
|
||||
//span.fancytree-drag-source {
|
||||
// &.fancytree-drag-remove {
|
||||
// // text-decoration: line-through;
|
||||
// opacity: 0.15;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Target node while dragging cursor is over it *****************************/
|
||||
//
|
||||
//span.fancytree-drop-target {
|
||||
// &.fancytree-drop-accept {
|
||||
// // outline: 1px dotted #5cb85c; // bootstrap sucess
|
||||
// }
|
||||
//}
|
||||
//span.fancytree-drop-reject {
|
||||
// // outline: 1px dotted #d9534f; // boostrap warning
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
.fancytree-container.fancytree-rtl {
|
||||
.fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/ /* optional: reverse title letters */
|
||||
}
|
||||
span.fancytree-connector,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-drag-helper-img {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
&.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
&.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl {
|
||||
ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
&.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("@{fancy-image-prefix}vline-rtl.gif");
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
&.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'table' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-table {
|
||||
// font-family: @fancy-font-family;
|
||||
// font-size: @fancy-font-size;
|
||||
// border-collapse: collapse;
|
||||
// span.fancytree-node {
|
||||
// display: inline-block; // #117
|
||||
// box-sizing: border-box; // #562
|
||||
// }
|
||||
// td.fancytree-status-merged {
|
||||
// text-align: center;
|
||||
// // font-weight: bold;
|
||||
// font-style: italic;
|
||||
// // line-height: 100px;
|
||||
// color: @fancy-font-color-dimm;
|
||||
// }
|
||||
// tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
// color: @fancy-font-error-color;
|
||||
// }
|
||||
// /* ext-ariagrid */
|
||||
// &.fancytree-ext-ariagrid.fancytree-cell-mode {
|
||||
// > tbody > tr.fancytree-active > td {
|
||||
// background-color: #eee;
|
||||
// }
|
||||
// > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #cbe8f6;
|
||||
// }
|
||||
// &.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #3875d7;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'columnview' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-columnview {
|
||||
// // border-collapse: collapse;
|
||||
// // width: 100%;
|
||||
// tbody tr td {
|
||||
// position: relative;
|
||||
// border: 1px solid gray;
|
||||
// vertical-align: top;
|
||||
// overflow: auto;
|
||||
// > ul {
|
||||
// padding: 0;
|
||||
// li {
|
||||
// list-style-image: none;
|
||||
// list-style-position: outside;
|
||||
// list-style-type: none;
|
||||
// -moz-background-clip: border;
|
||||
// -moz-background-inline-policy: continuous;
|
||||
// -moz-background-origin: padding;
|
||||
// background-attachment: scroll;
|
||||
// background-color: transparent;
|
||||
// .setBgPos(0, 0);
|
||||
// background-repeat: repeat-y;
|
||||
// background-image: none; /* no v-lines */
|
||||
//
|
||||
// margin: 0;
|
||||
// // padding: 1px 0 0 0; // issue #246
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// span.fancytree-node {
|
||||
// position: relative; /* allow positioning of embedded spans */
|
||||
// display: inline-block; // #117
|
||||
// }
|
||||
// span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #e0e0e0;
|
||||
// }
|
||||
// span.fancytree-node.fancytree-active {
|
||||
// background-color: #cbe8f6;
|
||||
// // background-color: royalblue;
|
||||
// }
|
||||
// .fancytree-has-children span.fancytree-cv-right {
|
||||
// position: absolute;
|
||||
// right: 3px;
|
||||
// .useSprite(0, 5);
|
||||
// &:hover {
|
||||
// .useSprite(1, 5);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'filter' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-filter-dimm {
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: bold;
|
||||
// }
|
||||
//}
|
||||
//.fancytree-ext-filter-hide {
|
||||
// tr.fancytree-hide,
|
||||
// span.fancytree-node.fancytree-hide {
|
||||
// display: none;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
//}
|
||||
///* Hide expanders if all child nodes are hidden by filter */
|
||||
//.fancytree-ext-filter-hide-expanders {
|
||||
// tr.fancytree-match span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
// visibility: visible;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//.fancytree-ext-childcounter,
|
||||
//.fancytree-ext-filter {
|
||||
// // span.fancytree-title mark {
|
||||
// // font-style: normal;
|
||||
// // background-color: #ead61c; // yellow
|
||||
// // border-radius: 3px;
|
||||
// // }
|
||||
// span.fancytree-icon,
|
||||
// span.fancytree-custom-icon {
|
||||
// position: relative;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #777; // #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// position: absolute;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// min-width: 10px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
//}
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'wide' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//ul.fancytree-ext-wide {
|
||||
// position: relative;
|
||||
// min-width: 100%;
|
||||
// z-index: 2;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
//
|
||||
// span.fancytree-node > span {
|
||||
// position: relative;
|
||||
// z-index: 2;
|
||||
// }
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// position: absolute; // Allow left: 0. Note: prevents smooth dropdown animation
|
||||
// z-index: 1; // Behind expander and checkbox
|
||||
// left: 0px;
|
||||
// min-width: 100%;
|
||||
// margin-left: 0;
|
||||
// margin-right: 0;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'fixed' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-fixed-wrapper {
|
||||
// .fancytree-ext-fixed-hidden {
|
||||
// display: none;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
// border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-right {
|
||||
// border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 3;
|
||||
// top: 0px;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tr {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// top: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-bl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-br {
|
||||
// position: absolute;
|
||||
// overflow: scroll;
|
||||
// z-index: 1;
|
||||
// }
|
||||
//}
|
||||
|
|
@ -0,0 +1,138 @@
|
|||
/*!
|
||||
* Fancytree "awesome" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
|
||||
// Import common styles
|
||||
@import "skin-common.less";
|
||||
|
||||
// We need to define this variable here (not in skin-common.less) to make it
|
||||
// work with grunt and webpack:
|
||||
@fancy-image-prefix: "./skin-typicons/";
|
||||
|
||||
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
|
||||
@fancy-use-sprites: false; // false: suppress all background images (i.e. icons)
|
||||
@fancy-loading-url: none;
|
||||
|
||||
@fancy-cst-size: 18px;
|
||||
|
||||
@fancy-level-indent: @fancy-cst-size; //@fancy-cst-size;
|
||||
@fancy-line-height: @fancy-cst-size; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: @fancy-cst-size;
|
||||
@fancy-icon-height: @fancy-cst-size;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: -6px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false;
|
||||
|
||||
//default 10pt, which is used in a relative manner resulting in 13.3 in dokuwiki-template.
|
||||
@fancy-font-size: 93%; //@fancy-cst-size;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: #000;
|
||||
@fancy-font-color-dimm: silver;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
// set icon color to font color as well
|
||||
span.fancytree-node {
|
||||
color: @fancy-font-color;
|
||||
}
|
||||
|
||||
ul.fancytree-container ul
|
||||
{
|
||||
padding: 0 0 0 1em; // 0.3em 0 0 1em;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
// The standard CSS assumes span.icon, but Fontawesome may use SVG or SPAN
|
||||
.fancytree-expander,
|
||||
.fancytree-checkbox,
|
||||
.fancytree-icon {
|
||||
min-width: @fancy-icon-width;
|
||||
text-align: center;
|
||||
font-size: (@fancy-cst-size +2px);
|
||||
}
|
||||
svg.fancytree-checkbox, // span... is already defined in skin-common-less
|
||||
svg.fancytree-icon {
|
||||
padding-left: @fancy-icon-spacing;
|
||||
}
|
||||
span.fancytree-expander {
|
||||
font-size: (@fancy-cst-size *4/5);
|
||||
margin-top: -1px;
|
||||
}
|
||||
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
span.fancytree-title {
|
||||
border: 1px solid transparent; // reserve some space for status borders
|
||||
border-radius: 0;
|
||||
}
|
||||
span.fancytree-focused span.fancytree-title {
|
||||
outline: 1px dotted black;
|
||||
}
|
||||
// span.fancytree-selected span.fancytree-title,
|
||||
span.fancytree-active span.fancytree-title {
|
||||
background-color: #D4D4D4; // gray
|
||||
}
|
||||
// span.fancytree-selected span.fancytree-title {
|
||||
// font-style: italic;
|
||||
// }
|
||||
// .fancytree-treefocus span.fancytree-selected span.fancytree-title,
|
||||
.fancytree-treefocus span.fancytree-active span.fancytree-title {
|
||||
color: white;
|
||||
background-color: #3875D7; // blue
|
||||
}
|
||||
|
||||
// .fancytree-treefocus span.fancytree-selected span.fancytree-title{
|
||||
// color: white;
|
||||
// background-color: #99DEFD; // blue
|
||||
// }
|
||||
|
||||
///*******************************************************************************
|
||||
// * 'table' extension
|
||||
// */
|
||||
//table.fancytree-ext-table {
|
||||
// border-collapse: collapse;
|
||||
// tbody {
|
||||
// tr.fancytree-focused {
|
||||
// background-color: #99DEFD;
|
||||
// }
|
||||
// tr.fancytree-active {
|
||||
// background-color: royalblue;
|
||||
// }
|
||||
// // tr.fancytree-selected {
|
||||
// // background-color: #99DEFD;
|
||||
// // }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*******************************************************************************
|
||||
// * 'columnview' extension
|
||||
// */
|
||||
//
|
||||
//table.fancytree-ext-columnview tbody tr td {
|
||||
// border: 1px solid gray;
|
||||
//}
|
||||
//table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #ccc;
|
||||
//}
|
||||
//table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
// background-color: royalblue;
|
||||
//}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 842 B |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-typicons/vline.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-typicons/vline.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 844 B |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-vista/icons-rtl.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-vista/icons-rtl.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-vista/icons.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-vista/icons.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-vista/loading.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-vista/loading.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
|
|
@ -0,0 +1,972 @@
|
|||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
|
||||
// Variables (defaults, may be overwritten by the including .less files)
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
// @fancy-hide-connectors: true; // false: show vertical connector lines
|
||||
|
||||
@fancy-level-indent: 16px;
|
||||
@fancy-line-height: 16px; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-line-ofs-top: (@fancy-line-height - @fancy-icon-height) / 2;
|
||||
|
||||
// webpack uses /dist/skin-common.less as root path
|
||||
// grunt-less uses /dist/skin-Xxx/ui.fancyree.less as root path
|
||||
// So we define our theme LESS files for webpack compatibility, i.e.
|
||||
// define the image path n every main LESS file instead of here.
|
||||
// Prefix may be set to "", "/", "./", or any other value
|
||||
// Note: this variable must be defined by the main LESS files:
|
||||
// @fancy-image-prefix: "";
|
||||
|
||||
// Use 'url(...)' to link to the throbber image, or
|
||||
// use data-uri(...)' to inline the data in css instead:
|
||||
/* CHANGE use url, as less does not handel data-uri() correct. DokuWiki can eventually inline it */
|
||||
@fancy-loading-url: url("@{fancy-image-prefix}loading.gif");
|
||||
//@fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false; // data-uri() is not handle correct by phpless
|
||||
|
||||
@fancy-font-size: 10pt;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: black;
|
||||
@fancy-font-color-dimm: #c0c0c0;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
// Mixins
|
||||
//------------------------------------------------------------------------------
|
||||
.setBgPos(@x, @y, @cond:true) when (@cond) {
|
||||
background-position: (@x * -@fancy-icon-width) (@y * -@fancy-icon-height);
|
||||
}
|
||||
.clearBgImage(@cond:true) when (@cond) {
|
||||
background-image: none;
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and not (@fancy-inline-sprites) {
|
||||
background-image: url("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and (@fancy-inline-sprites) {
|
||||
background-image: data-uri("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.useSprite(@x, @y) when (@fancy-use-sprites) {
|
||||
.setBgPos(@x, @y);
|
||||
}
|
||||
.rounded-corners(@radius) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
-ms-border-radius: @radius;
|
||||
-o-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor) {
|
||||
border-color: @bordercolor;
|
||||
background: @bgcolor;
|
||||
color: @color;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor, @startColor, @stopColor) {
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor);
|
||||
// @c-start: argb(@startColor);
|
||||
// @c-end: argb(@stopColor);
|
||||
background: -moz-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // FF3.6+
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, @startColor),
|
||||
color-stop(100%, @stopColor)
|
||||
); // Chrome,Safari4+
|
||||
background: -webkit-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Chrome10+,Safari5.1+
|
||||
background: -o-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Opera 11.10+
|
||||
background: -ms-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // IE10+
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // W3C
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{stopColor}',GradientType=0 ); // IE6-9
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
// Redefine, in case jQuery-UI is not included
|
||||
// .ui-helper-hidden,
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
// tri-state checkbox
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: @fancy-font-color-dimm;
|
||||
}
|
||||
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
/* CHANGE: renamed spin to spin-fancytree */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin-fancytree 1000ms infinite linear;
|
||||
animation: spin-fancytree 1000ms infinite linear;
|
||||
}
|
||||
/* CHANGE: commented because it is wrong prefixed by phpless
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
*/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
ul.fancytree-container {
|
||||
font-family: @fancy-font-family;
|
||||
font-size: @fancy-font-size;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0; // DT issue 201
|
||||
//background-color: white; CHANGE
|
||||
//border: 1px dotted gray; CHANGE
|
||||
// overflow: auto; // ext-dnd5: otherwise this is always the scroll parent
|
||||
// height: 100%; // DT issue 263, 470
|
||||
min-height: 0%; // #192
|
||||
position: relative; // #235
|
||||
ul {
|
||||
padding: 0 0 0 @fancy-level-indent;
|
||||
margin: 0;
|
||||
}
|
||||
ul > li:before {
|
||||
// #538
|
||||
content: none;
|
||||
}
|
||||
li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
.setBgPos(0, 0);
|
||||
background-repeat: repeat-y;
|
||||
background-image: none; // no v-lines
|
||||
|
||||
margin: 0;
|
||||
// padding: 1px 0 0 0; // issue #246
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Style, when control is disabled
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
// filter: alpha(opacity=50); // Yields a css warning
|
||||
background-color: silver;
|
||||
}
|
||||
|
||||
ul.fancytree-connectors.fancytree-container {
|
||||
li {
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
/* CHANGE: phpless does not handle data-uri() correct */
|
||||
//background-image: data-uri("@{fancy-image-prefix}vline.gif");
|
||||
background-image: url("@{fancy-image-prefix}vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Suppress lines for last child node
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
// Fix jQuery UI 'blind' animation for jQuery UI (#717)
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
// display: -moz-inline-box; // @ FF 1+2 removed for issue 221
|
||||
// -moz-box-align: start; /* issue 221 */
|
||||
display: inline-block; // Required to make a span sizeable
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
// background-position: left;
|
||||
.setBgImageUrl("icons.gif");
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
display: inline-block;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-expander {
|
||||
// .useSprite(0, 5);
|
||||
cursor: pointer;
|
||||
}
|
||||
// span.fancytree-expander:hover {
|
||||
// // .useSprite(1, 5);
|
||||
// }
|
||||
|
||||
// --- End nodes (use connectors instead of expanders)
|
||||
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
// .clearBgImage( @fancy-hide-connectors );
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors {
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander, // End-node, not last sibling
|
||||
.fancytree-exp-n span.fancytree-expander:hover {
|
||||
.useSprite(0, 4);
|
||||
}
|
||||
.fancytree-exp-nl span.fancytree-expander, // End-node, last sibling
|
||||
.fancytree-exp-nl span.fancytree-expander:hover {
|
||||
.useSprite(1, 4);
|
||||
}
|
||||
}
|
||||
|
||||
// --- Collapsed
|
||||
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
// Collapsed, not delayed, not last sibling
|
||||
.useSprite(0, 5);
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
.useSprite(1, 5);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
// Collapsed, not delayed, last sibling
|
||||
.useSprite(0, 6);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
.useSprite(1, 6);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
// Collapsed, delayed, not last sibling
|
||||
.useSprite(4, 5);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
.useSprite(5, 5);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
// Collapsed, delayed, last sibling
|
||||
.useSprite(4, 6);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
.useSprite(5, 6);
|
||||
}
|
||||
|
||||
// --- Expanded
|
||||
|
||||
.fancytree-exp-e span.fancytree-expander, // Expanded, not delayed, not last sibling
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
// Expanded, delayed, not last sibling
|
||||
.useSprite(2, 5);
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
.useSprite(3, 5);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander, // Expanded, not delayed, last sibling
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
// Expanded, delayed, last sibling
|
||||
.useSprite(2, 6);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
.useSprite(3, 6);
|
||||
}
|
||||
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander {
|
||||
span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover span.fancytree-expander,
|
||||
&.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-treefocus span.fancytree-expander,
|
||||
[class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Checkbox icon
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//span.fancytree-checkbox {
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
// .useSprite(0, 2);
|
||||
// &:hover {
|
||||
// .useSprite(1, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(1, 3);
|
||||
// }
|
||||
//}
|
||||
//.fancytree-partsel span.fancytree-checkbox {
|
||||
// .useSprite(4, 2);
|
||||
// &:hover {
|
||||
// .useSprite(5, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(4, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(5, 3);
|
||||
// }
|
||||
//}
|
||||
//// selected after partsel, so it takes precedence:
|
||||
//.fancytree-selected span.fancytree-checkbox {
|
||||
// .useSprite(2, 2);
|
||||
// &:hover {
|
||||
// .useSprite(3, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(3, 3);
|
||||
// }
|
||||
//}
|
||||
//// Unselectable is dimmed, without hover effects
|
||||
//.fancytree-unselectable {
|
||||
// span.fancytree-checkbox {
|
||||
// opacity: 0.4;
|
||||
// filter: alpha(opacity=40);
|
||||
// }
|
||||
// span.fancytree-checkbox:hover {
|
||||
// .useSprite(0, 2);
|
||||
// }
|
||||
// span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
// .useSprite(4, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox:hover {
|
||||
// .useSprite(2, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//// Auto-hide checkboxes unless selected or hovered
|
||||
//.fancytree-container.fancytree-checkbox-auto-hide {
|
||||
// span.fancytree-checkbox {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .fancytree-node:hover span.fancytree-checkbox,
|
||||
// tr:hover td span.fancytree-checkbox,
|
||||
// .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
// tr.fancytree-selected td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// &.fancytree-treefocus {
|
||||
// .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
// tr.fancytree-active td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-icon {
|
||||
// Default icon
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
// .useSprite(0, 0);
|
||||
}
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(1, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(3, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
.useSprite(5, 0);
|
||||
}
|
||||
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
.useSprite(0, 1);
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(1, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(3, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
.useSprite(5, 1);
|
||||
}
|
||||
|
||||
// 'Loading' status overrides all others
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: @fancy-loading-url;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Status node icons */
|
||||
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
.useSprite(0, 7);
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit; // #117, resolves to 'display: list-item;' for standard trees
|
||||
width: 100%;
|
||||
margin-top: @fancy-node-v-spacing;
|
||||
min-height: @fancy-line-height;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: @fancy-font-color; // inherit doesn't work on IE
|
||||
cursor: pointer;
|
||||
display: inline-block; // Better alignment, when title contains <br>
|
||||
vertical-align: top;
|
||||
min-height: @fancy-line-height;
|
||||
padding: 0 3px 0 3px; // Otherwise italic font will be outside right bounds
|
||||
margin: @fancy-title-ofs-top 0 0 @fancy-icon-spacing;
|
||||
// margin: 0px;
|
||||
// margin-top: @fancy-line-ofs-top;
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
.rounded-corners(@fancy-node-border-radius);
|
||||
// outline: 0; // @ Firefox, prevent dotted border after click
|
||||
// Set transparent border to prevent jumping when active node gets a border
|
||||
// (we can do this, because this theme doesn't use vertical lines)
|
||||
// border: 1px solid white; // Note: 'transparent' would not work in IE6
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Drag'n'drop support
|
||||
// *----------------------------------------------------------------------------*/
|
||||
///* ext-dnd5: */
|
||||
//span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
//}
|
||||
//
|
||||
///* ext-dnd: */
|
||||
//div.fancytree-drag-helper {
|
||||
// span.fancytree-childcounter,
|
||||
// span.fancytree-dnd-modifier {
|
||||
// display: inline-block;
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// min-width: 10px;
|
||||
// // min-height: 16px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// position: absolute;
|
||||
// // left: 16px;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// }
|
||||
// span.fancytree-dnd-modifier {
|
||||
// background: #5cb85c; // bootstrap green
|
||||
// border: none;
|
||||
// // min-height: 16px;
|
||||
// // font-size: 12px;
|
||||
// font-weight: bolder;
|
||||
// }
|
||||
// &.fancytree-drop-accept {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(2, 7);
|
||||
// }
|
||||
// }
|
||||
// &.fancytree-drop-reject {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(1, 7);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Drop marker icon *********************************************************/
|
||||
//#fancytree-drop-marker {
|
||||
// width: 2 * @fancy-icon-width; // was 24px, but 32 should be correct
|
||||
// position: absolute;
|
||||
// .useSprite(0, 8);
|
||||
// margin: 0;
|
||||
// &.fancytree-drop-after,
|
||||
// &.fancytree-drop-before {
|
||||
// width: 4 * @fancy-icon-width; // 64px;
|
||||
// .useSprite(0, 9);
|
||||
// }
|
||||
// &.fancytree-drop-copy {
|
||||
// .useSprite(4, 8);
|
||||
// }
|
||||
// &.fancytree-drop-move {
|
||||
// .useSprite(2, 8);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Source node while dragging ***********************************************/
|
||||
//
|
||||
//span.fancytree-drag-source {
|
||||
// &.fancytree-drag-remove {
|
||||
// // text-decoration: line-through;
|
||||
// opacity: 0.15;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Target node while dragging cursor is over it *****************************/
|
||||
//
|
||||
//span.fancytree-drop-target {
|
||||
// &.fancytree-drop-accept {
|
||||
// // outline: 1px dotted #5cb85c; // bootstrap sucess
|
||||
// }
|
||||
//}
|
||||
//span.fancytree-drop-reject {
|
||||
// // outline: 1px dotted #d9534f; // boostrap warning
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
.fancytree-container.fancytree-rtl {
|
||||
.fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/ /* optional: reverse title letters */
|
||||
}
|
||||
span.fancytree-connector,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-drag-helper-img {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
&.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
&.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl {
|
||||
ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
&.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("@{fancy-image-prefix}vline-rtl.gif");
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
&.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'table' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-table {
|
||||
// font-family: @fancy-font-family;
|
||||
// font-size: @fancy-font-size;
|
||||
// border-collapse: collapse;
|
||||
// span.fancytree-node {
|
||||
// display: inline-block; // #117
|
||||
// box-sizing: border-box; // #562
|
||||
// }
|
||||
// td.fancytree-status-merged {
|
||||
// text-align: center;
|
||||
// // font-weight: bold;
|
||||
// font-style: italic;
|
||||
// // line-height: 100px;
|
||||
// color: @fancy-font-color-dimm;
|
||||
// }
|
||||
// tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
// color: @fancy-font-error-color;
|
||||
// }
|
||||
// /* ext-ariagrid */
|
||||
// &.fancytree-ext-ariagrid.fancytree-cell-mode {
|
||||
// > tbody > tr.fancytree-active > td {
|
||||
// background-color: #eee;
|
||||
// }
|
||||
// > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #cbe8f6;
|
||||
// }
|
||||
// &.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #3875d7;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'columnview' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-columnview {
|
||||
// // border-collapse: collapse;
|
||||
// // width: 100%;
|
||||
// tbody tr td {
|
||||
// position: relative;
|
||||
// border: 1px solid gray;
|
||||
// vertical-align: top;
|
||||
// overflow: auto;
|
||||
// > ul {
|
||||
// padding: 0;
|
||||
// li {
|
||||
// list-style-image: none;
|
||||
// list-style-position: outside;
|
||||
// list-style-type: none;
|
||||
// -moz-background-clip: border;
|
||||
// -moz-background-inline-policy: continuous;
|
||||
// -moz-background-origin: padding;
|
||||
// background-attachment: scroll;
|
||||
// background-color: transparent;
|
||||
// .setBgPos(0, 0);
|
||||
// background-repeat: repeat-y;
|
||||
// background-image: none; /* no v-lines */
|
||||
//
|
||||
// margin: 0;
|
||||
// // padding: 1px 0 0 0; // issue #246
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// span.fancytree-node {
|
||||
// position: relative; /* allow positioning of embedded spans */
|
||||
// display: inline-block; // #117
|
||||
// }
|
||||
// span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #e0e0e0;
|
||||
// }
|
||||
// span.fancytree-node.fancytree-active {
|
||||
// background-color: #cbe8f6;
|
||||
// // background-color: royalblue;
|
||||
// }
|
||||
// .fancytree-has-children span.fancytree-cv-right {
|
||||
// position: absolute;
|
||||
// right: 3px;
|
||||
// .useSprite(0, 5);
|
||||
// &:hover {
|
||||
// .useSprite(1, 5);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'filter' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-filter-dimm {
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: bold;
|
||||
// }
|
||||
//}
|
||||
//.fancytree-ext-filter-hide {
|
||||
// tr.fancytree-hide,
|
||||
// span.fancytree-node.fancytree-hide {
|
||||
// display: none;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
//}
|
||||
///* Hide expanders if all child nodes are hidden by filter */
|
||||
//.fancytree-ext-filter-hide-expanders {
|
||||
// tr.fancytree-match span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
// visibility: visible;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//.fancytree-ext-childcounter,
|
||||
//.fancytree-ext-filter {
|
||||
// // span.fancytree-title mark {
|
||||
// // font-style: normal;
|
||||
// // background-color: #ead61c; // yellow
|
||||
// // border-radius: 3px;
|
||||
// // }
|
||||
// span.fancytree-icon,
|
||||
// span.fancytree-custom-icon {
|
||||
// position: relative;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #777; // #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// position: absolute;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// min-width: 10px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
//}
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'wide' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//ul.fancytree-ext-wide {
|
||||
// position: relative;
|
||||
// min-width: 100%;
|
||||
// z-index: 2;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
//
|
||||
// span.fancytree-node > span {
|
||||
// position: relative;
|
||||
// z-index: 2;
|
||||
// }
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// position: absolute; // Allow left: 0. Note: prevents smooth dropdown animation
|
||||
// z-index: 1; // Behind expander and checkbox
|
||||
// left: 0px;
|
||||
// min-width: 100%;
|
||||
// margin-left: 0;
|
||||
// margin-right: 0;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'fixed' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-fixed-wrapper {
|
||||
// .fancytree-ext-fixed-hidden {
|
||||
// display: none;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
// border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-right {
|
||||
// border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 3;
|
||||
// top: 0px;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tr {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// top: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-bl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-br {
|
||||
// position: absolute;
|
||||
// overflow: scroll;
|
||||
// z-index: 1;
|
||||
// }
|
||||
//}
|
||||
|
|
@ -0,0 +1,763 @@
|
|||
/*!
|
||||
* Fancytree "Vista" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
/*
|
||||
both:
|
||||
unselected background: #FCFCFC 'nearly white'
|
||||
hover bar (unselected, inactive): #F8FCFE..#EFF9FE (border: #D8F0FA) 'very light blue'
|
||||
active node: #F6FBFD..#D5EFFC (border: #99DEFD) 'light blue'
|
||||
active node with hover: #F2F9FD..#C4E8FA (border: #B6E6FB)
|
||||
|
||||
Tree view:
|
||||
active node, tree inactive: #FAFAFB..#E5E5E5 (border: #D9D9D9) 'light gray, selected, but tree not active'
|
||||
|
||||
List view:
|
||||
selected bar: --> active bar
|
||||
focus bar: active + border 1px dotted #090402 (inside the blue border)
|
||||
|
||||
table left/right border: #EDEDED 'light gray'
|
||||
*/
|
||||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: #c0c0c0;
|
||||
}
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin 1000ms infinite linear;
|
||||
animation: spin 1000ms infinite linear;
|
||||
}
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-container {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0;
|
||||
background-color: white;
|
||||
border: 1px dotted gray;
|
||||
min-height: 0%;
|
||||
position: relative;
|
||||
}
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 16px;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container ul > li:before {
|
||||
content: none;
|
||||
}
|
||||
ul.fancytree-container li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0px 0px;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
background-color: silver;
|
||||
}
|
||||
ul.fancytree-connectors.fancytree-container li {
|
||||
background-image: url("../skin-vista/vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url("../skin-vista/icons.gif");
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: 0px;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
margin-left: 3px;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-left: 3px;
|
||||
margin-top: 0px;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-expander {
|
||||
cursor: pointer;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: url("../skin-vista/icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander:hover {
|
||||
background-position: 0px -64px;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander:hover {
|
||||
background-position: -16px -64px;
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
background-position: 0px -80px;
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
background-position: -16px -80px;
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
background-position: 0px -96px;
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
background-position: -16px -96px;
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
background-position: -64px -80px;
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
background-position: -80px -80px;
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
background-position: -64px -96px;
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
background-position: -80px -96px;
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander,
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
background-position: -32px -80px;
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
background-position: -48px -80px;
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander,
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
background-position: -32px -96px;
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
background-position: -48px -96px;
|
||||
}
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
.fancytree-fade-expander:hover span.fancytree-expander,
|
||||
.fancytree-fade-expander.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander .fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander [class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Checkbox icon
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-checkbox {
|
||||
margin-left: 3px;
|
||||
background-position: 0px -32px;
|
||||
}
|
||||
span.fancytree-checkbox:hover {
|
||||
background-position: -16px -32px;
|
||||
}
|
||||
span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: 0px -48px;
|
||||
}
|
||||
span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -16px -48px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox {
|
||||
background-position: -64px -32px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
background-position: -80px -32px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: -64px -48px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -80px -48px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox {
|
||||
background-position: -32px -32px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox:hover {
|
||||
background-position: -48px -32px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: -32px -48px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -48px -48px;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox {
|
||||
opacity: 0.4;
|
||||
filter: alpha(opacity=40);
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox:hover {
|
||||
background-position: 0px -32px;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: 0px -48px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
background-position: -64px -32px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-selected span.fancytree-checkbox:hover {
|
||||
background-position: -32px -32px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -32px -48px;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide span.fancytree-checkbox {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node:hover span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr:hover td span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr.fancytree-selected td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus tr.fancytree-active td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-icon {
|
||||
margin-left: 3px;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
background-position: -16px 0px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
background-position: -32px 0px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
background-position: -48px 0px;
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
background-position: -64px 0px;
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
background-position: -80px 0px;
|
||||
}
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
background-position: 0px -16px;
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
background-position: -16px -16px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
background-position: -32px -16px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
background-position: -48px -16px;
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
background-position: -64px -16px;
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
background-position: -80px -16px;
|
||||
}
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: url("../skin-vista/loading.gif");
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Status node icons */
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
background-position: 0px -112px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit;
|
||||
width: 100%;
|
||||
margin-top: 1px;
|
||||
min-height: 16px;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: black;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
min-height: 16px;
|
||||
padding: 0 3px 0 3px;
|
||||
margin: 0px 0 0 3px;
|
||||
border: 1px solid transparent;
|
||||
-webkit-border-radius: 0px;
|
||||
-moz-border-radius: 0px;
|
||||
-ms-border-radius: 0px;
|
||||
-o-border-radius: 0px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: red;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Drag'n'drop support
|
||||
*----------------------------------------------------------------------------*/
|
||||
/* ext-dnd5: */
|
||||
span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
/* ext-dnd: */
|
||||
div.fancytree-drag-helper span.fancytree-childcounter,
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-childcounter {
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
background: #5cb85c;
|
||||
border: none;
|
||||
font-weight: bolder;
|
||||
}
|
||||
div.fancytree-drag-helper.fancytree-drop-accept span.fancytree-drag-helper-img {
|
||||
background-position: -32px -112px;
|
||||
}
|
||||
div.fancytree-drag-helper.fancytree-drop-reject span.fancytree-drag-helper-img {
|
||||
background-position: -16px -112px;
|
||||
}
|
||||
/*** Drop marker icon *********************************************************/
|
||||
#fancytree-drop-marker {
|
||||
width: 32px;
|
||||
position: absolute;
|
||||
background-position: 0px -128px;
|
||||
margin: 0;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-after,
|
||||
#fancytree-drop-marker.fancytree-drop-before {
|
||||
width: 64px;
|
||||
background-position: 0px -144px;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-copy {
|
||||
background-position: -64px -128px;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-move {
|
||||
background-position: -32px -128px;
|
||||
}
|
||||
/*** Source node while dragging ***********************************************/
|
||||
span.fancytree-drag-source.fancytree-drag-remove {
|
||||
opacity: 0.15;
|
||||
}
|
||||
/*** Target node while dragging cursor is over it *****************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-container.fancytree-rtl .fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/
|
||||
/* optional: reverse title letters */
|
||||
}
|
||||
.fancytree-container.fancytree-rtl span.fancytree-connector,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-icon,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-drag-helper-img {
|
||||
background-image: url("../skin-vista/icons-rtl.gif");
|
||||
}
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
.fancytree-container.fancytree-rtl.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: url("../skin-vista/icons-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("../skin-vista/vline-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl li.fancytree-lastsib,
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
background-image: url("../skin-vista/icons-rtl.gif");
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'table' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-table {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
border-collapse: collapse;
|
||||
/* ext-ariagrid */
|
||||
}
|
||||
table.fancytree-ext-table span.fancytree-node {
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
table.fancytree-ext-table td.fancytree-status-merged {
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
color: #c0c0c0;
|
||||
}
|
||||
table.fancytree-ext-table tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
color: red;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr.fancytree-active > td {
|
||||
background-color: #eee;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #3875d7;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'columnview' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-columnview tbody tr td {
|
||||
position: relative;
|
||||
border: 1px solid gray;
|
||||
vertical-align: top;
|
||||
overflow: auto;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul {
|
||||
padding: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0px 0px;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
/* no v-lines */
|
||||
margin: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node {
|
||||
position: relative;
|
||||
/* allow positioning of embedded spans */
|
||||
display: inline-block;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
background-position: 0px -80px;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right:hover {
|
||||
background-position: -16px -80px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'filter' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-filter-dimm span.fancytree-node span.fancytree-title {
|
||||
color: #c0c0c0;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-hide,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-hide {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: #c0c0c0;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* Hide expanders if all child nodes are hidden by filter */
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-match span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-submatch span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
visibility: visible;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-icon,
|
||||
.fancytree-ext-filter span.fancytree-icon,
|
||||
.fancytree-ext-childcounter span.fancytree-custom-icon,
|
||||
.fancytree-ext-filter span.fancytree-custom-icon {
|
||||
position: relative;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-childcounter,
|
||||
.fancytree-ext-filter span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #777;
|
||||
border: 1px solid gray;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'wide' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-ext-wide {
|
||||
position: relative;
|
||||
min-width: 100%;
|
||||
z-index: 2;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node > span {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node span.fancytree-title {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: 0px;
|
||||
min-width: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'fixed' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-fixed-wrapper .fancytree-ext-fixed-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-right {
|
||||
border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 3;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tr {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
top: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-bl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-br {
|
||||
position: absolute;
|
||||
overflow: scroll;
|
||||
z-index: 1;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
span.fancytree-title {
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
span.fancytree-title:hover {
|
||||
background-color: #F2F7FD;
|
||||
border-color: #B8D6FB;
|
||||
}
|
||||
span.fancytree-focused span.fancytree-title {
|
||||
background-color: #EFEBDE;
|
||||
outline: 1px dotted gray;
|
||||
}
|
||||
span.fancytree-selected span.fancytree-title {
|
||||
font-style: italic;
|
||||
}
|
||||
span.fancytree-active span.fancytree-title {
|
||||
border: 1px solid #99DEFD;
|
||||
background-color: #D8F0FA;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'table' extension
|
||||
*/
|
||||
table.fancytree-ext-table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-focused {
|
||||
background-color: #99DEFD;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-active {
|
||||
background-color: royalblue;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-selected {
|
||||
background-color: #99FDDE;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'columnview' extension
|
||||
*/
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #ccc;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: royalblue;
|
||||
}
|
||||
|
|
@ -0,0 +1,117 @@
|
|||
/*!
|
||||
* Fancytree "Vista" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
|
||||
/*
|
||||
both:
|
||||
unselected background: #FCFCFC 'nearly white'
|
||||
hover bar (unselected, inactive): #F8FCFE..#EFF9FE (border: #D8F0FA) 'very light blue'
|
||||
active node: #F6FBFD..#D5EFFC (border: #99DEFD) 'light blue'
|
||||
active node with hover: #F2F9FD..#C4E8FA (border: #B6E6FB)
|
||||
|
||||
Tree view:
|
||||
active node, tree inactive: #FAFAFB..#E5E5E5 (border: #D9D9D9) 'light gray, selected, but tree not active'
|
||||
|
||||
List view:
|
||||
selected bar: --> active bar
|
||||
focus bar: active + border 1px dotted #090402 (inside the blue border)
|
||||
|
||||
table left/right border: #EDEDED 'light gray'
|
||||
*/
|
||||
|
||||
// Import common styles
|
||||
@import "skin-common.less";
|
||||
|
||||
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
|
||||
|
||||
// Override the variable after the import.
|
||||
// NOTE: Variables are always resolved as the last definition, even if it is
|
||||
// after where it is used.
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-line-height: 16px;
|
||||
@fancy-icon-spacing: 3px;
|
||||
|
||||
// We need to define this variable here (not in skin-common.less) to make it
|
||||
// work with grunt and webpack:
|
||||
@fancy-image-prefix: "./skin-vista/";
|
||||
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
// @fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
// Set to `true` to use `data-uri(...)` which will embed icons.gif into CSS
|
||||
// instead of linking to that file:
|
||||
// @fancy-inline-sprites: true;
|
||||
|
||||
//default 10pt, which is used in a relative manner resulting in 13.3 in dokuwiki-template.
|
||||
@fancy-font-size: 93%;
|
||||
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
span.fancytree-title {
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
}
|
||||
span.fancytree-title:hover {
|
||||
background-color: #F2F7FD; // light blue
|
||||
border-color: #B8D6FB; // darker light blue
|
||||
}
|
||||
.fancytree-folder span.fancytree-title {
|
||||
// font-weight: bold;
|
||||
}
|
||||
span.fancytree-focused span.fancytree-title {
|
||||
background-color: #EFEBDE; // gray
|
||||
outline: 1px dotted gray;
|
||||
}
|
||||
span.fancytree-has-children span.fancytree-title {
|
||||
// font-style: oblique;
|
||||
}
|
||||
span.fancytree-expanded span.fancytree-title {
|
||||
}
|
||||
span.fancytree-selected span.fancytree-title {
|
||||
font-style: italic;
|
||||
}
|
||||
span.fancytree-active span.fancytree-title {
|
||||
border: 1px solid #99DEFD;
|
||||
background-color: #D8F0FA;
|
||||
}
|
||||
|
||||
/*******************************************************************************
|
||||
* 'table' extension
|
||||
*/
|
||||
|
||||
table.fancytree-ext-table {
|
||||
border-collapse: collapse;
|
||||
tbody tr.fancytree-focused {
|
||||
background-color: #99DEFD;
|
||||
}
|
||||
tbody tr.fancytree-active {
|
||||
background-color: royalblue;
|
||||
}
|
||||
tbody tr.fancytree-selected {
|
||||
background-color: #99FDDE;
|
||||
}
|
||||
}
|
||||
|
||||
/*******************************************************************************
|
||||
* 'columnview' extension
|
||||
*/
|
||||
|
||||
table.fancytree-ext-columnview {
|
||||
span.fancytree-node.fancytree-expanded {
|
||||
background-color: #ccc;
|
||||
}
|
||||
span.fancytree-node.fancytree-active {
|
||||
background-color: royalblue;
|
||||
}
|
||||
}
|
||||
6
plugins/55/indexmenu/scripts/fancytree/skin-vista/ui.fancytree.min.css
vendored
Normal file
6
plugins/55/indexmenu/scripts/fancytree/skin-vista/ui.fancytree.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
BIN
plugins/55/indexmenu/scripts/fancytree/skin-vista/vline-rtl.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-vista/vline-rtl.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 852 B |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-vista/vline.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-vista/vline.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 852 B |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-win7/icons-rtl.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-win7/icons-rtl.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-win7/icons.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-win7/icons.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
BIN
plugins/55/indexmenu/scripts/fancytree/skin-win7/loading.gif
Normal file
BIN
plugins/55/indexmenu/scripts/fancytree/skin-win7/loading.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
|
|
@ -0,0 +1,972 @@
|
|||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
|
||||
// Variables (defaults, may be overwritten by the including .less files)
|
||||
@fancy-use-sprites: true; // false: suppress all background images (i.e. icons)
|
||||
// @fancy-hide-connectors: true; // false: show vertical connector lines
|
||||
|
||||
@fancy-level-indent: 16px;
|
||||
@fancy-line-height: 16px; // height of a nodes selection bar including borders
|
||||
@fancy-node-v-spacing: 1px; // gap between two node borders
|
||||
@fancy-icon-width: 16px;
|
||||
@fancy-icon-height: 16px;
|
||||
@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title
|
||||
@fancy-icon-ofs-top: 0px; // extra vertical offset for expander, checkbox and icon
|
||||
@fancy-title-ofs-top: 0px; // extra vertical offset for title
|
||||
@fancy-node-border-width: 1px;
|
||||
@fancy-node-border-radius: 0px;
|
||||
@fancy-node-outline-width: 1px;
|
||||
|
||||
// @fancy-line-ofs-top: (@fancy-line-height - @fancy-icon-height) / 2;
|
||||
|
||||
// webpack uses /dist/skin-common.less as root path
|
||||
// grunt-less uses /dist/skin-Xxx/ui.fancyree.less as root path
|
||||
// So we define our theme LESS files for webpack compatibility, i.e.
|
||||
// define the image path n every main LESS file instead of here.
|
||||
// Prefix may be set to "", "/", "./", or any other value
|
||||
// Note: this variable must be defined by the main LESS files:
|
||||
// @fancy-image-prefix: "";
|
||||
|
||||
// Use 'url(...)' to link to the throbber image, or
|
||||
// use data-uri(...)' to inline the data in css instead:
|
||||
/* CHANGE use url, as less does not handel data-uri() correct. DokuWiki can eventually inline it */
|
||||
@fancy-loading-url: url("@{fancy-image-prefix}loading.gif");
|
||||
//@fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif");
|
||||
|
||||
// Set to `true` to use `data-uri(...)` instead of a `url(...)` link:
|
||||
@fancy-inline-sprites: false; // data-uri() is not handle correct by phpless
|
||||
|
||||
@fancy-font-size: 10pt;
|
||||
@fancy-font-family: tahoma, arial, helvetica;
|
||||
@fancy-font-color: black;
|
||||
@fancy-font-color-dimm: #c0c0c0;
|
||||
@fancy-font-error-color: red;
|
||||
|
||||
//------------------------------------------------------------------------------
|
||||
// Mixins
|
||||
//------------------------------------------------------------------------------
|
||||
.setBgPos(@x, @y, @cond:true) when (@cond) {
|
||||
background-position: (@x * -@fancy-icon-width) (@y * -@fancy-icon-height);
|
||||
}
|
||||
.clearBgImage(@cond:true) when (@cond) {
|
||||
background-image: none;
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and not (@fancy-inline-sprites) {
|
||||
background-image: url("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.setBgImageUrl(@url) when (@fancy-use-sprites) and (@fancy-inline-sprites) {
|
||||
background-image: data-uri("@{fancy-image-prefix}@{url}");
|
||||
}
|
||||
.useSprite(@x, @y) when (@fancy-use-sprites) {
|
||||
.setBgPos(@x, @y);
|
||||
}
|
||||
.rounded-corners(@radius) {
|
||||
-webkit-border-radius: @radius;
|
||||
-moz-border-radius: @radius;
|
||||
-ms-border-radius: @radius;
|
||||
-o-border-radius: @radius;
|
||||
border-radius: @radius;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor) {
|
||||
border-color: @bordercolor;
|
||||
background: @bgcolor;
|
||||
color: @color;
|
||||
}
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor, @startColor, @stopColor) {
|
||||
.spanStyleMixin(@color, @bgcolor, @bordercolor);
|
||||
// @c-start: argb(@startColor);
|
||||
// @c-end: argb(@stopColor);
|
||||
background: -moz-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // FF3.6+
|
||||
background: -webkit-gradient(
|
||||
linear,
|
||||
left top,
|
||||
left bottom,
|
||||
color-stop(0%, @startColor),
|
||||
color-stop(100%, @stopColor)
|
||||
); // Chrome,Safari4+
|
||||
background: -webkit-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Chrome10+,Safari5.1+
|
||||
background: -o-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // Opera 11.10+
|
||||
background: -ms-linear-gradient(
|
||||
top,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // IE10+
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
@startColor 0%,
|
||||
@stopColor 100%
|
||||
); // W3C
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@{startColor}', endColorstr='@{stopColor}',GradientType=0 ); // IE6-9
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
// Redefine, in case jQuery-UI is not included
|
||||
// .ui-helper-hidden,
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
// tri-state checkbox
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: @fancy-font-color-dimm;
|
||||
}
|
||||
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
/* CHANGE: renamed spin to spin-fancytree */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin-fancytree 1000ms infinite linear;
|
||||
animation: spin-fancytree 1000ms infinite linear;
|
||||
}
|
||||
/* CHANGE: commented because it is wrong prefixed by phpless
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
*/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
ul.fancytree-container {
|
||||
font-family: @fancy-font-family;
|
||||
font-size: @fancy-font-size;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0; // DT issue 201
|
||||
//background-color: white; CHANGE
|
||||
//border: 1px dotted gray; CHANGE
|
||||
// overflow: auto; // ext-dnd5: otherwise this is always the scroll parent
|
||||
// height: 100%; // DT issue 263, 470
|
||||
min-height: 0%; // #192
|
||||
position: relative; // #235
|
||||
ul {
|
||||
padding: 0 0 0 @fancy-level-indent;
|
||||
margin: 0;
|
||||
}
|
||||
ul > li:before {
|
||||
// #538
|
||||
content: none;
|
||||
}
|
||||
li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
.setBgPos(0, 0);
|
||||
background-repeat: repeat-y;
|
||||
background-image: none; // no v-lines
|
||||
|
||||
margin: 0;
|
||||
// padding: 1px 0 0 0; // issue #246
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Style, when control is disabled
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
// filter: alpha(opacity=50); // Yields a css warning
|
||||
background-color: silver;
|
||||
}
|
||||
|
||||
ul.fancytree-connectors.fancytree-container {
|
||||
li {
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
/* CHANGE: phpless does not handle data-uri() correct */
|
||||
//background-image: data-uri("@{fancy-image-prefix}vline.gif");
|
||||
background-image: url("@{fancy-image-prefix}vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Suppress lines for last child node
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
// Fix jQuery UI 'blind' animation for jQuery UI (#717)
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
// display: -moz-inline-box; // @ FF 1+2 removed for issue 221
|
||||
// -moz-box-align: start; /* issue 221 */
|
||||
display: inline-block; // Required to make a span sizeable
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
// background-position: left;
|
||||
.setBgImageUrl("icons.gif");
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
// span.fancytree-radio,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
display: inline-block;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.setBgPos(0, 0);
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: @fancy-icon-width;
|
||||
height: @fancy-icon-height;
|
||||
margin-left: @fancy-icon-spacing;
|
||||
margin-top: @fancy-icon-ofs-top;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-expander {
|
||||
// .useSprite(0, 5);
|
||||
cursor: pointer;
|
||||
}
|
||||
// span.fancytree-expander:hover {
|
||||
// // .useSprite(1, 5);
|
||||
// }
|
||||
|
||||
// --- End nodes (use connectors instead of expanders)
|
||||
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
// .clearBgImage( @fancy-hide-connectors );
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors {
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander, // End-node, not last sibling
|
||||
.fancytree-exp-n span.fancytree-expander:hover {
|
||||
.useSprite(0, 4);
|
||||
}
|
||||
.fancytree-exp-nl span.fancytree-expander, // End-node, last sibling
|
||||
.fancytree-exp-nl span.fancytree-expander:hover {
|
||||
.useSprite(1, 4);
|
||||
}
|
||||
}
|
||||
|
||||
// --- Collapsed
|
||||
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
// Collapsed, not delayed, not last sibling
|
||||
.useSprite(0, 5);
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
.useSprite(1, 5);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
// Collapsed, not delayed, last sibling
|
||||
.useSprite(0, 6);
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
.useSprite(1, 6);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
// Collapsed, delayed, not last sibling
|
||||
.useSprite(4, 5);
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
.useSprite(5, 5);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
// Collapsed, delayed, last sibling
|
||||
.useSprite(4, 6);
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
.useSprite(5, 6);
|
||||
}
|
||||
|
||||
// --- Expanded
|
||||
|
||||
.fancytree-exp-e span.fancytree-expander, // Expanded, not delayed, not last sibling
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
// Expanded, delayed, not last sibling
|
||||
.useSprite(2, 5);
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
.useSprite(3, 5);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander, // Expanded, not delayed, last sibling
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
// Expanded, delayed, last sibling
|
||||
.useSprite(2, 6);
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
.useSprite(3, 6);
|
||||
}
|
||||
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander {
|
||||
span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover span.fancytree-expander,
|
||||
&.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-treefocus span.fancytree-expander,
|
||||
[class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Checkbox icon
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//span.fancytree-checkbox {
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
// .useSprite(0, 2);
|
||||
// &:hover {
|
||||
// .useSprite(1, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(1, 3);
|
||||
// }
|
||||
//}
|
||||
//.fancytree-partsel span.fancytree-checkbox {
|
||||
// .useSprite(4, 2);
|
||||
// &:hover {
|
||||
// .useSprite(5, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(4, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(5, 3);
|
||||
// }
|
||||
//}
|
||||
//// selected after partsel, so it takes precedence:
|
||||
//.fancytree-selected span.fancytree-checkbox {
|
||||
// .useSprite(2, 2);
|
||||
// &:hover {
|
||||
// .useSprite(3, 2);
|
||||
// }
|
||||
// &.fancytree-radio {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
// &.fancytree-radio:hover {
|
||||
// .useSprite(3, 3);
|
||||
// }
|
||||
//}
|
||||
//// Unselectable is dimmed, without hover effects
|
||||
//.fancytree-unselectable {
|
||||
// span.fancytree-checkbox {
|
||||
// opacity: 0.4;
|
||||
// filter: alpha(opacity=40);
|
||||
// }
|
||||
// span.fancytree-checkbox:hover {
|
||||
// .useSprite(0, 2);
|
||||
// }
|
||||
// span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(0, 3);
|
||||
// }
|
||||
// &.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
// .useSprite(4, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox:hover {
|
||||
// .useSprite(2, 2);
|
||||
// }
|
||||
// &.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
// .useSprite(2, 3);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//// Auto-hide checkboxes unless selected or hovered
|
||||
//.fancytree-container.fancytree-checkbox-auto-hide {
|
||||
// span.fancytree-checkbox {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .fancytree-node:hover span.fancytree-checkbox,
|
||||
// tr:hover td span.fancytree-checkbox,
|
||||
// .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
// tr.fancytree-selected td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// &.fancytree-treefocus {
|
||||
// .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
// tr.fancytree-active td span.fancytree-checkbox {
|
||||
// visibility: unset;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-icon {
|
||||
// Default icon
|
||||
margin-left: @fancy-icon-spacing;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
// .useSprite(0, 0);
|
||||
}
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(1, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 0);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
.useSprite(3, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 0);
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
.useSprite(5, 0);
|
||||
}
|
||||
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (empty)
|
||||
.useSprite(0, 1);
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(1, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
// Collapsed folder (not empty)
|
||||
.useSprite(2, 1);
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
.useSprite(3, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
// Expanded folder
|
||||
.useSprite(4, 1);
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
.useSprite(5, 1);
|
||||
}
|
||||
|
||||
// 'Loading' status overrides all others
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: @fancy-loading-url;
|
||||
.useSprite(0, 0);
|
||||
}
|
||||
|
||||
/* Status node icons */
|
||||
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
.useSprite(0, 7);
|
||||
}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit; // #117, resolves to 'display: list-item;' for standard trees
|
||||
width: 100%;
|
||||
margin-top: @fancy-node-v-spacing;
|
||||
min-height: @fancy-line-height;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: @fancy-font-color; // inherit doesn't work on IE
|
||||
cursor: pointer;
|
||||
display: inline-block; // Better alignment, when title contains <br>
|
||||
vertical-align: top;
|
||||
min-height: @fancy-line-height;
|
||||
padding: 0 3px 0 3px; // Otherwise italic font will be outside right bounds
|
||||
margin: @fancy-title-ofs-top 0 0 @fancy-icon-spacing;
|
||||
// margin: 0px;
|
||||
// margin-top: @fancy-line-ofs-top;
|
||||
// margin-left: @fancy-icon-spacing;
|
||||
border: @fancy-node-border-width solid transparent; // avoid jumping, when a border is added on hover
|
||||
.rounded-corners(@fancy-node-border-radius);
|
||||
// outline: 0; // @ Firefox, prevent dotted border after click
|
||||
// Set transparent border to prevent jumping when active node gets a border
|
||||
// (we can do this, because this theme doesn't use vertical lines)
|
||||
// border: 1px solid white; // Note: 'transparent' would not work in IE6
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: @fancy-font-error-color;
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * Drag'n'drop support
|
||||
// *----------------------------------------------------------------------------*/
|
||||
///* ext-dnd5: */
|
||||
//span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
//}
|
||||
//
|
||||
///* ext-dnd: */
|
||||
//div.fancytree-drag-helper {
|
||||
// span.fancytree-childcounter,
|
||||
// span.fancytree-dnd-modifier {
|
||||
// display: inline-block;
|
||||
// color: #fff;
|
||||
// background: #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// min-width: 10px;
|
||||
// // min-height: 16px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// position: absolute;
|
||||
// // left: 16px;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// }
|
||||
// span.fancytree-dnd-modifier {
|
||||
// background: #5cb85c; // bootstrap green
|
||||
// border: none;
|
||||
// // min-height: 16px;
|
||||
// // font-size: 12px;
|
||||
// font-weight: bolder;
|
||||
// }
|
||||
// &.fancytree-drop-accept {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(2, 7);
|
||||
// }
|
||||
// }
|
||||
// &.fancytree-drop-reject {
|
||||
// span.fancytree-drag-helper-img {
|
||||
// .useSprite(1, 7);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Drop marker icon *********************************************************/
|
||||
//#fancytree-drop-marker {
|
||||
// width: 2 * @fancy-icon-width; // was 24px, but 32 should be correct
|
||||
// position: absolute;
|
||||
// .useSprite(0, 8);
|
||||
// margin: 0;
|
||||
// &.fancytree-drop-after,
|
||||
// &.fancytree-drop-before {
|
||||
// width: 4 * @fancy-icon-width; // 64px;
|
||||
// .useSprite(0, 9);
|
||||
// }
|
||||
// &.fancytree-drop-copy {
|
||||
// .useSprite(4, 8);
|
||||
// }
|
||||
// &.fancytree-drop-move {
|
||||
// .useSprite(2, 8);
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Source node while dragging ***********************************************/
|
||||
//
|
||||
//span.fancytree-drag-source {
|
||||
// &.fancytree-drag-remove {
|
||||
// // text-decoration: line-through;
|
||||
// opacity: 0.15;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*** Target node while dragging cursor is over it *****************************/
|
||||
//
|
||||
//span.fancytree-drop-target {
|
||||
// &.fancytree-drop-accept {
|
||||
// // outline: 1px dotted #5cb85c; // bootstrap sucess
|
||||
// }
|
||||
//}
|
||||
//span.fancytree-drop-reject {
|
||||
// // outline: 1px dotted #d9534f; // boostrap warning
|
||||
//}
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
|
||||
.fancytree-container.fancytree-rtl {
|
||||
.fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/ /* optional: reverse title letters */
|
||||
}
|
||||
span.fancytree-connector,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-drag-helper-img {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
&.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
&.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl {
|
||||
ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
&.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("@{fancy-image-prefix}vline-rtl.gif");
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib,
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
&.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
.setBgImageUrl("icons-rtl.gif");
|
||||
}
|
||||
|
||||
//// CHANGE: not used.
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'table' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-table {
|
||||
// font-family: @fancy-font-family;
|
||||
// font-size: @fancy-font-size;
|
||||
// border-collapse: collapse;
|
||||
// span.fancytree-node {
|
||||
// display: inline-block; // #117
|
||||
// box-sizing: border-box; // #562
|
||||
// }
|
||||
// td.fancytree-status-merged {
|
||||
// text-align: center;
|
||||
// // font-weight: bold;
|
||||
// font-style: italic;
|
||||
// // line-height: 100px;
|
||||
// color: @fancy-font-color-dimm;
|
||||
// }
|
||||
// tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
// color: @fancy-font-error-color;
|
||||
// }
|
||||
// /* ext-ariagrid */
|
||||
// &.fancytree-ext-ariagrid.fancytree-cell-mode {
|
||||
// > tbody > tr.fancytree-active > td {
|
||||
// background-color: #eee;
|
||||
// }
|
||||
// > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #cbe8f6;
|
||||
// }
|
||||
// &.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
// background-color: #3875d7;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'columnview' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//table.fancytree-ext-columnview {
|
||||
// // border-collapse: collapse;
|
||||
// // width: 100%;
|
||||
// tbody tr td {
|
||||
// position: relative;
|
||||
// border: 1px solid gray;
|
||||
// vertical-align: top;
|
||||
// overflow: auto;
|
||||
// > ul {
|
||||
// padding: 0;
|
||||
// li {
|
||||
// list-style-image: none;
|
||||
// list-style-position: outside;
|
||||
// list-style-type: none;
|
||||
// -moz-background-clip: border;
|
||||
// -moz-background-inline-policy: continuous;
|
||||
// -moz-background-origin: padding;
|
||||
// background-attachment: scroll;
|
||||
// background-color: transparent;
|
||||
// .setBgPos(0, 0);
|
||||
// background-repeat: repeat-y;
|
||||
// background-image: none; /* no v-lines */
|
||||
//
|
||||
// margin: 0;
|
||||
// // padding: 1px 0 0 0; // issue #246
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// span.fancytree-node {
|
||||
// position: relative; /* allow positioning of embedded spans */
|
||||
// display: inline-block; // #117
|
||||
// }
|
||||
// span.fancytree-node.fancytree-expanded {
|
||||
// background-color: #e0e0e0;
|
||||
// }
|
||||
// span.fancytree-node.fancytree-active {
|
||||
// background-color: #cbe8f6;
|
||||
// // background-color: royalblue;
|
||||
// }
|
||||
// .fancytree-has-children span.fancytree-cv-right {
|
||||
// position: absolute;
|
||||
// right: 3px;
|
||||
// .useSprite(0, 5);
|
||||
// &:hover {
|
||||
// .useSprite(1, 5);
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'filter' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-filter-dimm {
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: bold;
|
||||
// }
|
||||
//}
|
||||
//.fancytree-ext-filter-hide {
|
||||
// tr.fancytree-hide,
|
||||
// span.fancytree-node.fancytree-hide {
|
||||
// display: none;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
// color: @fancy-font-color-dimm;
|
||||
// font-weight: lighter;
|
||||
// }
|
||||
// tr.fancytree-match span.fancytree-title,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
// color: black;
|
||||
// font-weight: normal;
|
||||
// }
|
||||
//}
|
||||
///* Hide expanders if all child nodes are hidden by filter */
|
||||
//.fancytree-ext-filter-hide-expanders {
|
||||
// tr.fancytree-match span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// tr.fancytree-submatch span.fancytree-expander,
|
||||
// span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
// visibility: visible;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
//.fancytree-ext-childcounter,
|
||||
//.fancytree-ext-filter {
|
||||
// // span.fancytree-title mark {
|
||||
// // font-style: normal;
|
||||
// // background-color: #ead61c; // yellow
|
||||
// // border-radius: 3px;
|
||||
// // }
|
||||
// span.fancytree-icon,
|
||||
// span.fancytree-custom-icon {
|
||||
// position: relative;
|
||||
// }
|
||||
// span.fancytree-childcounter {
|
||||
// color: #fff;
|
||||
// background: #777; // #337ab7; // bootstrap blue
|
||||
// border: 1px solid gray;
|
||||
// position: absolute;
|
||||
// top: -6px;
|
||||
// right: -6px;
|
||||
// min-width: 10px;
|
||||
// height: 10px;
|
||||
// line-height: 1;
|
||||
// vertical-align: baseline;
|
||||
// border-radius: 10px;
|
||||
// padding: 2px;
|
||||
// text-align: center;
|
||||
// font-size: 9px;
|
||||
// }
|
||||
//}
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'wide' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//ul.fancytree-ext-wide {
|
||||
// position: relative;
|
||||
// min-width: 100%;
|
||||
// z-index: 2;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
//
|
||||
// span.fancytree-node > span {
|
||||
// position: relative;
|
||||
// z-index: 2;
|
||||
// }
|
||||
// span.fancytree-node span.fancytree-title {
|
||||
// position: absolute; // Allow left: 0. Note: prevents smooth dropdown animation
|
||||
// z-index: 1; // Behind expander and checkbox
|
||||
// left: 0px;
|
||||
// min-width: 100%;
|
||||
// margin-left: 0;
|
||||
// margin-right: 0;
|
||||
//
|
||||
// -webkit-box-sizing: border-box;
|
||||
// -moz-box-sizing: border-box;
|
||||
// box-sizing: border-box;
|
||||
// }
|
||||
//}
|
||||
//
|
||||
///*------------------------------------------------------------------------------
|
||||
// * 'fixed' extension
|
||||
// *----------------------------------------------------------------------------*/
|
||||
//
|
||||
//.fancytree-ext-fixed-wrapper {
|
||||
// .fancytree-ext-fixed-hidden {
|
||||
// display: none;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
// border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-scroll-border-right {
|
||||
// border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 3;
|
||||
// top: 0px;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-tr {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// top: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-bl {
|
||||
// position: absolute;
|
||||
// overflow: hidden;
|
||||
// z-index: 2;
|
||||
// left: 0px;
|
||||
// }
|
||||
// div.fancytree-ext-fixed-wrapper-br {
|
||||
// position: absolute;
|
||||
// overflow: scroll;
|
||||
// z-index: 1;
|
||||
// }
|
||||
//}
|
||||
|
|
@ -0,0 +1,822 @@
|
|||
/*!
|
||||
* Fancytree "Win7" skin.
|
||||
*
|
||||
* DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from
|
||||
* the LESS templates.
|
||||
*/
|
||||
/*******************************************************************************
|
||||
* Common Styles for Fancytree Skins.
|
||||
*
|
||||
* This section is automatically generated from the `skin-common.less` template.
|
||||
*
|
||||
* Copyright (c) 2008-2023, Martin Wendt (https://wwWendt.de)
|
||||
* Released under the MIT license
|
||||
* https://github.com/mar10/fancytree/wiki/LicenseInfo
|
||||
*
|
||||
* @version 2.38.3
|
||||
* @date 2023-02-01T20:52:50Z
|
||||
******************************************************************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* Helpers
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-helper-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-helper-indeterminate-cb {
|
||||
color: #777;
|
||||
}
|
||||
.fancytree-helper-disabled {
|
||||
color: #c0c0c0;
|
||||
}
|
||||
/* Helper to allow spinning loader icon with glyph-, ligature-, and SVG-icons. */
|
||||
.fancytree-helper-spin {
|
||||
-webkit-animation: spin 1000ms infinite linear;
|
||||
animation: spin 1000ms infinite linear;
|
||||
}
|
||||
@-webkit-keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
@keyframes spin {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: rotate(359deg);
|
||||
transform: rotate(359deg);
|
||||
}
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Container and UL / LI
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-container {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
margin: 0;
|
||||
background-color: white;
|
||||
border: 1px dotted gray;
|
||||
min-height: 0%;
|
||||
position: relative;
|
||||
}
|
||||
ul.fancytree-container ul {
|
||||
padding: 0 0 0 16px;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container ul > li:before {
|
||||
content: none;
|
||||
}
|
||||
ul.fancytree-container li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0px 0px;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
margin: 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
.ui-fancytree-disabled ul.fancytree-container {
|
||||
opacity: 0.5;
|
||||
background-color: silver;
|
||||
}
|
||||
ul.fancytree-connectors.fancytree-container li {
|
||||
background-image: url("../skin-win7/vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
ul.fancytree-container li.fancytree-lastsib,
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
li.fancytree-animating {
|
||||
position: relative;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Common icon definitions
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-empty,
|
||||
span.fancytree-vline,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-drag-helper-img,
|
||||
#fancytree-drop-marker {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url("../skin-win7/icons.gif");
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
span.fancytree-icon,
|
||||
span.fancytree-checkbox,
|
||||
span.fancytree-expander,
|
||||
span.fancytree-custom-icon {
|
||||
margin-top: 2px;
|
||||
}
|
||||
/* Used by icon option: */
|
||||
span.fancytree-custom-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
margin-left: 3px;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Used by 'icon' node option: */
|
||||
img.fancytree-icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-left: 3px;
|
||||
margin-top: 2px;
|
||||
vertical-align: top;
|
||||
border-style: none;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Expander icon
|
||||
*
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-exp-
|
||||
* 1st character: 'e': expanded, 'c': collapsed, 'n': no children
|
||||
* 2nd character (optional): 'd': lazy (Delayed)
|
||||
* 3rd character (optional): 'l': Last sibling
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-expander {
|
||||
cursor: pointer;
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
cursor: default;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: url("../skin-win7/icons.gif");
|
||||
margin-top: 0;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-n span.fancytree-expander:hover {
|
||||
background-position: 0px -64px;
|
||||
}
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander,
|
||||
.fancytree-connectors .fancytree-exp-nl span.fancytree-expander:hover {
|
||||
background-position: -16px -64px;
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander {
|
||||
background-position: 0px -80px;
|
||||
}
|
||||
.fancytree-exp-c span.fancytree-expander:hover {
|
||||
background-position: -16px -80px;
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander {
|
||||
background-position: 0px -96px;
|
||||
}
|
||||
.fancytree-exp-cl span.fancytree-expander:hover {
|
||||
background-position: -16px -96px;
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander {
|
||||
background-position: -64px -80px;
|
||||
}
|
||||
.fancytree-exp-cd span.fancytree-expander:hover {
|
||||
background-position: -80px -80px;
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander {
|
||||
background-position: -64px -96px;
|
||||
}
|
||||
.fancytree-exp-cdl span.fancytree-expander:hover {
|
||||
background-position: -80px -96px;
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander,
|
||||
.fancytree-exp-ed span.fancytree-expander {
|
||||
background-position: -32px -80px;
|
||||
}
|
||||
.fancytree-exp-e span.fancytree-expander:hover,
|
||||
.fancytree-exp-ed span.fancytree-expander:hover {
|
||||
background-position: -48px -80px;
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander,
|
||||
.fancytree-exp-edl span.fancytree-expander {
|
||||
background-position: -32px -96px;
|
||||
}
|
||||
.fancytree-exp-el span.fancytree-expander:hover,
|
||||
.fancytree-exp-edl span.fancytree-expander:hover {
|
||||
background-position: -48px -96px;
|
||||
}
|
||||
/* Fade out expanders, when container is not hovered or active */
|
||||
.fancytree-fade-expander span.fancytree-expander {
|
||||
transition: opacity 1.5s;
|
||||
opacity: 0;
|
||||
}
|
||||
.fancytree-fade-expander:hover span.fancytree-expander,
|
||||
.fancytree-fade-expander.fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander .fancytree-treefocus span.fancytree-expander,
|
||||
.fancytree-fade-expander [class*="fancytree-statusnode-"] span.fancytree-expander {
|
||||
transition: opacity 0.6s;
|
||||
opacity: 1;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Checkbox icon
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-checkbox {
|
||||
margin-left: 3px;
|
||||
background-position: 0px -32px;
|
||||
}
|
||||
span.fancytree-checkbox:hover {
|
||||
background-position: -16px -32px;
|
||||
}
|
||||
span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: 0px -48px;
|
||||
}
|
||||
span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -16px -48px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox {
|
||||
background-position: -64px -32px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
background-position: -80px -32px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: -64px -48px;
|
||||
}
|
||||
.fancytree-partsel span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -80px -48px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox {
|
||||
background-position: -32px -32px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox:hover {
|
||||
background-position: -48px -32px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox.fancytree-radio {
|
||||
background-position: -32px -48px;
|
||||
}
|
||||
.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -48px -48px;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox {
|
||||
opacity: 0.4;
|
||||
filter: alpha(opacity=40);
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox:hover {
|
||||
background-position: 0px -32px;
|
||||
}
|
||||
.fancytree-unselectable span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: 0px -48px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-partsel span.fancytree-checkbox:hover {
|
||||
background-position: -64px -32px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-selected span.fancytree-checkbox:hover {
|
||||
background-position: -32px -32px;
|
||||
}
|
||||
.fancytree-unselectable.fancytree-selected span.fancytree-checkbox.fancytree-radio:hover {
|
||||
background-position: -32px -48px;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide span.fancytree-checkbox {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node:hover span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr:hover td span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide .fancytree-node.fancytree-selected span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide tr.fancytree-selected td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus .fancytree-node.fancytree-active span.fancytree-checkbox,
|
||||
.fancytree-container.fancytree-checkbox-auto-hide.fancytree-treefocus tr.fancytree-active td span.fancytree-checkbox {
|
||||
visibility: unset;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node type icon
|
||||
* Note: IE6 doesn't correctly evaluate multiples class names,
|
||||
* so we create combined class names that can be used in the CSS.
|
||||
*
|
||||
* Prefix: fancytree-ico-
|
||||
* 1st character: 'e': expanded, 'c': collapsed
|
||||
* 2nd character (optional): 'f': folder
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-icon {
|
||||
margin-left: 3px;
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Documents */
|
||||
.fancytree-ico-c span.fancytree-icon:hover {
|
||||
background-position: -16px 0px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon {
|
||||
background-position: -32px 0px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-c span.fancytree-icon:hover {
|
||||
background-position: -48px 0px;
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon {
|
||||
background-position: -64px 0px;
|
||||
}
|
||||
.fancytree-ico-e span.fancytree-icon:hover {
|
||||
background-position: -80px 0px;
|
||||
}
|
||||
/* Folders */
|
||||
.fancytree-ico-cf span.fancytree-icon {
|
||||
background-position: 0px -16px;
|
||||
}
|
||||
.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
background-position: -16px -16px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon {
|
||||
background-position: -32px -16px;
|
||||
}
|
||||
.fancytree-has-children.fancytree-ico-cf span.fancytree-icon:hover {
|
||||
background-position: -48px -16px;
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon {
|
||||
background-position: -64px -16px;
|
||||
}
|
||||
.fancytree-ico-ef span.fancytree-icon:hover {
|
||||
background-position: -80px -16px;
|
||||
}
|
||||
.fancytree-loading span.fancytree-expander,
|
||||
.fancytree-loading span.fancytree-expander:hover,
|
||||
.fancytree-statusnode-loading span.fancytree-icon,
|
||||
.fancytree-statusnode-loading span.fancytree-icon:hover,
|
||||
span.fancytree-icon.fancytree-icon-loading {
|
||||
background-image: url("../skin-win7/loading.gif");
|
||||
background-position: 0px 0px;
|
||||
}
|
||||
/* Status node icons */
|
||||
.fancytree-statusnode-error span.fancytree-icon,
|
||||
.fancytree-statusnode-error span.fancytree-icon:hover {
|
||||
background-position: 0px -112px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Node titles and highlighting
|
||||
*----------------------------------------------------------------------------*/
|
||||
span.fancytree-node {
|
||||
/* See #117 */
|
||||
display: inherit;
|
||||
width: 100%;
|
||||
margin-top: 1px;
|
||||
min-height: 20px;
|
||||
}
|
||||
span.fancytree-title {
|
||||
color: black;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
min-height: 20px;
|
||||
padding: 0 3px 0 3px;
|
||||
margin: 0px 0 0 3px;
|
||||
border: 1px solid transparent;
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
-ms-border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
span.fancytree-node.fancytree-error span.fancytree-title {
|
||||
color: red;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* Drag'n'drop support
|
||||
*----------------------------------------------------------------------------*/
|
||||
/* ext-dnd5: */
|
||||
span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
/* ext-dnd: */
|
||||
div.fancytree-drag-helper span.fancytree-childcounter,
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
background: #337ab7;
|
||||
border: 1px solid gray;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-childcounter {
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
}
|
||||
div.fancytree-drag-helper span.fancytree-dnd-modifier {
|
||||
background: #5cb85c;
|
||||
border: none;
|
||||
font-weight: bolder;
|
||||
}
|
||||
div.fancytree-drag-helper.fancytree-drop-accept span.fancytree-drag-helper-img {
|
||||
background-position: -32px -112px;
|
||||
}
|
||||
div.fancytree-drag-helper.fancytree-drop-reject span.fancytree-drag-helper-img {
|
||||
background-position: -16px -112px;
|
||||
}
|
||||
/*** Drop marker icon *********************************************************/
|
||||
#fancytree-drop-marker {
|
||||
width: 32px;
|
||||
position: absolute;
|
||||
background-position: 0px -128px;
|
||||
margin: 0;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-after,
|
||||
#fancytree-drop-marker.fancytree-drop-before {
|
||||
width: 64px;
|
||||
background-position: 0px -144px;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-copy {
|
||||
background-position: -64px -128px;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-drop-move {
|
||||
background-position: -32px -128px;
|
||||
}
|
||||
/*** Source node while dragging ***********************************************/
|
||||
span.fancytree-drag-source.fancytree-drag-remove {
|
||||
opacity: 0.15;
|
||||
}
|
||||
/*** Target node while dragging cursor is over it *****************************/
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'rtl' option
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-container.fancytree-rtl .fancytree-title {
|
||||
/*unicode-bidi: bidi-override;*/
|
||||
/* optional: reverse title letters */
|
||||
}
|
||||
.fancytree-container.fancytree-rtl span.fancytree-connector,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-icon,
|
||||
.fancytree-container.fancytree-rtl span.fancytree-drag-helper-img {
|
||||
background-image: url("../skin-win7/icons-rtl.gif");
|
||||
}
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: none;
|
||||
}
|
||||
.fancytree-container.fancytree-rtl.fancytree-connectors .fancytree-exp-n span.fancytree-expander,
|
||||
.fancytree-container.fancytree-rtl.fancytree-connectors .fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: url("../skin-win7/icons-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl ul {
|
||||
padding: 0 16px 0 0;
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-connectors li {
|
||||
background-position: right 0;
|
||||
background-image: url("../skin-win7/vline-rtl.gif");
|
||||
}
|
||||
ul.fancytree-container.fancytree-rtl li.fancytree-lastsib,
|
||||
ul.fancytree-container.fancytree-rtl.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
#fancytree-drop-marker.fancytree-rtl {
|
||||
background-image: url("../skin-win7/icons-rtl.gif");
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'table' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-table {
|
||||
font-family: tahoma, arial, helvetica;
|
||||
font-size: 10pt;
|
||||
border-collapse: collapse;
|
||||
/* ext-ariagrid */
|
||||
}
|
||||
table.fancytree-ext-table span.fancytree-node {
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
table.fancytree-ext-table td.fancytree-status-merged {
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
color: #c0c0c0;
|
||||
}
|
||||
table.fancytree-ext-table tr.fancytree-statusnode-error td.fancytree-status-merged {
|
||||
color: red;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr.fancytree-active > td {
|
||||
background-color: #eee;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-table.fancytree-ext-ariagrid.fancytree-cell-mode.fancytree-cell-nav-mode > tbody > tr > td.fancytree-active-cell {
|
||||
background-color: #3875d7;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'columnview' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
table.fancytree-ext-columnview tbody tr td {
|
||||
position: relative;
|
||||
border: 1px solid gray;
|
||||
vertical-align: top;
|
||||
overflow: auto;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul {
|
||||
padding: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview tbody tr td > ul li {
|
||||
list-style-image: none;
|
||||
list-style-position: outside;
|
||||
list-style-type: none;
|
||||
-moz-background-clip: border;
|
||||
-moz-background-inline-policy: continuous;
|
||||
-moz-background-origin: padding;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
background-position: 0px 0px;
|
||||
background-repeat: repeat-y;
|
||||
background-image: none;
|
||||
/* no v-lines */
|
||||
margin: 0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node {
|
||||
position: relative;
|
||||
/* allow positioning of embedded spans */
|
||||
display: inline-block;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded {
|
||||
background-color: #e0e0e0;
|
||||
}
|
||||
table.fancytree-ext-columnview span.fancytree-node.fancytree-active {
|
||||
background-color: #cbe8f6;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right {
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
background-position: 0px -80px;
|
||||
}
|
||||
table.fancytree-ext-columnview .fancytree-has-children span.fancytree-cv-right:hover {
|
||||
background-position: -16px -80px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'filter' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-filter-dimm span.fancytree-node span.fancytree-title {
|
||||
color: #c0c0c0;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
.fancytree-ext-filter-dimm tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-dimm span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-hide,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-hide {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-submatch span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-submatch span.fancytree-title {
|
||||
color: #c0c0c0;
|
||||
font-weight: lighter;
|
||||
}
|
||||
.fancytree-ext-filter-hide tr.fancytree-match span.fancytree-title,
|
||||
.fancytree-ext-filter-hide span.fancytree-node.fancytree-match span.fancytree-title {
|
||||
color: black;
|
||||
font-weight: normal;
|
||||
}
|
||||
/* Hide expanders if all child nodes are hidden by filter */
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-match span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-match span.fancytree-expander {
|
||||
visibility: hidden;
|
||||
}
|
||||
.fancytree-ext-filter-hide-expanders tr.fancytree-submatch span.fancytree-expander,
|
||||
.fancytree-ext-filter-hide-expanders span.fancytree-node.fancytree-submatch span.fancytree-expander {
|
||||
visibility: visible;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-icon,
|
||||
.fancytree-ext-filter span.fancytree-icon,
|
||||
.fancytree-ext-childcounter span.fancytree-custom-icon,
|
||||
.fancytree-ext-filter span.fancytree-custom-icon {
|
||||
position: relative;
|
||||
}
|
||||
.fancytree-ext-childcounter span.fancytree-childcounter,
|
||||
.fancytree-ext-filter span.fancytree-childcounter {
|
||||
color: #fff;
|
||||
background: #777;
|
||||
border: 1px solid gray;
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
right: -6px;
|
||||
min-width: 10px;
|
||||
height: 10px;
|
||||
line-height: 1;
|
||||
vertical-align: baseline;
|
||||
border-radius: 10px;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
font-size: 9px;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'wide' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
ul.fancytree-ext-wide {
|
||||
position: relative;
|
||||
min-width: 100%;
|
||||
z-index: 2;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node > span {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
ul.fancytree-ext-wide span.fancytree-node span.fancytree-title {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
left: 0px;
|
||||
min-width: 100%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/*------------------------------------------------------------------------------
|
||||
* 'fixed' extension
|
||||
*----------------------------------------------------------------------------*/
|
||||
.fancytree-ext-fixed-wrapper .fancytree-ext-fixed-hidden {
|
||||
display: none;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-bottom {
|
||||
border-bottom: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-scroll-border-right {
|
||||
border-right: 3px solid rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 3;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-tr {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
top: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-bl {
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
left: 0px;
|
||||
}
|
||||
.fancytree-ext-fixed-wrapper div.fancytree-ext-fixed-wrapper-br {
|
||||
position: absolute;
|
||||
overflow: scroll;
|
||||
z-index: 1;
|
||||
}
|
||||
/*******************************************************************************
|
||||
* Styles specific to this skin.
|
||||
*
|
||||
* This section is automatically generated from the `ui-fancytree.less` template.
|
||||
******************************************************************************/
|
||||
/*******************************************************************************
|
||||
* Node titles
|
||||
*/
|
||||
span.fancytree-active .fancytree-title,
|
||||
span.fancytree-selected .fancytree-title {
|
||||
border-color: #d9d9d9;
|
||||
background: #e5e5e5;
|
||||
color: inherit;
|
||||
background: -moz-linear-gradient(top, #fafafb 0%, #e5e5e5 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fafafb), color-stop(100%, #e5e5e5));
|
||||
background: -webkit-linear-gradient(top, #fafafb 0%, #e5e5e5 100%);
|
||||
background: -o-linear-gradient(top, #fafafb 0%, #e5e5e5 100%);
|
||||
background: -ms-linear-gradient(top, #fafafb 0%, #e5e5e5 100%);
|
||||
background: linear-gradient(to bottom, #fafafb 0%, #e5e5e5 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fafafb', endColorstr='#e5e5e5', GradientType=0);
|
||||
}
|
||||
span.fancytree-selected .fancytree-title {
|
||||
font-style: italic;
|
||||
}
|
||||
.fancytree-treefocus span.fancytree-active .fancytree-title,
|
||||
.fancytree-treefocus span.fancytree-selected .fancytree-title {
|
||||
border-color: #99defd;
|
||||
background: #f6fbfd;
|
||||
color: inherit;
|
||||
background: -moz-linear-gradient(top, #f6fbfd 0%, #d5effc 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f6fbfd), color-stop(100%, #d5effc));
|
||||
background: -webkit-linear-gradient(top, #f6fbfd 0%, #d5effc 100%);
|
||||
background: -o-linear-gradient(top, #f6fbfd 0%, #d5effc 100%);
|
||||
background: -ms-linear-gradient(top, #f6fbfd 0%, #d5effc 100%);
|
||||
background: linear-gradient(to bottom, #f6fbfd 0%, #d5effc 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6fbfd', endColorstr='#d5effc', GradientType=0);
|
||||
}
|
||||
.fancytree-treefocus span.fancytree-focused span.fancytree-title {
|
||||
border: 1px solid #719acb;
|
||||
}
|
||||
span.fancytree-title:hover {
|
||||
border-color: #d8f0fa;
|
||||
background: #f8fcfe;
|
||||
color: inherit;
|
||||
background: -moz-linear-gradient(top, #f8fcfe 0%, #eff9fe 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f8fcfe), color-stop(100%, #eff9fe));
|
||||
background: -webkit-linear-gradient(top, #f8fcfe 0%, #eff9fe 100%);
|
||||
background: -o-linear-gradient(top, #f8fcfe 0%, #eff9fe 100%);
|
||||
background: -ms-linear-gradient(top, #f8fcfe 0%, #eff9fe 100%);
|
||||
background: linear-gradient(to bottom, #f8fcfe 0%, #eff9fe 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f8fcfe', endColorstr='#eff9fe', GradientType=0);
|
||||
}
|
||||
span.fancytree-active .fancytree-title:hover,
|
||||
span.fancytree-selected .fancytree-title:hover {
|
||||
border-color: #719acb;
|
||||
background: #f2f9fd;
|
||||
color: inherit;
|
||||
background: -moz-linear-gradient(top, #f2f9fd 0%, #c4e8fa 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f9fd), color-stop(100%, #c4e8fa));
|
||||
background: -webkit-linear-gradient(top, #f2f9fd 0%, #c4e8fa 100%);
|
||||
background: -o-linear-gradient(top, #f2f9fd 0%, #c4e8fa 100%);
|
||||
background: -ms-linear-gradient(top, #f2f9fd 0%, #c4e8fa 100%);
|
||||
background: linear-gradient(to bottom, #f2f9fd 0%, #c4e8fa 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2f9fd', endColorstr='#c4e8fa', GradientType=0);
|
||||
}
|
||||
/*******************************************************************************
|
||||
* 'table' extension
|
||||
*/
|
||||
table.fancytree-ext-table tbody tr td {
|
||||
border: 1px solid #ededed;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr:hover {
|
||||
border-color: inherit;
|
||||
background: #f8fcfe;
|
||||
color: inherit;
|
||||
background: -moz-linear-gradient(top, #f8fcfe 0%, #eff9fe 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f8fcfe), color-stop(100%, #eff9fe));
|
||||
background: -webkit-linear-gradient(top, #f8fcfe 0%, #eff9fe 100%);
|
||||
background: -o-linear-gradient(top, #f8fcfe 0%, #eff9fe 100%);
|
||||
background: -ms-linear-gradient(top, #f8fcfe 0%, #eff9fe 100%);
|
||||
background: linear-gradient(to bottom, #f8fcfe 0%, #eff9fe 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f8fcfe', endColorstr='#eff9fe', GradientType=0);
|
||||
outline: 1px solid #d8f0fa;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-focused {
|
||||
outline: 1px dotted #090402;
|
||||
}
|
||||
table.fancytree-ext-table tbody span.fancytree-focused span.fancytree-title {
|
||||
outline: solid dotted black;
|
||||
}
|
||||
table.fancytree-ext-table tbody span.fancytree-title:hover {
|
||||
border: 1px solid transparent;
|
||||
background: inherit;
|
||||
background: transparent;
|
||||
background: none;
|
||||
filter: none;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-active:hover,
|
||||
table.fancytree-ext-table tbody tr.fancytree-selected:hover {
|
||||
border-color: inherit;
|
||||
background: #f2f9fd;
|
||||
color: inherit;
|
||||
background: -moz-linear-gradient(top, #f2f9fd 0%, #c4e8fa 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f9fd), color-stop(100%, #c4e8fa));
|
||||
background: -webkit-linear-gradient(top, #f2f9fd 0%, #c4e8fa 100%);
|
||||
background: -o-linear-gradient(top, #f2f9fd 0%, #c4e8fa 100%);
|
||||
background: -ms-linear-gradient(top, #f2f9fd 0%, #c4e8fa 100%);
|
||||
background: linear-gradient(to bottom, #f2f9fd 0%, #c4e8fa 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2f9fd', endColorstr='#c4e8fa', GradientType=0);
|
||||
outline: 1px solid #B6E6FB;
|
||||
}
|
||||
table.fancytree-ext-table tbody tr.fancytree-active,
|
||||
table.fancytree-ext-table tbody tr.fancytree-selected {
|
||||
border-color: inherit;
|
||||
background: #f6fbfd;
|
||||
color: inherit;
|
||||
background: -moz-linear-gradient(top, #f6fbfd 0%, #d5effc 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f6fbfd), color-stop(100%, #d5effc));
|
||||
background: -webkit-linear-gradient(top, #f6fbfd 0%, #d5effc 100%);
|
||||
background: -o-linear-gradient(top, #f6fbfd 0%, #d5effc 100%);
|
||||
background: -ms-linear-gradient(top, #f6fbfd 0%, #d5effc 100%);
|
||||
background: linear-gradient(to bottom, #f6fbfd 0%, #d5effc 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6fbfd', endColorstr='#d5effc', GradientType=0);
|
||||
outline: 1px solid #99DEFD;
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue