/hippo/src/main/webapp/ext/resources/css/structure/grid.css

  1/*!
  2 * Ext JS Library 3.0.0
  3 * Copyright(c) 2006-2009 Ext JS, LLC
  4 * licensing@extjs.com
  5 * http://www.extjs.com/license
  6 */
  7/* Grid3 styles */
  8.x-grid3 {
  9	position:relative;
 10	overflow:hidden;
 11}
 12
 13.x-grid-panel .x-panel-body {
 14    overflow:hidden !important;
 15}
 16
 17.x-grid-panel .x-panel-mc .x-panel-body {
 18    border:1px solid;
 19}
 20
 21.x-grid3 table {
 22    table-layout:fixed;
 23}
 24
 25.x-grid3-viewport{
 26	overflow:hidden;
 27}
 28
 29.x-grid3-hd-row td, .x-grid3-row td, .x-grid3-summary-row td{
 30    -moz-outline: none;
 31	-moz-user-focus: normal;
 32}
 33
 34.x-grid3-row td, .x-grid3-summary-row td {
 35    line-height:13px;
 36    vertical-align: top;
 37	padding-left:1px;
 38    padding-right:1px;
 39    -moz-user-select: none;
 40    -khtml-user-select:none;
 41    -webkit-user-select:ignore;
 42}
 43
 44.x-grid3-cell{
 45    -moz-user-select: none;
 46    -khtml-user-select:none;
 47    -webkit-user-select:ignore;
 48}
 49
 50.x-grid3-hd-row td {
 51    line-height:15px;
 52    vertical-align:middle;
 53    border-left:1px solid;
 54    border-right:1px solid;
 55}
 56
 57.x-grid3-hd-row .x-grid3-marker-hd {
 58    padding:3px;
 59}
 60
 61.x-grid3-row .x-grid3-marker {
 62    padding:3px;
 63}
 64
 65.x-grid3-cell-inner, .x-grid3-hd-inner{
 66	overflow:hidden;
 67	-o-text-overflow: ellipsis;
 68	text-overflow: ellipsis;
 69    padding:3px 3px 3px 5px;
 70    white-space: nowrap;
 71}
 72
 73.x-grid3-hd-inner {
 74    position:relative;
 75	cursor:inherit;
 76	padding:4px 3px 4px 5px;
 77}
 78
 79.x-grid3-row-body {
 80    white-space:normal;
 81}
 82
 83.x-grid3-body-cell {
 84    -moz-outline:0 none;
 85    outline:0 none;
 86}
 87
 88/* IE Quirks to clip */
 89.ext-ie .x-grid3-cell-inner, .ext-ie .x-grid3-hd-inner{
 90	width:100%;
 91}
 92
 93/* reverse above in strict mode */
 94.ext-strict .x-grid3-cell-inner, .ext-strict .x-grid3-hd-inner{
 95	width:auto;
 96}
 97
 98.x-grid-row-loading {
 99    background: no-repeat center center;
100}
101
102.x-grid-page {
103    overflow:hidden;
104}
105
106.x-grid3-row {
107	cursor: default;
108    border: 1px solid;
109    width:100%;
110}
111
112.x-grid3-row-over {
113	border:1px solid;
114    background: repeat-x left top;
115}
116
117.x-grid3-resize-proxy {
118	width:1px;
119    left:0;
120	cursor: e-resize;
121	cursor: col-resize;
122	position:absolute;
123	top:0;
124	height:100px;
125	overflow:hidden;
126	visibility:hidden;
127	border:0 none;
128	z-index:7;
129}
130
131.x-grid3-resize-marker {
132	width:1px;
133	left:0;
134	position:absolute;
135	top:0;
136	height:100px;
137	overflow:hidden;
138	visibility:hidden;
139	border:0 none;
140	z-index:7;
141}
142
143.x-grid3-focus {
144	position:absolute;
145	left:0;
146	top:0;
147	width:1px;
148	height:1px;
149    line-height:1px;
150    font-size:1px;
151    -moz-outline:0 none;
152    outline:0 none;
153    -moz-user-select: text;
154    -khtml-user-select: text;
155    -webkit-user-select:ignore;
156}
157
158/* header styles */
159.x-grid3-header{
160	background: repeat-x 0 bottom;
161	cursor:default;
162    zoom:1;
163    padding:1px 0 0 0;
164}
165
166.x-grid3-header-pop {
167    border-left:1px solid;
168    float:right;
169    clear:none;
170}
171
172.x-grid3-header-pop-inner {
173    border-left:1px solid;
174    width:14px;
175    height:19px;
176    background: transparent no-repeat center center;
177}
178
179.ext-ie .x-grid3-header-pop-inner {
180    width:15px;
181}
182
183.ext-strict .x-grid3-header-pop-inner {
184    width:14px; 
185}
186
187.x-grid3-header-inner {
188    overflow:hidden;
189    zoom:1;
190    float:left;
191}
192
193.x-grid3-header-offset {
194    padding-left:1px;
195    text-align: left;
196}
197
198td.x-grid3-hd-over, td.sort-desc, td.sort-asc, td.x-grid3-hd-menu-open {
199    border-left:1px solid;
200    border-right:1px solid;
201}
202
203td.x-grid3-hd-over .x-grid3-hd-inner, td.sort-desc .x-grid3-hd-inner, td.sort-asc .x-grid3-hd-inner, td.x-grid3-hd-menu-open .x-grid3-hd-inner {
204    background: repeat-x left bottom;
205
206}
207
208.x-grid3-sort-icon{
209	background-repeat: no-repeat;
210	display: none;
211	height: 4px;
212	width: 13px;
213	margin-left:3px;
214	vertical-align: middle;
215}
216
217.sort-asc .x-grid3-sort-icon, .sort-desc .x-grid3-sort-icon {
218	display: inline;
219}
220
221/* Header position fixes for IE strict mode */
222.ext-strict .ext-ie .x-grid3-header-inner, .ext-strict .ext-ie6 .x-grid3-hd {
223    position:relative;
224}
225
226.ext-strict .ext-ie6 .x-grid3-hd-inner{
227    position:static;
228}
229
230/* Body Styles */
231.x-grid3-body {
232	zoom:1;
233}
234
235.x-grid3-scroller {
236	overflow:auto;
237    zoom:1;
238    position:relative;
239}
240
241.x-grid3-cell-text, .x-grid3-hd-text {
242	display: block;
243	padding: 3px 5px 3px 5px;
244	-moz-user-select: none;
245	-khtml-user-select: none;
246    -webkit-user-select:ignore;
247}
248
249.x-grid3-split {
250	background-position: center;
251	background-repeat: no-repeat;
252	cursor: e-resize;
253	cursor: col-resize;
254	display: block;
255	font-size: 1px;
256	height: 16px;
257	overflow: hidden;
258	position: absolute;
259	top: 2px;
260	width: 6px;
261	z-index: 3;
262}
263
264/* Column Reorder DD */
265.x-dd-drag-proxy .x-grid3-hd-inner{
266	background: repeat-x left bottom;
267	width:120px;
268	padding:3px;
269	border:1px solid;
270	overflow:hidden;
271}
272
273.col-move-top, .col-move-bottom{
274	width:9px;
275	height:9px;
276	position:absolute;
277	top:0;
278	line-height:1px;
279	font-size:1px;
280	overflow:hidden;
281	visibility:hidden;
282	z-index:20000;
283    background:transparent no-repeat left top;
284}
285
286/* Selection Styles */
287.x-grid3-row-selected {
288	border:1px dotted;
289}
290
291.x-grid3-locked td.x-grid3-row-marker, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker{
292    background: repeat-x 0 bottom !important;
293    vertical-align:middle !important;
294    padding:0;
295    border-top:1px solid;
296    border-bottom:none !important;
297    border-right:1px solid !important;
298    text-align:center;
299}
300
301.x-grid3-locked td.x-grid3-row-marker div, .x-grid3-locked .x-grid3-row-selected td.x-grid3-row-marker div{
302    padding:0 4px;
303    text-align:center;
304}
305
306/* dirty cells */
307.x-grid3-dirty-cell {
308    background: transparent no-repeat 0 0;
309}
310
311/* Grid Toolbars */
312.x-grid3-topbar, .x-grid3-bottombar{
313    overflow:hidden;
314	display:none;
315	zoom:1;
316    position:relative;
317}
318
319.x-grid3-topbar .x-toolbar{
320	border-right:0 none;
321}
322
323.x-grid3-bottombar .x-toolbar{
324	border-right:0 none;
325	border-bottom:0 none;
326	border-top:1px solid;
327}
328
329/* Props Grid Styles */
330.x-props-grid .x-grid3-cell{
331	padding:1px;
332}
333
334.x-props-grid .x-grid3-td-name .x-grid3-cell-inner{
335	background:transparent repeat-y -16px !important;
336    padding-left:12px;
337}
338
339.x-props-grid .x-grid3-body .x-grid3-td-name{
340    padding:1px;
341    padding-right:0;
342    border:0 none;
343    border-right:1px solid;
344}
345
346/* dd */
347.x-grid3-col-dd {
348    border:0 none;
349    padding:0;
350    background:transparent;
351}
352
353.x-dd-drag-ghost .x-grid3-dd-wrap {
354    padding:1px 3px 3px 1px;
355}
356
357.x-grid3-hd {
358    -moz-user-select:none;
359    -khtml-user-select:none;
360    -webkit-user-select:ignore;
361}
362
363.x-grid3-hd-btn {
364    display:none;
365    position:absolute;
366    width:14px;
367    background:no-repeat left center;
368    right:0;
369    top:0;
370    z-index:2;
371	cursor:pointer;
372}
373
374.x-grid3-hd-over .x-grid3-hd-btn, .x-grid3-hd-menu-open .x-grid3-hd-btn {
375    display:block;
376}
377
378a.x-grid3-hd-btn:hover {
379    background-position:-14px center;
380}
381
382/* Expanders */
383.x-grid3-body .x-grid3-td-expander {
384    background:transparent repeat-y right;
385}
386
387.x-grid3-body .x-grid3-td-expander .x-grid3-cell-inner {
388    padding:0 !important;
389    height:100%;
390}
391
392.x-grid3-row-expander {
393    width:100%;
394    height:18px;
395    background-position:4px 2px;
396    background-repeat:no-repeat;
397    background-color:transparent;
398}
399
400.x-grid3-row-collapsed .x-grid3-row-expander {
401    background-position:4px 2px;
402}
403
404.x-grid3-row-expanded .x-grid3-row-expander {
405    background-position:-21px 2px;
406}
407
408.x-grid3-row-collapsed .x-grid3-row-body {
409    display:none !important;
410}
411
412.x-grid3-row-expanded .x-grid3-row-body {
413    display:block !important;
414}
415
416/* Checkers */
417.x-grid3-body .x-grid3-td-checker {
418    background:transparent repeat-y right;
419}
420
421.x-grid3-body .x-grid3-td-checker .x-grid3-cell-inner, .x-grid3-header .x-grid3-td-checker .x-grid3-hd-inner {
422    padding:0 !important;
423    height:100%;
424}
425
426.x-grid3-row-checker, .x-grid3-hd-checker {
427    width:100%;
428    height:18px;
429    background-position:2px 2px;
430    background-repeat:no-repeat;
431    background-color:transparent;
432}
433
434.x-grid3-row .x-grid3-row-checker {
435    background-position:2px 2px;
436}
437
438.x-grid3-row-selected .x-grid3-row-checker, .x-grid3-hd-checker-on .x-grid3-hd-checker,.x-grid3-row-checked .x-grid3-row-checker {
439    background-position:-23px 2px;
440}
441
442.x-grid3-hd-checker {
443    background-position:2px 3px;
444}
445
446.x-grid3-hd-checker-on .x-grid3-hd-checker {
447    background-position:-23px 3px;
448}
449
450/* Numberer */
451.x-grid3-body .x-grid3-td-numberer {
452    background:transparent repeat-y right;
453}
454
455.x-grid3-body .x-grid3-td-numberer .x-grid3-cell-inner {
456    padding:3px 5px 0 0 !important;
457    text-align:right;
458}
459
460/* Row Icon */
461
462.x-grid3-body .x-grid3-td-row-icon {
463    background:transparent repeat-y right;
464    vertical-align:top;
465    text-align:center;
466}
467
468.x-grid3-body .x-grid3-td-row-icon .x-grid3-cell-inner {
469    padding:0 !important;
470    background-position:center center;
471    background-repeat:no-repeat;
472    width:16px;
473    height:16px;
474    margin-left:2px;
475    margin-top:3px;
476}
477
478/* All specials */
479.x-grid3-body .x-grid3-row-selected .x-grid3-td-numberer,
480.x-grid3-body .x-grid3-row-selected .x-grid3-td-checker,
481.x-grid3-body .x-grid3-row-selected .x-grid3-td-expander {
482	background:transparent repeat-y right;
483}
484
485.x-grid3-body .x-grid3-check-col-td .x-grid3-cell-inner {
486    padding: 1px 0 0 0 !important;
487}
488
489.x-grid3-check-col {
490    width:100%;
491    height:16px;
492    background-position:center center;
493    background-repeat:no-repeat;
494    background-color:transparent;
495}
496
497.x-grid3-check-col-on {
498    width:100%;
499    height:16px;
500    background-position:center center;
501    background-repeat:no-repeat;
502    background-color:transparent;
503}
504
505/* Grouping classes */
506.x-grid-group, .x-grid-group-body, .x-grid-group-hd {
507    zoom:1;
508}
509
510.x-grid-group-hd {
511    border-bottom: 2px solid;
512    cursor:pointer;
513    padding-top:6px;
514}
515
516.x-grid-group-hd div.x-grid-group-title {
517    background:transparent no-repeat 3px 3px;
518    padding:4px 4px 4px 17px;
519}
520
521.x-grid-group-collapsed .x-grid-group-body {
522    display:none;
523}
524
525.ext-ie6 .x-grid3 .x-editor .x-form-text, .ext-ie7 .x-grid3 .x-editor .x-form-text {
526    position:relative;
527    top:-1px;
528}
529
530.ext-ie .x-props-grid .x-editor .x-form-text {
531    position:static;
532    top:0;
533}
534
535.x-grid-empty {
536    padding:10px;
537}
538
539/* fix floating toolbar issue */
540.ext-ie7 .x-grid-panel .x-panel-bbar {
541    position:relative;
542}
543
544.ext-ie6 .x-grid3-header {
545    position: relative;
546}
547
548/* column lines */
549.x-grid-with-col-lines .x-grid3-row td.x-grid3-cell {
550    padding-right:0;
551    border-right:1px solid;
552}