swimlanes.styl 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. @import 'nib'
  2. .swimlane
  3. // Even if this background color is the same as the body we can't leave it
  4. // transparent, because that won't work during a swimlane drag.
  5. background: darken(white, 13%)
  6. display: flex
  7. flex-direction: row
  8. overflow: 0;
  9. max-height: calc(100% - 26px)
  10. &.placeholder
  11. background-color: rgba(0, 0, 0, .2)
  12. border-color: transparent
  13. box-shadow: none
  14. height: 100px
  15. &.ui-sortable-helper
  16. box-shadow: -2px 2px 8px rgba(0, 0, 0, .3),
  17. 0 0 1px rgba(0, 0, 0, .5)
  18. transform: rotate(2deg)
  19. cursor: grabbing
  20. .swimlane-header.ui-sortable-handle
  21. cursor: grabbing
  22. .swimlane-header-wrap
  23. display: flex;
  24. flex-direction: row;
  25. flex: 1 0 100%;
  26. background-color: #ccc;
  27. .swimlane-header
  28. font-size: 14px;
  29. padding: 5px 5px
  30. font-weight: bold;
  31. min-height: 9px;
  32. width: 100%;
  33. overflow: hidden;
  34. -o-text-overflow: ellipsis;
  35. text-overflow: ellipsis;
  36. word-wrap: break-word;
  37. text-align: center;
  38. .swimlane-header-menu
  39. position: absolute
  40. padding: 5px 5px
  41. .swimlane-header-plus-icon
  42. margin-left: 5px
  43. margin-right: 10px
  44. .list-group
  45. height: 100%
  46. .moving-swimlane
  47. display: none
  48. swimlane-color(background, color...)
  49. background: background !important
  50. if color
  51. color: color !important //overwrite text for better visibility
  52. .swimlane-white
  53. swimlane-color(#ffffff, #4d4d4d) //Black text for better visibility
  54. border: 1px solid #eee
  55. .swimlane-green
  56. swimlane-color(#3cb500, #ffffff) //White text for better visibility
  57. .swimlane-yellow
  58. swimlane-color(#fad900, #4d4d4d) //Black text for better visibility
  59. .swimlane-orange
  60. swimlane-color(#ff9f19, #4d4d4d) //Black text for better visibility
  61. .swimlane-red
  62. swimlane-color(#eb4646, #ffffff) //White text for better visibility
  63. .swimlane-purple
  64. swimlane-color(#a632db, #ffffff) //White text for better visibility
  65. .swimlane-blue
  66. swimlane-color(#0079bf, #ffffff) //White text for better visibility
  67. .swimlane-pink
  68. swimlane-color(#ff78cb, #4d4d4d) //Black text for better visibility
  69. .swimlane-sky
  70. swimlane-color(#00c2e0, #ffffff) //White text for better visibility
  71. .swimlane-black
  72. swimlane-color(#4d4d4d, #ffffff) //White text for better visibility
  73. .swimlane-lime
  74. swimlane-color(#51e898, #4d4d4d) //Black text for better visibility
  75. .swimlane-silver
  76. swimlane-color(unset, #4d4d4d) //Black text for better visibility
  77. .swimlane-peachpuff
  78. swimlane-color(#ffdab9, #4d4d4d) //Black text for better visibility
  79. .swimlane-crimson
  80. swimlane-color(#dc143c, #ffffff) //White text for better visibility
  81. .swimlane-plum
  82. swimlane-color(#dda0dd, #4d4d4d) //Black text for better visibility
  83. .swimlane-darkgreen
  84. swimlane-color(#006400, #ffffff) //White text for better visibility
  85. .swimlane-slateblue
  86. swimlane-color(#6a5acd, #ffffff) //White text for better visibility
  87. .swimlane-magenta
  88. swimlane-color(#ff00ff, #ffffff) //White text for better visibility
  89. .swimlane-gold
  90. swimlane-color(#ffd700, #4d4d4d) //Black text for better visibility
  91. .swimlane-navy
  92. swimlane-color(#000080, #ffffff) //White text for better visibility
  93. .swimlane-gray
  94. swimlane-color(#808080, #ffffff) //White text for better visibility
  95. .swimlane-saddlebrown
  96. swimlane-color(#8b4513, #ffffff) //White text for better visibility
  97. .swimlane-paleturquoise
  98. swimlane-color(#afeeee, #4d4d4d) //Black text for better visibility
  99. .swimlane-mistyrose
  100. swimlane-color(#ffe4e1, #4d4d4d) //Black text for better visibility
  101. .swimlane-indigo
  102. swimlane-color(#4b0082, #ffffff) //White text for better visibility