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

http://hdbc.googlecode.com/ · CSS · 552 lines · 434 code · 92 blank · 26 comment · 0 complexity · c456e3c2dc13180a01b3fe93c1d5eb43 MD5 · raw file

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