• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1tree {
2  outline: none;
3  overflow: auto;
4  display: block;
5}
6
7.tree-item > .tree-row {
8  color: black;
9  -webkit-user-select: none;
10  border: 1px solid rgba(255,255,255,0); /* transparent white */
11  background-color: rgba(255,255,255,0);
12  border-radius: 2px;
13  padding: 0px 3px;
14  line-height: 20px;
15  white-space: nowrap;
16  cursor: default;
17  position: relative;
18  margin: -1px 0;
19}
20
21.expand-icon {
22  width: 16px;
23  height: 16px;
24  display: inline-block;
25  vertical-align: top;
26  position: relative;
27  top: 2px;
28  background-image: -webkit-canvas(tree-triangle);
29  background-position: 50% 50%;
30  background-repeat: no-repeat;
31  -webkit-transition: all .15s;
32  opacity: .6;
33  -webkit-transform: rotate(-90deg);
34}
35
36html[dir=rtl] .expand-icon {
37  -webkit-transform: rotate(90deg);
38}
39
40.tree-item[expanded] > .tree-row > .expand-icon {
41  background-image: -webkit-canvas(tree-triangle);
42  -webkit-transform: rotate(0deg);
43  opacity: .5;
44}
45
46.tree-row .expand-icon {
47  visibility: hidden;
48}
49
50.tree-row[may-have-children] .expand-icon {
51  visibility: visible;
52}
53
54.tree-row[has-children=false] .expand-icon {
55  visibility: hidden;
56}
57
58.tree-row:hover {
59  border-color: hsl(214, 91%, 85%);
60  z-index: 1;
61  background-color: hsl(214, 91%, 97%);
62}
63
64/*
65  WebKit has a bug with attribute selectors so we apply selected to the tree row
66  as well.
67
68  https://bugs.webkit.org/show_bug.cgi?id=12519
69
70*/
71.tree-row[selected] {
72  background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.8),
73                                            rgba(255,255,255,0));
74}
75
76.tree-row[selected] {
77  border-color: hsl(0,0%,85%);
78  background-color: hsl(0, 0%, 90%);
79  z-index: 2;
80}
81
82.tree-row[selected]:hover,
83tree:focus .tree-row[selected] {
84  background-color: hsl(214, 91%, 89%);
85  border-color: #7da2ce;
86}
87
88.tree-children[expanded] {
89  display: block;
90}
91
92.tree-children {
93  display: none;
94}
95
96.tree-item > .tree-row > * {
97  display: inline-block;
98  box-sizing: border-box;
99}
100
101.tree-label {
102  -webkit-padding-start: 20px;
103  background-image: url("../../../../../app/resources/folder_closed.png");
104  background-position: 0 50%;
105  background-repeat: no-repeat;
106  white-space: pre;
107}
108
109/* We need to ensure that even empty labels take up space */
110.tree-label:empty:after {
111  content: " ";
112  white-space: pre;
113}
114
115.tree-rename > .tree-row > .tree-label {
116  -webkit-user-select: auto;
117  -webkit-user-modify: read-write-plaintext-only;
118  background: white;
119  color: black;
120  outline: 1px solid black;
121}
122
123html[dir=rtl] .tree-label {
124  background-position: 100% 50%;
125}
126
127.tree-row[selected] > .tree-label {
128  background-image: url("../../../../../app/resources/folder_open.png");
129}
130
131html[dir='rtl'] .tree-label {
132  background-image: url("../../../../../app/resources/folder_closed_rtl.png");
133}
134
135html[dir='rtl'] .tree-row[selected] > .tree-label {
136  background-image: url("../../../../../app/resources/folder_open_rtl.png");
137}
138
139.tree-item[editing] input {
140  /* Do not inherit the line-height */
141  font-family: inherit;
142  font-size: inherit;
143  font-weight: inherit;
144  margin: -2px -8px -2px -3px;
145  padding: 1px 7px 1px 1px;
146}
147
148html:not([os=mac]) .tree-item[editing] input {
149  outline: none;
150}
151
152html[dir=rtl] .tree-item[editing] input {
153  margin: -2px -3px -2px -8px;
154  padding: 1px 1px 1px 7px;
155}
156