mirror of
https://github.com/zadam/trilium.git
synced 2025-11-14 09:15:50 +01:00
Initial prototype commit
This commit is contained in:
126
frontend/js/fancytree/skin-xp/ui.fancytree.less
Normal file
126
frontend/js/fancytree/skin-xp/ui.fancytree.less
Normal file
@@ -0,0 +1,126 @@
|
||||
/*!
|
||||
* Fancytree "XP" 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.
|
||||
******************************************************************************/
|
||||
|
||||
// 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-icon-spacing: 3px;
|
||||
@fancy-node-border-width: 0;
|
||||
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
@fancy-loading-url: data-uri("@{fancy-image-dir}/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;
|
||||
|
||||
|
||||
/*******************************************************************************
|
||||
* Tree container
|
||||
*/
|
||||
ul.fancytree-container {
|
||||
li {
|
||||
// background-image: url("vline.gif");
|
||||
// Use 'data-uri(...)' to embed the image into CSS instead of linking to 'loading.gif':
|
||||
background-image: data-uri("@{fancy-image-dir}/vline.gif");
|
||||
background-position: 0 0;
|
||||
}
|
||||
&.fancytree-rtl {
|
||||
li {
|
||||
background-position: right 0;
|
||||
background-image: url("vline-rtl.gif");
|
||||
}
|
||||
.fancytree-exp-n span.fancytree-expander {
|
||||
background-image: url("icons-rtl.gif");
|
||||
.useSprite(0, 4);
|
||||
}
|
||||
.fancytree-exp-nl span.fancytree-expander {
|
||||
background-image: url("icons-rtl.gif");
|
||||
.useSprite(1, 4);
|
||||
}
|
||||
}
|
||||
// Suppress lines for last child node
|
||||
li.fancytree-lastsib {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
// Suppress lines if level is fixed expanded (option minExpandLevel)
|
||||
ul.fancytree-no-connector > li {
|
||||
background-image: none;
|
||||
}
|
||||
|
||||
// XP theme always displays connectors (not only when .fancytree-connectors is set)
|
||||
.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);
|
||||
}
|
||||
|
||||
/*******************************************************************************
|
||||
* 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
|
||||
}
|
||||
span.fancytree-focused span.fancytree-title {
|
||||
outline: 1px dotted black;
|
||||
background-color: #EFEBDE; // gray
|
||||
}
|
||||
.fancytree-folder span.fancytree-title {
|
||||
font-weight: bold;
|
||||
}
|
||||
.fancytree-selected span.fancytree-title {
|
||||
color: green;
|
||||
font-style: italic;
|
||||
}
|
||||
.fancytree-active span.fancytree-title {
|
||||
background-color: #3169C6 !important;
|
||||
color: white !important; // @ IE6
|
||||
}
|
||||
|
||||
/*******************************************************************************
|
||||
* '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;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user