Você não pode selecionar mais de 25 tópicos Os tópicos devem começar com uma letra ou um número, podem incluir traços ('-') e podem ter até 35 caracteres.
 
 
 
 
 
 

265 linhas
4.5 KiB

  1. .gantt {
  2. width: 575px;
  3. height: 500px;
  4. margin: 20px auto;
  5. border: 15px solid #ddd;
  6. -webkit-border-radius: 5px;
  7. -moz-border-radius: 5px;
  8. border-radius: 5px;
  9. }
  10. .gantt:after {
  11. content: ".";
  12. visibility: hidden;
  13. display: block;
  14. height: 0;
  15. clear: both;
  16. }
  17. .fn-gantt {
  18. width: 100%;
  19. }
  20. .fn-gantt .fn-content {
  21. overflow: hidden;
  22. width: 100%;
  23. }
  24. /* left panel */
  25. .fn-gantt .leftPanel {
  26. float: left;
  27. width: 225px;
  28. overflow: hidden;
  29. border-right: 1px solid #DDD;
  30. }
  31. .fn-gantt .row {
  32. float: left;
  33. height: 24px;
  34. line-height: 24px;
  35. }
  36. .fn-gantt .leftPanel .label {
  37. margin: 0 0 0 5px;
  38. }
  39. .fn-gantt .leftPanel .name, .fn-gantt .leftPanel .desc {
  40. float: left;
  41. height: 23px;
  42. margin: 0;
  43. border-bottom: 1px solid #DDD;
  44. background-color: #f6f6f6;
  45. }
  46. .fn-gantt .leftPanel .name {
  47. width: 110px;
  48. }
  49. .fn-gantt .leftPanel .desc {
  50. width: 115px;
  51. }
  52. .fn-gantt .spacer
  53. {
  54. margin: -2px 0 1px 0;
  55. border-bottom: 1px solid #DDD;
  56. background-color: #f6f6f6;
  57. }
  58. /* right panel */
  59. .fn-gantt .rightPanel {
  60. float: left;
  61. width: 349px;
  62. overflow: hidden;
  63. }
  64. .fn-gantt .day {
  65. overflow: visible;
  66. width: 24px;
  67. line-height: 24px;
  68. text-align: center;
  69. border-left: 1px solid #DDD;
  70. border-bottom: 1px solid #DDD;
  71. margin: -1px 0 0 -1px;
  72. }
  73. .fn-gantt .hollyday {
  74. background-color: #f9e5e2;
  75. }
  76. .fn-gantt .today {
  77. background-color: #e2ebff;
  78. }
  79. .fn-gantt .sa, .fn-gantt .sn, .fn-gantt .wd {
  80. height: 23px;
  81. margin: 0 0 0 -1px;
  82. }
  83. .fn-gantt .sa {
  84. background-color: #dfdfdf;
  85. }
  86. .fn-gantt .sn {
  87. background-color: #dedede;
  88. }
  89. .fn-gantt .wd {
  90. background-color: #f6f6f6;
  91. }
  92. .fn-gantt .rightPanel .month, .fn-gantt .rightPanel .year {
  93. float: left;
  94. overflow: hidden;
  95. border-left: 1px solid #DDD;
  96. border-bottom: 1px solid #DDD;
  97. height: 23px;
  98. margin: 0 0 0 -1px;
  99. background-color: #f6f6f6;
  100. }
  101. .fn-gantt-hint {
  102. border: 5px solid #edc332;
  103. background-color: #fff5d4;
  104. -webkit-border-radius: 4px;
  105. -moz-border-radius: 4px;
  106. border-radius: 4px;
  107. padding: 10px;
  108. position: absolute;
  109. display: none;
  110. z-index: 10001;
  111. }
  112. .fn-gantt .bar {
  113. border: none;
  114. -webkit-border-radius: 3px;
  115. -moz-border-radius: 3px;
  116. border-radius: 3px;
  117. background-color: #89c5f8;
  118. height: 18px;
  119. margin: 4px 3px 3px 3px;
  120. position: relative;
  121. z-index: 10000;
  122. }
  123. .fn-gantt .ganttRed {
  124. background-color: #8F0000;
  125. }
  126. .fn-gantt .ganttGreen {
  127. background-color: #b3cf6f;
  128. }
  129. .fn-gantt .ganttOrange {
  130. background-color: #ff7e24;
  131. }
  132. /* bottom (navigation) */
  133. .fn-gantt .bottom {
  134. clear: both;
  135. background-color: #f6f6f6;
  136. width: 100%;
  137. }
  138. .fn-gantt .navigate {
  139. text-align: center;
  140. }
  141. .fn-gantt .navigate .page-number {
  142. display: inline-block;
  143. font-size: 10px;
  144. height: 20px;
  145. }
  146. .fn-gantt .navigate .page-number span {
  147. color: #666666;
  148. margin: 5px;
  149. position: relative;
  150. top: 13px;
  151. }
  152. .fn-gantt .navigate a:link, .fn-gantt .navigate a:visited, .fn-gantt .navigate a:active {
  153. text-decoration: none;
  154. }
  155. .fn-gantt .nav-link {
  156. margin: 0px 0px 8px 0px;
  157. display: inline-block;
  158. width: 20px;
  159. height: 20px;
  160. font-size: 0px;
  161. }
  162. .fn-gantt .navigate .nav-page-back {
  163. background-image: url(img/buttons.png);
  164. background-position: 0 0;
  165. }
  166. .fn-gantt .navigate .nav-page-next {
  167. background-image: url(img/buttons.png);
  168. background-position: -50px 0;
  169. margin-right: 15px;
  170. }
  171. .fn-gantt .navigate .nav-page-back:hover {
  172. background-position: 0 -20px;
  173. }
  174. .fn-gantt .navigate .nav-page-next:hover {
  175. background-position: -50px -20px;
  176. }
  177. .fn-gantt .navigate .nav-begin {
  178. background-image: url(img/buttons.png);
  179. background-position: -70px 0;
  180. }
  181. .fn-gantt .navigate .nav-prev-week {
  182. background-image: url(img/buttons.png);
  183. background-position: -90px 0;
  184. }
  185. .fn-gantt .navigate .nav-prev-day {
  186. background-image: url(img/buttons.png);
  187. background-position: -110px 0;
  188. }
  189. .fn-gantt .navigate .nav-next-day {
  190. background-image: url(img/buttons.png);
  191. background-position: -130px 0;
  192. }
  193. .fn-gantt .navigate .nav-next-week {
  194. background-image: url(img/buttons.png);
  195. background-position: -150px 0;
  196. }
  197. .fn-gantt .navigate .nav-end {
  198. background-image: url(img/buttons.png);
  199. background-position: -170px 0;
  200. }
  201. .fn-gantt .navigate .nav-begin:hover {
  202. background-position: -70px -20px;
  203. }
  204. .fn-gantt .navigate .nav-prev-week:hover {
  205. background-position: -90px -20px;
  206. }
  207. .fn-gantt .navigate .nav-prev-day:hover {
  208. background-position: -110px -20px;
  209. }
  210. .fn-gantt .navigate .nav-next-day:hover {
  211. background-position: -130px -20px;
  212. }
  213. .fn-gantt .navigate .nav-next-week:hover {
  214. background-position: -150px -20px;
  215. }
  216. .fn-gantt .navigate .nav-end:hover {
  217. background-position: -170px -20px;
  218. }