@worktile/gantt 20.0.2 → 21.0.0-next.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -113,6 +113,7 @@ $gantt-bar-link-drop-border: 5px;
113
113
  border-radius: 4px;
114
114
  z-index: 2;
115
115
  background: variables.$gantt-bar-bg;
116
+ height: variables.$gantt-bar-height;
116
117
 
117
118
  .gantt-bar-layer {
118
119
  width: calc(100% + #{$gantt-bar-layer-append-width});
@@ -134,7 +135,7 @@ $gantt-bar-link-drop-border: 5px;
134
135
  left: $gantt-bar-link-drop-border * -1;
135
136
  top: $gantt-bar-link-drop-border * -1;
136
137
  display: none;
137
- background: #fff;
138
+ background: variables.$color-background;
138
139
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
139
140
  }
140
141
 
@@ -43,6 +43,7 @@
43
43
  .gantt-calendar-header {
44
44
  position: relative;
45
45
  z-index: 2;
46
+ height: variables.$gantt-header-height;
46
47
  .gantt-calendar-today-overlay {
47
48
  z-index: 2;
48
49
  }
@@ -86,7 +87,7 @@
86
87
 
87
88
  .secondary-line {
88
89
  stroke-dasharray: 2px 5px;
89
- stroke: #cacaca;
90
+ stroke: variables.$color-gray-600;
90
91
  }
91
92
 
92
93
  .secondary-backdrop {
@@ -17,6 +17,7 @@
17
17
  height: 100%;
18
18
  display: none;
19
19
  background: rgba($color: variables.$gantt-item-drag-mask-color, $alpha: 0.05);
20
+ top: variables.$gantt-header-height;
20
21
 
21
22
  .date-range {
22
23
  width: 100%;
@@ -25,7 +26,7 @@
25
26
  background: variables.$gantt-item-drag-mask-color;
26
27
  line-height: 23px;
27
28
  border-radius: 4px;
28
- color: #fff;
29
+ color: variables.$color-text-inverse;
29
30
  position: absolute;
30
31
  display: flex;
31
32
  justify-content: space-between;
@@ -1,10 +1,12 @@
1
+ @use '../../styles/variables';
2
+
1
3
  .gantt-range {
2
4
  position: absolute;
3
5
  z-index: 2;
4
6
  .gantt-range-main {
5
7
  height: 10px;
6
- background: #dfdfdf;
7
- border: 1px solid #888;
8
+ background: variables.$color-gray-500; // TODO: 待提取基础变量
9
+ border: 1px solid #888; // TODO: 待提取基础变量
8
10
  border-radius: 4px 4px 0 0;
9
11
  box-sizing: border-box;
10
12
  position: relative;
@@ -13,13 +15,13 @@
13
15
  left: 0;
14
16
  top: 0;
15
17
  height: 100%;
16
- background: #888;
18
+ background: #888; // TODO: 待提取基础变量
17
19
  }
18
20
  }
19
21
  .gantt-range-triangle {
20
22
  width: 0;
21
23
  height: 0;
22
- border-top: 7px solid #888;
24
+ border-top: 7px solid #888; // TODO: 待提取基础变量
23
25
  position: absolute;
24
26
  top: 10px;
25
27
 
@@ -88,7 +88,7 @@
88
88
  .gantt-expand-icon {
89
89
  display: inline-block;
90
90
  width: 20px;
91
- color: #aaa;
91
+ color: variables.$color-text-light;
92
92
  }
93
93
 
94
94
  .gantt-drag-handle {
@@ -177,8 +177,10 @@
177
177
  }
178
178
 
179
179
  .gantt-table-header {
180
+ height: variables.$gantt-header-height;
181
+ line-height: variables.$gantt-header-height;
180
182
  text-align: center;
181
- background: #fff;
183
+ background: variables.$color-background;
182
184
  box-shadow: variables.$gantt-side-shadow;
183
185
  position: relative;
184
186
  z-index: 3;
@@ -210,6 +212,7 @@
210
212
  flex: 1;
211
213
  .gantt-table-group {
212
214
  display: flex;
215
+ height: variables.$gantt-row-height;
213
216
  background: variables.$gantt-group-background-color;
214
217
  padding: 0 10px;
215
218
  align-items: center;
@@ -221,20 +224,22 @@
221
224
  cursor: pointer;
222
225
 
223
226
  .expand-icon {
224
- color: #aaa;
227
+ color: variables.$color-text-light;
225
228
  margin-right: 6px;
226
229
  }
227
230
  }
228
231
  }
229
232
 
230
233
  .gantt-table-item {
234
+ height: variables.$gantt-row-height;
235
+ line-height: variables.$gantt-row-height;
231
236
  @include gantt-table-item();
232
237
  }
233
238
 
234
239
  .gantt-expand-icon {
235
240
  display: inline-block;
236
241
  width: 20px;
237
- color: #aaa;
242
+ color: variables.$color-text-light;
238
243
  }
239
244
  }
240
245
 
@@ -255,7 +260,7 @@
255
260
  }
256
261
  }
257
262
  .empty-text {
258
- color: #cacaca;
263
+ color: variables.$color-gray-600;
259
264
  }
260
265
  }
261
266
  }
@@ -1,7 +1,7 @@
1
1
  @use '../../styles/variables.scss';
2
2
  .gantt-toolbar {
3
3
  position: absolute;
4
- top: 60px;
4
+ top: calc(#{variables.$gantt-header-height} + 16px);
5
5
  right: 20px;
6
6
  z-index: 1000;
7
7
  .toolbar-views {
@@ -10,10 +10,10 @@
10
10
  padding: 0 15px;
11
11
  cursor: pointer;
12
12
  flex: 0 1 auto;
13
- border: 1px solid #ddd;
13
+ border: 1px solid variables.$color-gray-500;
14
14
  margin-left: -1px;
15
15
  position: relative;
16
- background-color: #ffffff;
16
+ background-color: variables.$color-background;
17
17
  &.active {
18
18
  color: variables.$gantt-toolbar-view-active-color;
19
19
  border-color: variables.$gantt-toolbar-view-active-color;