1/*! 2 * Fancytree "material" skin. 3 * 4 * DON'T EDIT THE CSS FILE DIRECTLY, since it is automatically generated from 5 * the LESS templates. 6 */ 7 8// Import common styles 9@import "skin-common.less"; 10 11// We need to define this variable here (not in skin-common.less) to make it 12// work with grunt and webpack: 13@fancy-image-prefix: "./skin-mdi/"; 14 15/******************************************************************************* 16 * Styles specific to this skin. 17 * 18 * This section is automatically generated from the `ui-fancytree.less` template. 19 ******************************************************************************/ 20/* 21https://material.io/guidelines/components/data-tables.html#data-tables-structure 22*/ 23// local vars 24@fancy-cst-size: 18px; 25@fancy-cst-primary-color: #3f51b5; // primary app color (of indigo-pink) 26@fancy-cst-secondary-color: #ff4081; // secondary app color (of indigo-pink): checkbox 27@fancy-cst-black-87: #212121; // 87% black: table content 28@fancy-cst-black-54: #757575; // 54% black: column headers 29@fancy-cst-select-bg: #f5f5f5; // Grey 100: selected row backround 30@fancy-cst-hover-bg: #eeeeee; // Grey 200: hovered row backround 31 32// Override the variable after the import. 33// NOTE: Variables are always resolved as the last definition, even if it is 34// after where it is used. 35@fancy-use-sprites: false; // false: suppress all background images (i.e. icons) 36@fancy-loading-url: none; 37 38@fancy-level-indent: @fancy-cst-size; //@fancy-cst-size; 39@fancy-line-height: @fancy-cst-size; // height of a nodes selection bar including borders 40@fancy-node-v-spacing: 1px; // gap between two node borders 41@fancy-icon-width: @fancy-cst-size; 42@fancy-icon-height: @fancy-cst-size; 43@fancy-icon-spacing: 3px; // margin between icon/icon or icon/title 44@fancy-icon-ofs-top: -2px; // extra vertical offset for expander, checkbox and icon 45@fancy-title-ofs-top: 0px; // extra vertical offset for title 46@fancy-node-border-width: 1px; 47@fancy-node-border-radius: 0px; 48@fancy-node-outline-width: 1px; 49 50// @fancy-loading-url: data-uri("@{fancy-image-prefix}loading.gif"); 51 52// Set to `true` to use `data-uri(...)` instead of a `url(...)` link: 53@fancy-inline-sprites: false; 54 55//default 10pt, which is used in a relative manner resulting in 13.3 in dokuwiki-template. 56@fancy-font-size: 93%; //@fancy-cst-size; 57@fancy-font-family: "Roboto Regular", tahoma, arial, helvetica; 58@fancy-font-color: @fancy-cst-black-87; 59@fancy-font-color-dimm: silver; 60@fancy-font-error-color: red; 61 62 63ul.fancytree-container ul 64{ 65 padding: 0 0 0 1em; //0.3em 0 0 1em; 66 margin: 0; 67 //font-size: @fancy-cst-size; 68 //color: @fancy-cst-black-87; 69} 70 71ul.fancytree-container span.fancytree-icon.mdi 72{ 73 font-size: @fancy-cst-size; 74 color: @fancy-cst-black-87; 75} 76 77 78// set icon color to font color as well 79span.fancytree-node { 80 color: @fancy-font-color; 81} 82span.fancytree-expander { 83 font-size: @fancy-cst-size; 84} 85 86/******************************************************************************* 87 * Node titles 88 */ 89 90 .fancytree-plain { 91 span.fancytree-selected span.fancytree-title { 92 background-color: @fancy-cst-select-bg; 93 } 94 span.fancytree-selected span.fancytree-title:hover, 95 span.fancytree-active span.fancytree-title { 96 background-color: @fancy-cst-hover-bg; 97 } 98} 99 100.fancytree-container span.fancytree-checkbox { 101 color: @fancy-cst-secondary-color; 102} 103 104///******************************************************************************* 105// * 'table' extension 106// */ 107//table.fancytree-ext-table { 108// border-collapse: collapse; 109// tbody { 110// tr.fancytree-focused, tr.fancytree-selected { 111// background-color: @fancy-cst-select-bg; 112// } 113// tr.fancytree-active, tr:hover { 114// background-color: @fancy-cst-hover-bg; 115// } 116// } 117//} 118// 119///******************************************************************************* 120// * 'columnview' extension 121// */ 122// 123//table.fancytree-ext-columnview tbody tr td { 124// border: 1px solid gray; 125//} 126//table.fancytree-ext-columnview span.fancytree-node.fancytree-expanded { 127// background-color: #ccc; 128//} 129//table.fancytree-ext-columnview span.fancytree-node.fancytree-active { 130// background-color: royalblue; 131//} 132