PageRenderTime 35ms CodeModel.GetById 20ms app.highlight 13ms RepoModel.GetById 1ms app.codeStats 0ms

/ext-4.1.0_b3/resources/themes/stylesheets/ext4/default/util/_tool.scss

https://bitbucket.org/srogerf/javascript
Sass | 289 lines | 221 code | 66 blank | 2 comment | 0 complexity | 61b2509b22080f6db4df1ba908331058 MD5 | raw file
  1@mixin extjs-tool {
  2    .#{$prefix}tool {
  3        height: $tool-size;
  4
  5        img {
  6            overflow: hidden;
  7
  8            width: $tool-size;
  9            height: $tool-size;
 10
 11            cursor: pointer;
 12
 13            background-color: transparent;
 14            background-repeat: no-repeat;
 15            background-image: theme-background-image($theme-name, 'tools/tool-sprites.gif');
 16
 17            margin: 0;
 18        }
 19    }
 20
 21    .#{$prefix}panel-header-horizontal,
 22    .#{$prefix}window-header-horizontal {
 23        .#{$prefix}tool {
 24                margin-left: 2px;
 25        }
 26    }
 27
 28    .#{$prefix}panel-header-vertical,
 29    .#{$prefix}window-header-vertical {
 30        .#{$prefix}tool {
 31                margin-top: 2px;
 32        }
 33    }
 34
 35    .#{$prefix}panel-header-vertical,
 36    .#{$prefix}window-header-vertical {
 37        // this assumes that there will only ever be one tool that shows at the top of a vertical header (the collapse tool)
 38        // we should revisit this if it is decided that we want to support multiple tools at the top
 39        .#{$prefix}tool-top {
 40            margin: 0 0 4px;
 41        }
 42    }
 43
 44
 45.#{$prefix}tool-placeholder {
 46        visibility: hidden;
 47    }
 48
 49    .#{$prefix}tool-toggle {
 50        background-position: 0 -60px;
 51    }
 52
 53    .#{$prefix}tool-over {
 54        .#{$prefix}tool-toggle {
 55            background-position: -15px -60px;
 56        }
 57    }
 58
 59    .#{$prefix}panel-collapsed,
 60    .#{$prefix}fieldset-collapsed {
 61        .#{$prefix}tool-toggle {
 62            background-position: 0 -75px;
 63        }
 64
 65        .#{$prefix}tool-over {
 66            .#{$prefix}tool-toggle {
 67                background-position: -15px -75px;
 68            }
 69        }
 70    }
 71
 72    .#{$prefix}tool-close {
 73        background-position: 0 0;
 74    }
 75    
 76    .#{$prefix}tool-minimize {
 77        background-position: 0 -15px;
 78    }
 79    
 80    .#{$prefix}tool-maximize {
 81        background-position: 0 -30px;
 82    }
 83    
 84    .#{$prefix}tool-restore {
 85        background-position: 0 -45px;
 86    }
 87    
 88    .#{$prefix}tool-gear {
 89        background-position: 0 -90px;
 90    }
 91    
 92    .#{$prefix}tool-prev {
 93        background-position: 0 -105px;
 94    }
 95    
 96    .#{$prefix}tool-next {
 97        background-position: 0 -120px;
 98    }
 99    
