~elachuni/lazr-js/treeview

« back to all changes in this revision

Viewing changes to src-js/lazrjs/gallery-treeview/assets/skins/sam/gallery-treeview-skin.css

  • Committer: Anthony Lenton
  • Date: 2009-11-11 23:07:05 UTC
  • Revision ID: antoniolenton@gmail.com-20091111230705-csnps9ivsmurf37g
Adding gallery-treeview from the YUI3 Gallery.

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
/*
 
2
Copyright (c) 2008, Yahoo! Inc. All rights reserved.
 
3
Code licensed under the BSD License:
 
4
http://developer.yahoo.net/yui/license.txt
 
5
version: 2.5.2
 
6
*/
 
7
 
 
8
/* the style of the div around each node */
 
9
.ygtvitem { }  
 
10
 
 
11
table.ygtvtable {
 
12
    margin-bottom:0; 
 
13
        border:none;
 
14
        border-collapse:collapse;
 
15
}
 
16
 
 
17
/*.ygtvitem td {*/
 
18
td.ygtvcell {
 
19
    border: none; 
 
20
        padding: 0;
 
21
}
 
22
a.ygtvspacer {
 
23
        text-decoration:none;
 
24
        outline-style:none;
 
25
        display:block;
 
26
}
 
27
 
 
28
 
 
29
/* first or middle sibling, no children */
 
30
.ygtvtn {
 
31
    width:18px; height:22px; 
 
32
    background: url(treeview-sprite.gif) 0 -5600px no-repeat; 
 
33
        cursor:pointer ;
 
34
}
 
35
 
 
36
/* first or middle sibling, collapsable */
 
37
.ygtvtm {
 
38
    width:18px; height:22px; 
 
39
    cursor:pointer ;
 
40
    background: url(treeview-sprite.gif) 0 -4000px no-repeat; 
 
41
}
 
42
 
 
43
/* first or middle sibling, collapsable, hover */
 
44
.ygtvtmh,.ygtvtmhh {
 
45
    width:18px; height:22px; 
 
46
    cursor:pointer ;
 
47
    background: url(treeview-sprite.gif) 0 -4800px no-repeat; 
 
48
}
 
49
 
 
50
/* first or middle sibling, expandable */
 
51
.ygtvtp {
 
52
    width:18px; height:22px; 
 
53
    cursor:pointer ;
 
54
    background: url(treeview-sprite.gif) 0 -6400px no-repeat; 
 
55
}
 
56
 
 
57
/* first or middle sibling, expandable, hover */
 
58
.ygtvtph ,.ygtvtphh {
 
59
    width:18px; height:22px; 
 
60
    cursor:pointer ;
 
61
    background: url(treeview-sprite.gif) 0 -7200px no-repeat; 
 
62
}
 
63
 
 
64
/* last sibling, no children */
 
65
.ygtvln {
 
66
    width:18px; height:22px; 
 
67
    background: url(treeview-sprite.gif) 0 -1600px no-repeat; 
 
68
        cursor:pointer ;
 
69
}
 
70
 
 
71
/* Last sibling, collapsable */
 
72
.ygtvlm {
 
73
    width:18px; height:22px; 
 
74
    cursor:pointer ;
 
75
    background: url(treeview-sprite.gif) 0 0px no-repeat; 
 
76
}
 
77
 
 
78
/* Last sibling, collapsable, hover */
 
79
.ygtvlmh,.ygtvlmhh {
 
80
    width:18px; height:22px; 
 
81
    cursor:pointer ;
 
82
    background: url(treeview-sprite.gif) 0 -800px no-repeat; 
 
83
}
 
84
 
 
85
/* Last sibling, expandable */
 
86
.ygtvlp { 
 
87
    width:18px; height:22px; 
 
88
    cursor:pointer ;
 
89
    background: url(treeview-sprite.gif) 0 -2400px no-repeat; 
 
90
}
 
91
 
 
92
/* Last sibling, expandable, hover */
 
93
.ygtvlph,.ygtvlphh { 
 
94
    width:18px; height:22px; cursor:pointer ;
 
95
    background: url(treeview-sprite.gif) 0 -3200px no-repeat; 
 
96
        cursor:pointer ;
 
97
}
 
98
 
 
99
/* Loading icon */
 
100
.ygtvloading { 
 
101
    width:18px; height:22px; 
 
102
    background: url(treeview-loading.gif) 0 0 no-repeat; 
 
103
}
 
104
 
 
105
/* the style for the empty cells that are used for rendering the depth 
 
106
 * of the node */
 
107
.ygtvdepthcell { 
 
108
    width:18px; height:22px; 
 
109
    background: url(treeview-sprite.gif) 0 -8000px no-repeat; 
 
110
}
 
111
 
 
112
.ygtvblankdepthcell { width:18px; height:22px; }
 
113
 
 
114
 
 
115
/* the style of the div around each node's collection of children */
 
116
.ygtvchildren {  }  
 
117
* html .ygtvchildren { height:2%; }  
 
118
 
 
119
/* the style of the text label in ygTextNode */
 
