halleyx-ui-framework 4.4.6 → 4.4.7

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.
@@ -1,4 +1,4 @@
1
- .custom-dropdown {
1
+ .custom-dropdown1 {
2
2
  width: 100%;
3
3
  height: 37px;
4
4
  position: relative;
@@ -49,13 +49,13 @@
49
49
  border: none;
50
50
  font-size: 14px;
51
51
  cursor: pointer;
52
- padding: 10px 12px;
52
+ padding: 10px 0px;
53
53
  padding-right: 0px;
54
54
  border-top-left-radius: 4px;
55
55
  border-bottom-left-radius: 4px;
56
56
  }
57
57
  i {
58
- height: 35px;
58
+ height: 30px;
59
59
  // width:5%;
60
60
  padding-right: 7px;
61
61
  display: flex;
@@ -87,7 +87,7 @@
87
87
  font-size: 14px;
88
88
  cursor: pointer;
89
89
  }
90
- .custom-dropdown-whole-container{
90
+ .custom-dropdown1-whole-container{
91
91
  position: absolute;
92
92
  width: 100%;
93
93
  border: none !important;
@@ -101,8 +101,8 @@
101
101
  font-family: var(--hlx-font-type-content);
102
102
  z-index: 100000000;
103
103
 
104
- .customdropdown-option-container {
105
- width: 100%;
104
+ .customdropdown-option-container1 {
105
+ width: 100%;
106
106
  overflow-y: auto;
107
107
  overflow-x: hidden;
108
108
  height: auto;
@@ -113,7 +113,7 @@
113
113
  border: 1px solid #d8d8d8;
114
114
  border-radius: 5px;
115
115
  }
116
- .fixed-footer{
116
+ .fixed-footer1{
117
117
  height:35px;
118
118
  width:100%;
119
119
  border-top: 1px solid var(--hlx-border-color);
@@ -122,14 +122,15 @@
122
122
  display: flex;
123
123
  }
124
124
  }
125
- .no-data-option {
125
+ .no-data-option1 {
126
126
  display: flex;
127
127
  justify-content: center;
128
128
  align-items: center;
129
129
  height: 30px;
130
130
  font-size: 14px;
131
+ width:100%;
131
132
  }
132
- .option {
133
+ .option1 {
133
134
  font-family: var(--hlx-font-type-content);
134
135
  width: 100%;
135
136
  height: 30px;
@@ -141,7 +142,7 @@
141
142
  color: white;
142
143
  background-color: var(--hlx-color-primary-light);
143
144
  }
144
- .option-value {
145
+ .option-value1 {
145
146
  font-family: var(--hlx-font-type-content);
146
147
  margin: 0;
147
148
  padding-top: 4px;
@@ -1,12 +1,77 @@
1
+ .crud-container {
2
+ width: 100px;
3
+ height: 100%;
4
+ .crud-container-margin {
5
+ margin-top: 61px;
6
+
7
+ .crud-item {
8
+ height: 41px;
9
+ display: flex;
10
+ justify-content: center;
11
+ align-items: center;
12
+
13
+ .add {
14
+ border-radius: 20px;
15
+ height: 20px;
16
+ width: 20px;
17
+ border: 1px solid #54bd95;
18
+ color: #54bd95;
19
+ cursor: pointer;
20
+ margin-right: 10px;
21
+ align-items: center;
22
+ justify-content: center;
23
+ display: flex;
24
+ }
25
+ .delete {
26
+ height: 20px;
27
+ width: 20px;
28
+ color: #ff5050;
29
+ font-size: 20px;
30
+ margin-bottom: 4px;
31
+ i {
32
+ cursor: pointer;
33
+ }
34
+ }
35
+ }
36
+ }
37
+ }
1
38
  .grid-table-component {
2
- .hlxTableV2
3
- {
39
+ width: calc(100% - 100px);
40
+ .hlxTableV2 {
4
41
  overflow-y: hidden !important;
5
42
  }
6
43
  th {
7
44
  padding-right: 0px !important;
8
45
  }
9
- .add-column-left, .add-column-right {
46
+ td {
47
+ padding: 0px !important;
48
+ }
49
+ .columndrag {
50
+ height: 16px;
51
+ width: 40px;
52
+ background: white;
53
+ border: 1px solid #dad1d1;
54
+ position: fixed;
55
+ border-radius: 16px;
56
+ cursor: -webkit-grab;
57
+ cursor: grab;
58
+ display: none;
59
+ flex-direction: column;
60
+
61
+ .rotate {
62
+ transform: rotate(90deg);
63
+ }
64
+ }
65
+ .drag-icon-vertical {
66
+ cursor: pointer;
67
+ }
68
+ .column-drag-container {
69
+ position: relative;
70
+ height: 100%;
71
+ }
72
+
73
+ .add-column-left,
74
+ .add-column-right {
10
75
  height: 60px;
11
76
  top: 0;
12
77
  width: 5px;
@@ -15,17 +80,17 @@
15
80
 
16
81
  .add-column-icon {
17
82
  position: fixed;
18
- width: 20px;
19
- display: none;
20
- // top: 42px;
21
- // right: 425px;
22
- background-color: #54bd95;
23
- z-index: 10000;
24
- border-radius: 100px;
25
- height: 20px;
26
- align-items: center;
27
- justify-content: center;
28
- color: white;
83
+ width: 20px;
84
+ display: none;
85
+ // top: 42px;
86
+ // right: 425px;
87
+ background-color: #54bd95;
88
+ z-index: 10000;
89
+ border-radius: 100px;
90
+ height: 20px;
91
+ align-items: center;
92
+ justify-content: center;
93
+ color: white;
29
94
  }
30
95
  }
31
96
  .add-column-left {
@@ -51,4 +116,139 @@
51
116
  font-size: 12px;
52
117
  }
53
118
  }
119
+
120
+ .rowdraggable-icon {
121
+ height: 25px;
122
+ width: 14px;
123
+ background: white;
124
+ display: none;
125
+ border: 1px solid #dad1d1;
126
+ position: absolute;
127
+ left: 18px;
128
+ margin-top: 7px;
129
+ border-radius: 16px;
130
+ cursor: -webkit-grab;
131
+ cursor: grab;
132
+ }
133
+
134
+ .row-drag-icon-container {
135
+ display: flex;
136
+ width: 100%;
137
+ justify-content: center;
138
+ align-items: center;
139
+ }
140
+ .row-cell {
141
+ display: flex;
142
+ }
143
+ .input-row-dropdown-container {
144
+ width: 50%;
145
+ padding: 0 10px;
146
+ }
147
+ .input-row-input-container {
148
+ border-left: 1px solid #d8d8d8;
149
+ width: 50%;
150
+ box-sizing: border-box;
151
+
152
+ .manual-string,
153
+ .manual-number {
154
+ height: 40px;
155
+ border: 1px solid transparent;
156
+ box-sizing: border-box;
157
+ padding: 0 10px;
158
+ align-items: center;
159
+ display: flex;
160
+ justify-content: center;
161
+ .input-text,
162
+ .input-number {
163
+ border: none;
164
+ outline: none;
165
+ font-size: 14px;
166
+ height: 20px;
167
+ font-family: OpenSans;
168
+ width: 100%;
169
+ }
170
+ }
171
+
172
+ .manual-between {
173
+ height: 40px;
174
+ box-sizing: border-box;
175
+ align-items: center;
176
+ display: flex;
177
+ justify-content: center;
178
+ .left-between {
179
+ height: 40px;
180
+ padding: 5px;
181
+ display: flex;
182
+ align-items: center;
183
+ justify-content: center;
184
+ .left-between-input {
185
+ border: none;
186
+ outline: none;
187
+ font-size: 14px;
188
+ height: 20px;
189
+ font-family: OpenSans;
190
+ width: 100%;
191
+ }
192
+ }
193
+ .between-seperator {
194
+ height: 40px;
195
+ border-right: 1px solid #d8d8d8;
196
+ }
197
+ .right-between {
198
+ height: 40px;
199
+ padding: 5px;
200
+ display: flex;
201
+ align-items: center;
202
+ justify-content: center;
203
+ .right-between-input {
204
+ border: none;
205
+ outline: none;
206
+ font-size: 14px;
207
+ height: 20px;
208
+ font-family: OpenSans;
209
+ width: 100%;
210
+ }
211
+ }
212
+ }
213
+
214
+ .manual-boolean {
215
+ height: 40px;
216
+ border: 1px solid transparent;
217
+ box-sizing: border-box;
218
+ padding: 0 10px;
219
+ align-items: center;
220
+ display: flex;
221
+ justify-content: center;
222
+ }
223
+ }
224
+ .output-cell-container {
225
+ width: 100%;
226
+ align-items: center;
227
+ display: flex;
228
+
229
+ .output-manual-string,
230
+ .output-manual-number,
231
+ .output-manual-boolean,
232
+ .output-ref,
233
+ .output-computed {
234
+ width: 100%;
235
+ height: 40px;
236
+ border: 1px solid transparent;
237
+ box-sizing: border-box;
238
+ padding: 0 10px;
239
+ align-items: center;
240
+ display: flex;
241
+ justify-content: center;
242
+
243
+ .string-input,
244
+ .number-output {
245
+ border: none;
246
+ outline: none;
247
+ font-size: 14px;
248
+ height: 20px;
249
+ font-family: OpenSans;
250
+ width: 100%;
251
+ }
252
+ }
253
+ }
54
254
  }
@@ -43,7 +43,7 @@
43
43
  display: flex;
44
44
  margin-left: 11px;
45
45
  }
46
- .icon-times-regular {
46
+ .close-icon {
47
47
  font-size: 1.5rem;
48
48
  text-align: end;
49
49
  color: #a6a6a6;
@@ -16,9 +16,9 @@
16
16
  align-items: center;
17
17
  cursor: pointer;
18
18
  position: relative;
19
- &:hover {
19
+ &:hover{
20
20
  .title-name {
21
- color: var(--hlx-color-primary);
21
+ color: var(--hlx-color-primary) !important;
22
22
  }
23
23
  border: 1px solid var(--hlx-color-primary);
24
24
  }
@@ -35,7 +35,7 @@
35
35
  }
36
36
  .hlx-select-input {
37
37
  border: none;
38
- width: 95%;
38
+ width: 100%;
39
39
  min-width: 25px;
40
40
  text-align: left;
41
41
  white-space: nowrap;
@@ -60,6 +60,7 @@
60
60
  // width:18px;
61
61
  display: flex;
62
62
  // width:5%;
63
+ width:30px;
63
64
  padding-right: 7px;
64
65
  // flex-direction: column;
65
66
  justify-content: center;
@@ -93,13 +94,13 @@
93
94
  }
94
95
  .title-name {
95
96
  position: absolute;
96
- top: -12px;
97
+ top: -9px;
97
98
  background: white;
98
99
  font-size: 12px;
99
100
  left: 6px;
100
- margin: 0 5px 0 5px;
101
+ // margin: 0 5px 0 5px;
101
102
  padding: 0 5px 0 5px;
102
- color: #a6a6a6;
103
+ // color: #a6a6a6;
103
104
  .asterik {
104
105
  color: var(--hlx-color-error);
105
106
  margin-left: 3px;
@@ -439,7 +440,7 @@
439
440
  display: flex;
440
441
  flex-direction: row;
441
442
  justify-content: flex-start;
442
- border: 1px solid var(--hlx-color-primary-dark);
443
+ border: 1px solid var(--hlx-color-primary);
443
444
  border-radius: 5px;
444
445
  height: 36px;
445
446
  // width:100%;
@@ -447,10 +448,22 @@
447
448
  align-items: center;
448
449
  cursor: pointer;
449
450
  position: relative;
451
+ .title-name{
452
+ color: var(--hlx-color-primary) !important;
453
+ }
454
+ }
455
+ .hlx-select-container .change-color{
456
+ .title-name{
457
+ color: var(--hlx-color-primary);
458
+
459
+ }
450
460
  }
451
461
 
452
462
  .add-style {
453
- border-color: var(--hlx-color-primary-dark);
463
+ border-color: var(--hlx-color-primary) !important;
464
+ .cutom-multi-select-title{
465
+ color: var(--hlx-color-primary) !important;
466
+ }
454
467
  }
455
468
  .color-icon {
456
469
  color: var(--hlx-color-primary-dark);
@@ -458,7 +471,7 @@
458
471
 
459
472
  .hlx-select-input-placeholder {
460
473
  border: none;
461
- width: 95%;
474
+ width: 100%;
462
475
  text-align: left;
463
476
  // padding-left: 10px;
464
477
  outline: none;
@@ -472,6 +485,10 @@
472
485
  border-bottom-left-radius: 4px;
473
486
  height: 34px;
474
487
  padding: 8px 12px;
488
+ .asterik{
489
+ color: var(--hlx-color-error);
490
+ // margin-left: 3px;
491
+ }
475
492
  }
476
493
 
477
494
  // .icon-cross-bg{
@@ -650,7 +667,7 @@ button {
650
667
  &:hover {
651
668
  border: 1px solid var(--hlx-color-primary);
652
669
  .custom-label {
653
- color: var(--hlx-color-primary);
670
+ color: var(--hlx-color-primary) !important;
654
671
  }
655
672
  }
656
673
  .customerror {
@@ -661,7 +678,7 @@ button {
661
678
  left: 1px;
662
679
  }
663
680
  .custom-placeholder {
664
- width: 95%;
681
+ width: 100%;
665
682
  height: 35px;
666
683
  align-items: center;
667
684
  display: flex;
@@ -675,7 +692,7 @@ button {
675
692
  cursor: pointer;
676
693
  }
677
694
  &-input {
678
- width: 95%;
695
+ width: 100%;
679
696
  height: 35px;
680
697
  text-align: left;
681
698
  white-space: nowrap;
@@ -690,8 +707,9 @@ button {
690
707
  border-bottom-left-radius: 4px;
691
708
  }
692
709
  i {
693
- height: 35px;
710
+ height: 30px;
694
711
  // width:5%;
712
+ width:30px;
695
713
  padding-right: 7px;
696
714
  display: flex;
697
715
  align-items: center;
@@ -699,7 +717,7 @@ button {
699
717
  border-bottom-right-radius: 4px;
700
718
  }
701
719
  .custom-label-input {
702
- width: 95%;
720
+ width: 100%;
703
721
  height: 35px;
704
722
  text-align: left;
705
723
  display: flex;
@@ -739,7 +757,7 @@ button {
739
757
  width:100%;
740
758
  overflow-y: auto;
741
759
  overflow-x: hidden;
742
- height:160px;
760
+ max-height:160px;
743
761
  }
744
762
  .fixed-footer{
745
763
  height:35px;
@@ -787,17 +805,21 @@ button {
787
805
 
788
806
  .selecteddropdown {
789
807
  // color:
790
- border-color: var(--hlx-color-primary-dark);
808
+ border-color: var(--hlx-color-primary);
809
+ .custom-label{
810
+ color: var(--hlx-color-primary) !important;
811
+ }
791
812
  }
792
813
 
793
814
  .custom-label {
794
815
  position: absolute;
795
816
  top: -10px;
796
- left: 10px;
817
+ left: 9px;
797
818
  font-size: 12px;
798
819
  background-color: white;
799
- color: #a6a6a6;
800
- margin-right: 3px;
820
+ // color: #a6a6a6;
821
+ padding-right: 5px;
822
+ padding-left: 5px;
801
823
  .asterik {
802
824
  color: var(--hlx-color-error);
803
825
  margin-left: 3px;
@@ -824,6 +846,10 @@ button {
824
846
  cursor: pointer;
825
847
  &:hover {
826
848
  border-color: var(--hlx-color-primary);
849
+ .cutom-multi-select-title
850
+ {
851
+ color: var(--hlx-color-primary) !important;
852
+ }
827
853
  }
828
854
  .custom-multi-select-tag-value {
829
855
  margin-left: 8px;
@@ -861,7 +887,7 @@ button {
861
887
  right: 0px;
862
888
  font-size: 14px;
863
889
  width:30px;
864
- height: 34px;
890
+ height: 29px;
865
891
  display: flex;
866
892
  align-items: center;
867
893
  border-bottom-right-radius: 2px;