grid.less 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. .ui-grid {
  2. border: @gridBorderWidth solid @borderColor;
  3. box-sizing: content-box; // If bootstrap (or another included library) makes the default sizing on element "border-box", then calculations get messed up
  4. .rounded(@gridBorderRadius);
  5. .transform(translateZ(0));
  6. }
  7. .ui-grid-vertical-bar {
  8. position: absolute;
  9. right: 0;
  10. width: 0;
  11. }
  12. .ui-grid-header-cell:not(:last-child) .ui-grid-vertical-bar, .ui-grid-cell:not(:last-child) .ui-grid-vertical-bar {
  13. width: @gridBorderWidth;
  14. }
  15. .ui-grid-scrollbar-placeholder{
  16. background-color: transparent;
  17. }
  18. .ui-grid-header-cell:not(:last-child) .ui-grid-vertical-bar {
  19. background-color: @headerVerticalBarColor;
  20. }
  21. .ui-grid-cell:not(:last-child) .ui-grid-vertical-bar {
  22. background-color: @verticalBarColor;
  23. }
  24. .ui-grid-header-cell:last-child .ui-grid-vertical-bar {
  25. right: -1px; // TODO(c0bra): Should this be grid width? Test column resizing with custom grid border width
  26. width: @gridBorderWidth;
  27. background-color: @headerVerticalBarColor;
  28. }
  29. // .ui-grid-vertical-bar-visible {
  30. // width: 1px;
  31. // background-color: @borderColor;
  32. // }
  33. .ui-grid-clearfix {
  34. &:before, &:after {
  35. content: "";
  36. display: table;
  37. }
  38. &:after {
  39. clear:both;
  40. }
  41. }
  42. .ui-grid-invisible {
  43. visibility: hidden;;
  44. }
  45. // Wraps the contents inside the grid directive with a relatively-positioned element so that all absolute elements are positioned relative to the grid, and not the page
  46. .ui-grid-contents-wrapper {
  47. position: relative;
  48. height: 100%;
  49. width: 100%;
  50. }
  51. // Only display content to screen readers
  52. //
  53. // See: http://a11yproject.com/posts/how-to-hide-content/
  54. .ui-grid-sr-only {
  55. position: absolute;
  56. width: 1px;
  57. height: 1px;
  58. margin: -1px;
  59. padding: 0;
  60. overflow: hidden;
  61. clip: rect(0,0,0,0);
  62. border: 0;
  63. }