120
.ygtvlabel, .ygtvlabel:link, .ygtvlabel:visited, .ygtvlabel:hover { 
 
121
    margin-left:2px;
 
122
    text-decoration: none;
 
123
    background-color: white; /* workaround for IE font smoothing bug */
 
124
        cursor:pointer;
 
125
}
 
126
 
 
127
.ygtvcontent {
 
128
        cursor:default;
 
129
}
 
130
 
 
131
.ygtvspacer { height: 22px; width: 18px; }
 
132
 
 
133
.ygtvfocus {
 
134
        background-color: #c0e0e0;
 
135
        border: none;
 
136
}
 
137
.ygtvfocus .ygtvlabel, .ygtvfocus .ygtvlabel:link, .ygtvfocus .ygtvlabel:visited, .ygtvfocus .ygtvlabel:hover {
 
138
        background-color: #c0e0e0;
 
139
}
 
140
 
 
141
.ygtvfocus  a  {
 
142
        outline-style:none;
 
143
}
 
144
 
 
145
 
 
146
.ygtvok {
 
147
    width:18px; height:22px; 
 
148
    background: url(treeview-sprite.gif) 0 -8800px no-repeat; 
 
149
}
 
150
 
 
151
.ygtvok:hover {
 
152
    background: url(treeview-sprite.gif) 0 -8844px no-repeat; 
 
153
}
 
154
        
 
155
.ygtvcancel {
 
156
    width:18px; height:22px; 
 
157
    background: url(treeview-sprite.gif) 0 -8822px no-repeat; 
 
158
}
 
159
 
 
160
.ygtvcancel:hover  {
 
161
    background: url(treeview-sprite.gif) 0 -8866px no-repeat; 
 
162
}
 
163
 
 
164
.ygtv-label-editor {
 
165
        background-color:#f2f2f2;
 
166
        border: 1px solid silver;
 
167
        position:absolute;
 
168
        display:none;
 
169
        overflow:hidden;
 
170
        margin:auto;
 
171
        z-index:9000;
 
172
}
 
173
 
 
174
.ygtv-edit-TextNode  {
 
175
        width: 190px;
 
176
}
 
177
 
 
178
.ygtv-edit-TextNode .ygtvcancel, .ygtv-edit-TextNode .ygtvok  {
 
179
        border:none;
 
180
}
 
181
 
 
182
.ygtv-edit-TextNode .ygtv-button-container {
 
183
        float: right;
 
184
}
 
185
 
 
186
.ygtv-edit-TextNode .ygtv-input  input{
 
187
        width: 140px;
 
188
}
 
189
 
 
190
.ygtv-edit-DateNode .ygtvcancel {
 
191
        border:none;
 
192
}
 
193
.ygtv-edit-DateNode .ygtvok  {
 
194
        display:none;
 
195
}
 
196
 
 
197
.ygtv-edit-DateNode   .ygtv-button-container {
 
198
        text-align:right;
 
199
        margin:auto;
 
200
}
 
201
 
 
202
.ygtv-highlight .ygtv-highlight0 , .ygtv-highlight .ygtv-highlight0 .ygtvlabel{
 
203
}
 
204
 
 
205
.ygtv-highlight .ygtv-highlight1  , .ygtv-highlight .ygtv-highlight1 .ygtvlabel{
 
206
        background-color:blue;
 
207
        color:white;
 
208
}
 
209
 
 
210
.ygtv-highlight .ygtv-highlight2  , .ygtv-highlight .ygtv-highlight2 .ygtvlabel {
 
211
        background-color:silver;
 
212
}
 
213
 
 
214
.ygtv-highlight .ygtv-highlight0 .ygtvfocus .ygtvlabel,
 
215
.ygtv-highlight .ygtv-highlight1 .ygtvfocus .ygtvlabel,
 
216
.ygtv-highlight .ygtv-highlight2 .ygtvfocus .ygtvlabel {
 
217
        background-color: #c0e0e0;
 
218
}
 
219
 
 
220
.ygtv-highlight .ygtvcontent {
 
221
        padding-right: 1em;
 
222
}
 
223
 
 
224
.ygtv-checkbox .ygtv-highlight0 .ygtvcontent {
 
225
        padding-left:1em;
 
226
        background:url(check0.gif) no-repeat;
 
227
}
 
228
 
 
229
.ygtv-checkbox .ygtv-highlight0 .ygtvfocus.ygtvcontent,
 
230
.ygtv-checkbox .ygtv-highlight1 .ygtvfocus.ygtvcontent ,
 
231
.ygtv-checkbox .ygtv-highlight2 .ygtvfocus.ygtvcontent  {
 
232
        background-color:#c0e0e0;
 
233
}
 
234
 
 
235
.ygtv-checkbox .ygtv-highlight1 .ygtvcontent {
 
236
        padding-left:1em;
 
237
        background:url(check1.gif) no-repeat;
 
238
}
 
239
 
 
240
.ygtv-checkbox .ygtv-highlight2 .ygtvcontent{
 
241
        padding-left:1em;
 
242
        background:url(check2.gif) no-repeat;
 
243
}