100    .#{$prefix}tool-pin {
101        background-position: 0 -135px;
102    }
103
104    .#{$prefix}tool-unpin {
105        background-position: 0 -150px;
106    }
107
108    .#{$prefix}tool-right {
109        background-position: 0 -165px;
110    }
111
112    .#{$prefix}tool-left {
113        background-position: 0 -180px;
114    }
115    
116    .#{$prefix}tool-help {
117        background-position: 0 -300px;
118    }
119
120    .#{$prefix}tool-save {
121        background-position: 0 -285px;
122    }
123
124    .#{$prefix}tool-search {
125        background-position: 0 -270px;
126    }
127
128    .#{$prefix}tool-minus {
129        background-position: 0 -255px;
130    }
131
132    .#{$prefix}tool-plus {
133        background-position: 0 -240px;
134    }
135
136    .#{$prefix}tool-refresh {
137        background-position: 0 -225px;
138    }
139
140    .#{$prefix}tool-up {
141        background-position: 0 -210px;
142    }
143
144    .#{$prefix}tool-down {
145        background-position: 0 -195px;
146    }
147    
148    .#{$prefix}tool-collapse {
149        background-position: 0 -345px;
150    }
151
152    .#{$prefix}tool-expand {
153        background-position: 0 -330px;
154    }
155
156    .#{$prefix}tool-print {
157        background-position: 0 -315px;
158    }
159
160    .#{$prefix}tool-expand-bottom,
161    .#{$prefix}tool-collapse-bottom {
162        background-position: 0 -195px;
163    }
164
165    .#{$prefix}tool-expand-top,
166    .#{$prefix}tool-collapse-top {
167        background-position: 0 -210px;
168    }
169
170    .#{$prefix}tool-expand-left,
171    .#{$prefix}tool-collapse-left {
172        background-position: 0 -180px;
173    }
174
175    .#{$prefix}tool-expand-right,
176    .#{$prefix}tool-collapse-right {
177        background-position: 0 -165px;
178    }
179
180    .#{$prefix}tool-over {
181        .#{$prefix}tool-close {
182            background-position: -15px 0;
183        }
184
185        .#{$prefix}tool-minimize {
186            background-position: -15px -15px;
187        }
188    
189        .#{$prefix}tool-maximize {
190            background-position: -15px -30px;
191        }
192
193        .#{$prefix}tool-restore {
194            background-position: -15px -45px;
195        }
196    
197        .#{$prefix}tool-gear {
198            background-position: -15px -90px;
199        }
200    
201        .#{$prefix}tool-prev {
202            background-position: -15px -105px;
203        }
204    
205        .#{$prefix}tool-next {
206            background-position: -15px -120px;
207        }
208    
209        .#{$prefix}tool-pin {
210            background-position: -15px -135px;
211        }
212    
213        .#{$prefix}tool-unpin {
214            background-position: -15px -150px;
215        }
216    
217        .#{$prefix}tool-right {
218            background-position: -15px -165px;
219        }
220    
221        .#{$prefix}tool-left {
222            background-position: -15px -180px;
223        }
224
225        .#{$prefix}tool-down {
226            background-position: -15px -195px;
227        }
228    
229        .#{$prefix}tool-up {
230            background-position: -15px -210px;
231        }
232    
233        .#{$prefix}tool-refresh {
234            background-position: -15px -225px;
235        }
236    
237        .#{$prefix}tool-plus {
238            background-position: -15px -240px;
239        }
240
241        .#{$prefix}tool-minus {
242            background-position: -15px -255px;
243        }
244
245        .#{$prefix}tool-search {
246            background-position: -15px -270px;
247        }
248
249        .#{$prefix}tool-save {
250            background-position: -15px -285px;
251        }
252
253        .#{$prefix}tool-help {
254            background-position: -15px -300px;
255        }
256
257        .#{$prefix}tool-print {
258            background-position: -15px -315px;
259        }
260
261        .#{$prefix}tool-expand {
262            background-position: -15px -330px;
263        }
264
265        .#{$prefix}tool-collapse {
266            background-position: -15px -345px;
267        }
268        
269        .#{$prefix}tool-expand-bottom,
270        .#{$prefix}tool-collapse-bottom {
271            background-position: -15px -195px;
272        }
273    
274        .#{$prefix}tool-expand-top,
275        .#{$prefix}tool-collapse-top {
276            background-position: -15px -210px;
277        }
278    
279        .#{$prefix}tool-expand-left,
280        .#{$prefix}tool-collapse-left {
281            background-position: -15px -180px;
282        }
283    
284        .#{$prefix}tool-expand-right,
285        .#{$prefix}tool-collapse-right {
286            background-position: -15px -165px;
287        }
288    }
289}