@jiaozhiye/qm-design-react 1.11.3 → 1.11.4

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.
Files changed (7) hide show
  1. package/lib/index.esm.js +1 -1
  2. package/lib/index.full.js +1 -1
  3. package/lib/index.js +1 -1
  4. package/lib/pivot-grid/style/grid-layout.less +240 -239
  5. package/lib/style/index.css +1 -0
  6. package/lib/style/index.min.css +1 -1
  7. package/package.json +1 -1
package/lib/pivot-grid/style/grid-layout.less CHANGED
@@ -1,239 +1,240 @@
1
- /*
2
- * @Author: 焦质晔
3
- * @Date: 2022-03-16 19:05:30
4
- * @Last Modified by: 焦质晔
5
- * @Last Modified time: 2024-12-02 20:51:13
6
- */
7
- @import '../../style/common';
8
-
9
- .@{prefix-pivot-grid}__layout {
10
- .reset-container();
11
- height: 100%;
12
- .header,
13
- .footer {
14
- border: 1px solid @--border-color-secondary;
15
- .table {
16
- table-layout: fixed;
17
- display: contents;
18
- thead th,
19
- tfoot td {
20
- text-align: left;
21
- font-weight: normal;
22
- border-right: 1px solid @--border-color-secondary;
23
- position: relative;
24
- &.selection-column {
25
- text-align: center;
26
- justify-content: center;
27
- border-right-color: transparent;
28
- }
29
- }
30
- }
31
- }
32
- .header {
33
- position: sticky;
34
- top: 0;
35
- z-index: 2;
36
- .resize-bar {
37
- position: absolute;
38
- top: 0;
39
- bottom: 0;
40
- right: -3px;
41
- width: 6px;
42
- z-index: 2;
43
- cursor: col-resize;
44
- }
45
- }
46
- .body {
47
- min-height: fit-content;
48
- .group-card {
49
- margin: 15px 0;
50
- background-color: #fff;
51
- border: 1px solid @--border-color-secondary;
52
- &.inner {
53
- margin: 0 12px 12px;
54
- }
55
- &:has(.inner) > .label-row > .label-cell {
56
- border-bottom: 0;
57
- }
58
- .label-row {
59
- display: flex;
60
- align-items: center;
61
- .label-cell {
62
- align-self: stretch;
63
- display: inline-flex;
64
- align-items: center;
65
- background-color: #fff;
66
- border-bottom: 1px solid @--border-color-secondary;
67
- &.expandable-column {
68
- justify-content: center;
69
- .button-icon {
70
- & > .anticon {
71
- transition: transform 0.3s ease;
72
- }
73
- &.expand > .anticon {
74
- transform: rotate(90deg);
75
- }
76
- }
77
- }
78
- &.col--fix-left {
79
- position: sticky;
80
- z-index: 1;
81
- }
82
- .title {
83
- flex-shrink: 0;
84
- margin-right: 20px;
85
- }
86
- }
87
- }
88
- .grid-list {
89
- margin: 0;
90
- border: 0;
91
- background: transparent;
92
- }
93
- }
94
- .grid-list {
95
- margin: 15px 0;
96
- border: 1px solid @--border-color-secondary;
97
- .table-row {
98
- display: flex;
99
- align-items: center;
100
- &:hover {
101
- .table-cell {
102
- background-color: @--background-color-light;
103
- .order {
104
- display: none;
105
- }
106
- .checkbox {
107
- display: inline-flex;
108
- }
109
- }
110
- }
111
- &.row--selection {
112
- background-color: @--primary-1;
113
- .table-cell {
114
- .order {
115
- display: none;
116
- }
117
- .checkbox {
118
- display: inline-flex;
119
- }
120
- }
121
- }
122
- .table-cell {
123
- align-self: stretch; // 子元素高度和父元素一致
124
- display: inline-flex;
125
- align-items: center;
126
- border-bottom: 1px solid @--border-color-secondary;
127
- }
128
- }
129
- }
130
- }
131
- .footer {
132
- position: sticky;
133
- bottom: 0;
134
- z-index: 2;
135
- }
136
- .header,
137
- .body,
138
- .footer {
139
- .table-cell {
140
- background-color: #fff;
141
- border-right: 1px solid @--border-color-secondary;
142
- &:last-child {
143
- border-right: 0;
144
- }
145
- &.selection-column {
146
- justify-content: center;
147
- border-right-color: transparent;
148
- }
149
- .order {
150
- display: inline-block;
151
- }
152
- .checkbox {
153
- display: none;
154
- }
155
- &.col--center {
156
- text-align: center !important;
157
- justify-content: center;
158
- }
159
- &.col--right {
160
- text-align: right !important;
161
- justify-content: flex-end;
162
- }
163
- &.col--fix-left {
164
- position: sticky;
165
- z-index: 1;
166
- }
167
- .cell {
168
- .text-overflow-cut();
169
- padding: 0 @--padding-sm;
170
- }
171
- }
172
- .label-cell,
173
- .table-cell {
174
- &:hover {
175
- .count-select {
176
- visibility: visible;
177
- }
178
- }
179
- }
180
- .count-select {
181
- .text-overflow-cut();
182
- display: inline-flex;
183
- align-items: center;
184
- justify-content: flex-end;
185
- height: 100%;
186
- width: 100%;
187
- padding: 0 @--padding-sm;
188
- color: @--text-color-placeholder;
189
- cursor: pointer;
190
- visibility: hidden;
191
- &:hover,
192
- &.ant-dropdown-open {
193
- visibility: visible;
194
- background-color: @--background-color-light;
195
- }
196
- &.show {
197
- visibility: visible;
198
- }
199
- .icon {
200
- margin-left: 4px;
201
- }
202
- }
203
- }
204
- .resize-line {
205
- position: absolute;
206
- left: -2px;
207
- top: 0;
208
- width: 2px;
209
- height: 100%;
210
- background-color: @--primary-color;
211
- cursor: col-resize;
212
- z-index: 2;
213
- }
214
- // size
215
- &.small {
216
- .header .table th,
217
- .footer .table td,
218
- .body .grid-list > li,
219
- .body .group-card > li {
220
- height: 26px;
221
- }
222
- }
223
- &.middle {
224
- .header .table th,
225
- .footer .table td,
226
- .body .grid-list > li,
227
- .body .group-card > li {
228
- height: 34px;
229
- }
230
- }
231
- &.large {
232
- .header .table th,
233
- .footer .table td,
234
- .body .grid-list > li,
235
- .body .group-card > li {
236
- height: 42px;
237
- }
238
- }
239
- }
1
+ /*
2
+ * @Author: 焦质晔
3
+ * @Date: 2022-03-16 19:05:30
4
+ * @Last Modified by: 焦质晔
5
+ * @Last Modified time: 2024-12-02 20:51:13
6
+ */
7
+ @import '../../style/common';
8
+
9
+ .@{prefix-pivot-grid}__layout {
10
+ .reset-container();
11
+ height: 100%;
12
+ .header,
13
+ .footer {
14
+ border: 1px solid @--border-color-secondary;
15
+ .table {
16
+ table-layout: fixed;
17
+ display: contents;
18
+ thead th,
19
+ tfoot td {
20
+ text-align: left;
21
+ font-weight: normal;
22
+ border-right: 1px solid @--border-color-secondary;
23
+ position: relative;
24
+ &.selection-column {
25
+ text-align: center;
26
+ justify-content: center;
27
+ border-right-color: transparent;
28
+ }
29
+ }
30
+ }
31
+ }
32
+ .header {
33
+ position: sticky;
34
+ top: 0;
35
+ z-index: 2;
36
+ .resize-bar {
37
+ position: absolute;
38
+ top: 0;
39
+ bottom: 0;
40
+ right: -3px;
41
+ width: 6px;
42
+ z-index: 2;
43
+ cursor: col-resize;
44
+ }
45
+ }
46
+ .body {
47
+ min-height: fit-content;
48
+ .group-card {
49
+ margin: 15px 0;
50
+ background-color: #fff;
51
+ border: 1px solid @--border-color-secondary;
52
+ &.inner {
53
+ margin: 0 12px 12px;
54
+ }
55
+ &:has(.inner) > .label-row > .label-cell {
56
+ border-bottom: 0;
57
+ }
58
+ .label-row {
59
+ display: flex;
60
+ align-items: center;
61
+ .label-cell {
62
+ align-self: stretch;
63
+ display: inline-flex;
64
+ align-items: center;
65
+ background-color: #fff;
66
+ border-bottom: 1px solid @--border-color-secondary;
67
+ &.expandable-column {
68
+ justify-content: center;
69
+ .button-icon {
70
+ & > .anticon {
71
+ transition: transform 0.3s ease;
72
+ }
73
+ &.expand > .anticon {
74
+ transform: rotate(90deg);
75
+ }
76
+ }
77
+ }
78
+ &.col--fix-left {
79
+ position: sticky;
80
+ z-index: 1;
81
+ }
82
+ .title {
83
+ flex-shrink: 0;
84
+ margin-right: 20px;
85
+ font-weight: 700;
86
+ }
87
+ }
88
+ }
89
+ .grid-list {
90
+ margin: 0;
91
+ border: 0;
92
+ background: transparent;
93
+ }
94
+ }
95
+ .grid-list {
96
+ margin: 15px 0;
97
+ border: 1px solid @--border-color-secondary;
98
+ .table-row {
99
+ display: flex;
100
+ align-items: center;
101
+ &:hover {
102
+ .table-cell {
103
+ background-color: @--background-color-light;
104
+ .order {
105
+ display: none;
106
+ }
107
+ .checkbox {
108
+ display: inline-flex;
109
+ }
110
+ }
111
+ }
112
+ &.row--selection {
113
+ background-color: @--primary-1;
114
+ .table-cell {
115
+ .order {
116
+ display: none;
117
+ }
118
+ .checkbox {
119
+ display: inline-flex;
120
+ }
121
+ }
122
+ }
123
+ .table-cell {
124
+ align-self: stretch; // 子元素高度和父元素一致
125
+ display: inline-flex;
126
+ align-items: center;
127
+ border-bottom: 1px solid @--border-color-secondary;
128
+ }
129
+ }
130
+ }
131
+ }
132
+ .footer {
133
+ position: sticky;
134
+ bottom: 0;
135
+ z-index: 2;
136
+ }
137
+ .header,
138
+ .body,
139
+ .footer {
140
+ .table-cell {
141
+ background-color: #fff;
142
+ border-right: 1px solid @--border-color-secondary;
143
+ &:last-child {
144
+ border-right: 0;
145
+ }
146
+ &.selection-column {
147
+ justify-content: center;
148
+ border-right-color: transparent;
149
+ }
150
+ .order {
151
+ display: inline-block;
152
+ }
153
+ .checkbox {
154
+ display: none;
155
+ }
156
+ &.col--center {
157
+ text-align: center !important;
158
+ justify-content: center;
159
+ }
160
+ &.col--right {
161
+ text-align: right !important;
162
+ justify-content: flex-end;
163
+ }
164
+ &.col--fix-left {
165
+ position: sticky;
166
+ z-index: 1;
167
+ }
168
+ .cell {
169
+ .text-overflow-cut();
170
+ padding: 0 @--padding-sm;
171
+ }
172
+ }
173
+ .label-cell,
174
+ .table-cell {
175
+ &:hover {
176
+ .count-select {
177
+ visibility: visible;
178
+ }
179
+ }
180
+ }
181
+ .count-select {
182
+ .text-overflow-cut();
183
+ display: inline-flex;
184
+ align-items: center;
185
+ justify-content: flex-end;
186
+ height: 100%;
187
+ width: 100%;
188
+ padding: 0 @--padding-sm;
189
+ color: @--text-color-placeholder;
190
+ cursor: pointer;
191
+ visibility: hidden;
192
+ &:hover,
193
+ &.ant-dropdown-open {
194
+ visibility: visible;
195
+ background-color: @--background-color-light;
196
+ }
197
+ &.show {
198
+ visibility: visible;
199
+ }
200
+ .icon {
201
+ margin-left: 4px;
202
+ }
203
+ }
204
+ }
205
+ .resize-line {
206
+ position: absolute;
207
+ left: -2px;
208
+ top: 0;
209
+ width: 2px;
210
+ height: 100%;
211
+ background-color: @--primary-color;
212
+ cursor: col-resize;
213
+ z-index: 2;
214
+ }
215
+ // size
216
+ &.small {
217
+ .header .table th,
218
+ .footer .table td,
219
+ .body .grid-list > li,
220
+ .body .group-card > li {
221
+ height: 26px;
222
+ }
223
+ }
224
+ &.middle {
225
+ .header .table th,
226
+ .footer .table td,
227
+ .body .grid-list > li,
228
+ .body .group-card > li {
229
+ height: 34px;
230
+ }
231
+ }
232
+ &.large {
233
+ .header .table th,
234
+ .footer .table td,
235
+ .body .grid-list > li,
236
+ .body .group-card > li {
237
+ height: 42px;
238
+ }
239
+ }
240
+ }
package/lib/style/index.css CHANGED
@@ -31232,6 +31232,7 @@ body {
31232
31232
  .qm-pivot-grid__layout .body .group-card .label-row .label-cell .title {
31233
31233
  flex-shrink: 0;
31234
31234
  margin-right: 20px;
31235
+ font-weight: 700;
31235
31236
  }
31236
31237
  .qm-pivot-grid__layout .body .group-card .grid-list {
31237
31238
  margin: 0;