@colijnit/sharedcomponents 255.1.16 → 255.1.17

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 (26) hide show
  1. package/bundles/colijnit-sharedcomponents.umd.js +13 -23
  2. package/bundles/colijnit-sharedcomponents.umd.js.map +1 -1
  3. package/colijnit-sharedcomponents.metadata.json +1 -1
  4. package/esm2015/lib/components/email-selector/email-selector.component.js +4 -11
  5. package/esm2015/lib/components/role-email-selector/role-email-selector.component.js +1 -4
  6. package/esm2015/lib/components/task-creator/task-creator.component.js +8 -11
  7. package/esm2015/lib/service/shared.service.js +2 -2
  8. package/fesm2015/colijnit-sharedcomponents.js +10 -21
  9. package/fesm2015/colijnit-sharedcomponents.js.map +1 -1
  10. package/lib/components/access/style/_layout.scss +16 -14
  11. package/lib/components/activity-list-header/components/period-filter/style/_layout.scss +4 -4
  12. package/lib/components/activity-list-header/style/_layout.scss +1 -1
  13. package/lib/components/activity-overview-component/style/_layout.scss +1 -1
  14. package/lib/components/app-file-dropzone/style/_layout.scss +1 -1
  15. package/lib/components/email-selector/email-selector.component.d.ts +0 -4
  16. package/lib/components/file-upload/style/_layout.scss +2 -2
  17. package/lib/components/modify-task-form/components/activity-summary-block/style/_layout.scss +113 -100
  18. package/lib/components/modify-task-form/components/notification-summary-block/style/_layout.scss +110 -98
  19. package/lib/components/modify-task-form/components/status-summary-block/style/_layout.scss +2 -2
  20. package/lib/components/modify-task-form/components/task-details/style/_layout.scss +6 -6
  21. package/lib/components/modify-task-form/style/_layout.scss +5 -5
  22. package/lib/components/open-activity-list/components/personal-activity-overview/style/_layout.scss +2 -2
  23. package/lib/components/role-email-selector/role-email-selector.component.d.ts +0 -1
  24. package/lib/components/stock/style/_layout.scss +2 -2
  25. package/lib/service/shared.service.d.ts +1 -2
  26. package/package.json +2 -2
@@ -1,22 +1,24 @@
1
1
  @include export-module('co-read-write-access-layout') {
2
- h4 {
3
- margin: 10px 0;
4
- }
2
+ .co-read-write-access {
3
+ h4 {
4
+ margin: 10px 0;
5
+ }
5
6
 
6
- .horizontal-layout-column {
7
- display: flex;
8
- padding-top: 10px;
9
- padding-bottom: 10px;
7
+ .horizontal-layout-column {
8
+ display: flex;
9
+ padding-top: 10px;
10
+ padding-bottom: 10px;
10
11
 
11
- input-lov-multi-select {
12
- width: 50%;
12
+ input-lov-multi-select {
13
+ width: 50%;
13
14
 
14
- &:first-child {
15
- padding-right: 10px;
16
- }
15
+ &:first-child {
16
+ padding-right: 10px;
17
+ }
17
18
 
18
- &:last-child {
19
- padding-left: 10px;
19
+ &:last-child {
20
+ padding-left: 10px;
21
+ }
20
22
  }
21
23
  }
22
24
  }
@@ -17,14 +17,14 @@
17
17
  //.current-filter {
18
18
  // color: $color-action;
19
19
  //}
20
- ::ng-deep #period_filter_dropdown_template {
20
+ #period_filter_dropdown_template {
21
21
  overflow: hidden;
22
22
  display: block;
23
23
  width: 300px;
24
24
  border-radius: 5px;
25
25
  background: white;
26
26
  box-shadow: 1px 1px 10px 1px rgba(72,79,96,.25);
27
- ::ng-deep .label {
27
+ .label {
28
28
  font-weight: bold;
29
29
  height: 50px;
30
30
  display: flex;
@@ -32,7 +32,7 @@
32
32
  font-size: 13px;
33
33
  padding: 0 10px;
34
34
  }
35
- ::ng-deep .item {
35
+ .item {
36
36
  cursor: pointer;
37
37
  height: 50px;
38
38
  display: flex;
@@ -48,7 +48,7 @@
48
48
  &:hover {
49
49
  background-color: #8faba6;
50
50
  color: white;
51
- ::ng-deep icon {
51
+ .co-icon {
52
52
  [fill] {
53
53
  fill: white;
54
54
  }
@@ -57,7 +57,7 @@
57
57
  }
58
58
  }
59
59
 
60
- ::ng-deep tab-no-router {
60
+ .tab-no-router {
61
61
  margin-top: 14px;
62
62
 
63
63
  nav.tab-no-router-nav {
@@ -61,7 +61,7 @@
61
61
  }
62
62
  &.overdue {
63
63
  color: red;
64
- .icon ::ng-deep [fill] {
64
+ .icon [fill] {
65
65
  fill: red;
66
66
  }
67
67
  }
@@ -48,7 +48,7 @@
48
48
  justify-content: center;
49
49
  height: 100%;
50
50
  }
51
- icon ::ng-deep {
51
+ .co-icon {
52
52
  height: 100px;
53
53
  width: 100px;
54
54
  svg [fill] {
@@ -4,13 +4,10 @@ import { IconCacheService } from "../../service/icon-cache.service";
4
4
  import { WorkflowCategoryType } from "@colijnit/mainapi/build/enum/workflow-category.enum";
5
5
  import { SharedService } from "../../service/shared.service";
6
6
  import { SafeHtml } from "@angular/platform-browser";
7
- import { RoleEmailSelectorComponent } from "../role-email-selector/role-email-selector.component";
8
7
  export declare class EmailSelectorComponent implements OnInit {
9
8
  iconService: IconCacheService;
10
9
  sharedService: SharedService;
11
10
  readonly icons: typeof Icon;
12
- email: RoleEmailSelectorComponent;
13
- bccEmail: RoleEmailSelectorComponent;
14
11
  set key(value: string);
15
12
  get key(): string;
16
13
  set workflowCategoryType(value: WorkflowCategoryType);
@@ -33,5 +30,4 @@ export declare class EmailSelectorComponent implements OnInit {
33
30
  toggleBCC(): void;
34
31
  handleEmailAddressesChanged(): void;
35
32
  handleBccEmailAddressesChanged(): void;
36
- clear(): void;
37
33
  }
@@ -11,8 +11,8 @@
11
11
  .image {
12
12
  cursor: pointer;
13
13
  }
14
- ::ng-deep .hidden {
15
- display: none !important;
14
+ .hidden {
15
+ display: none;
16
16
  }
17
17
  &:hover {
18
18
  button-colijn.edit-file {
@@ -1,11 +1,13 @@
1
1
  @include export-module('co-activity-summary-block-layout') {
2
- .co-activity-summary-block{
2
+ .co-activity-summary-block {
3
3
  height: auto;
4
4
  display: flex;
5
5
  flex-direction: column;
6
+
6
7
  &:not(.no-border) {
7
8
  border: 1px solid #DCE4EA;
8
9
  }
10
+
9
11
  .left-seperator {
10
12
  &:before {
11
13
  content: "|";
@@ -22,126 +24,137 @@
22
24
  width: 100%;
23
25
  height: 100%;
24
26
  }
25
- }
26
- ::ng-deep image-display {
27
- height: 70px;
28
- width: 70px;
29
- span {
30
- display: none;
27
+
28
+ .image-display {
29
+ height: 70px;
30
+ width: 70px;
31
+
32
+ span {
33
+ display: none;
34
+ }
31
35
  }
32
- }
33
36
 
34
- .icon-wrapper {
35
- display: flex;
36
- flex-shrink: 0;
37
- align-items: center;
38
- justify-content: center;
39
- background: #F8FBFA;
40
- height: 70px;
41
- width: 70px;
42
- border-radius: 50%;
43
- border: 1px solid #DCE4EA;
44
- overflow: hidden;
45
- ::ng-deep icon {
46
- height: 60px !important;
47
- width: 60px !important;
37
+ .icon-wrapper {
38
+ display: flex;
48
39
  flex-shrink: 0;
40
+ align-items: center;
41
+ justify-content: center;
42
+ background: #F8FBFA;
43
+ height: 70px;
44
+ width: 70px;
45
+ border-radius: 50%;
46
+ border: 1px solid #DCE4EA;
47
+ overflow: hidden;
48
+
49
+ .co-icon {
50
+ height: 60px;
51
+ width: 60px;
52
+ flex-shrink: 0;
53
+ }
54
+
55
+ &.small {
56
+ height: 50px;
57
+ width: 50px;
58
+
59
+ .co-icon {
60
+ height: 40px;
61
+ width: 40px;
62
+ }
63
+ }
49
64
  }
50
- &.small {
51
- height: 50px;
52
- width: 50px;
53
- ::ng-deep icon {
54
- height: 40px !important;
55
- width: 40px !important;
65
+
66
+ .block-wrapper {
67
+ position: relative;
68
+ display: flex;
69
+ align-items: center;
70
+
71
+ .expandable-wrapper {
72
+ position: absolute;
73
+ bottom: 0;
74
+ left: 50%;
75
+ transform: translateX(-50%);
76
+ }
77
+
78
+ .template-wrapper {
79
+ & > * {
80
+ display: flex;
81
+ flex-direction: column;
82
+ gap: 5px;
83
+ }
84
+
56
85
  }
57
86
  }
58
- }
59
87
 
60
- .block-wrapper {
61
- position: relative;
62
- display: flex;
63
- align-items: center;
64
- .expandable-wrapper {
65
- position: absolute;
66
- bottom: 0;
67
- left: 50%;
68
- transform: translateX(-50%);
88
+ .content-wrapper {
89
+ display: flex;
90
+ flex-direction: column;
91
+ justify-content: space-between;
92
+ margin-left: 10px;
93
+ min-height: 70px;
94
+ height: auto;
95
+ width: 100%;
69
96
  }
70
- .template-wrapper {
71
- & > * {
72
- display: flex;
73
- flex-direction: column;
74
- gap: 5px;
75
- }
76
97
 
98
+ .value {
99
+ font-size: 13px;
100
+ font-weight: bold;
101
+ color: #171721;
102
+ align-items: center;
77
103
  }
78
- }
79
104
 
80
- .content-wrapper {
81
- display: flex;
82
- flex-direction: column;
83
- justify-content: space-between;
84
- margin-left: 10px;
85
- min-height: 70px;
86
- height: auto;
87
- width: 100%;
88
- }
105
+ .title {
106
+ font-size: 11px;
107
+ line-height: 13px;
108
+ color: #171721;
109
+ }
89
110
 
90
- .value {
91
- font-size: 13px;
92
- font-weight: bold;
93
- color: #171721;
94
- align-items: center;
95
- }
111
+ .activity-summary-block-edit-template {
112
+ display: flex;
113
+ width: 100%;
114
+ flex-direction: column;
115
+ justify-content: space-between;
116
+ z-index: 9000;
117
+ max-height: 100%;
96
118
 
97
- .title {
98
- font-size: 11px;
99
- line-height: 13px;
100
- color: #171721;
101
- }
119
+ .template-wrapper {
120
+ margin-bottom: 10px;
121
+ }
102
122
 
103
- .activity-summary-block-edit-template {
104
- display: flex;
105
- width: 100%;
106
- flex-direction: column;
107
- justify-content: space-between;
108
- z-index: 9000;
109
- max-height: 100%;
123
+ .co-form {
124
+ co-list-of-values {
125
+ margin-bottom: 5px;
110
126
 
111
- .template-wrapper {
112
- margin-bottom: 10px;
113
- }
114
- ::ng-deep co-form {
115
- co-list-of-values {
116
- margin-bottom: 5px;
117
- &:before {
118
- box-shadow: none;
127
+ &:before {
128
+ box-shadow: none;
129
+ }
119
130
  }
120
131
  }
132
+
133
+ .title-wrapper {
134
+ align-items: center;
135
+ margin-bottom: 10px;
136
+ }
137
+
138
+ h3:not(.no-margin) {
139
+ margin-top: 25px;
140
+ }
121
141
  }
122
- .title-wrapper {
123
- align-items: center;
124
- margin-bottom: 10px;
125
- }
126
- ::ng-deep h3:not(.no-margin) {
127
- margin-top: 25px;
128
- }
129
- }
130
142
 
131
- .collapseable-wrapper {
132
- padding: 10px;
133
- border-bottom: 1px solid #DCE4EA;
134
- }
143
+ .collapseable-wrapper {
144
+ padding: 10px;
145
+ border-bottom: 1px solid #DCE4EA;
146
+ }
135
147
 
136
- ::ng-deep .input-date-window {
137
- z-index: 9001!important;
138
- }
148
+ .input-date-window {
149
+ z-index: 9001;
150
+ }
139
151
 
140
- .initial {
141
- position: initial !important;
142
- }
152
+ .initial {
153
+ position: initial;
154
+ }
143
155
 
144
- .center {
145
- justify-content: center;
156
+ .center {
157
+ justify-content: center;
158
+ }
146
159
  }
147
160
  }
@@ -4,6 +4,7 @@
4
4
  .value {
5
5
  flex-wrap: wrap;
6
6
  }
7
+
7
8
  .notification-email {
8
9
  display: flex;
9
10
  flex-shrink: 0;
@@ -16,9 +17,11 @@
16
17
  height: auto;
17
18
  display: flex;
18
19
  flex-direction: column;
20
+
19
21
  &:not(.no-border) {
20
22
  border: 1px solid $color_border;
21
23
  }
24
+
22
25
  .left-seperator {
23
26
  &:before {
24
27
  content: "|";
@@ -36,126 +39,135 @@
36
39
  height: 100%;
37
40
  }
38
41
 
39
- }
40
-
41
- ::ng-deep image-display {
42
- height: $block_content_height;
43
- width: $block_content_height;
44
- span {
45
- display: none;
46
- }
47
-
48
- .icon-wrapper {
49
- display: flex;
50
- flex-shrink: 0;
51
- align-items: center;
52
- justify-content: center;
53
- background: #F8FBFA;
42
+ .image-display {
54
43
  height: $block_content_height;
55
44
  width: $block_content_height;
56
- border-radius: 50%;
57
- border: 1px solid $color_border;
58
- overflow: hidden;
59
- ::ng-deep icon {
60
- height: 60px !important;
61
- width: 60px !important;
45
+
46
+ span {
47
+ display: none;
48
+ }
49
+
50
+ .icon-wrapper {
51
+ display: flex;
62
52
  flex-shrink: 0;
53
+ align-items: center;
54
+ justify-content: center;
55
+ background: #F8FBFA;
56
+ height: $block_content_height;
57
+ width: $block_content_height;
58
+ border-radius: 50%;
59
+ border: 1px solid $color_border;
60
+ overflow: hidden;
61
+
62
+ .co-icon {
63
+ height: 60px;
64
+ width: 60px;
65
+ flex-shrink: 0;
66
+ }
67
+
68
+ &.small {
69
+ height: 50px;
70
+ width: 50px;
71
+
72
+ .co-icon {
73
+ height: 40px;
74
+ width: 40px;
75
+ }
76
+ }
63
77
  }
64
- &.small {
65
- height: 50px;
66
- width: 50px;
67
- ::ng-deep icon {
68
- height: 40px !important;
69
- width: 40px !important;
78
+
79
+
80
+ .block-wrapper {
81
+ position: relative;
82
+ display: flex;
83
+ align-items: center;
84
+
85
+ .expandable-wrapper {
86
+ position: absolute;
87
+ bottom: 0;
88
+ left: 50%;
89
+ transform: translateX(-50%);
70
90
  }
71
91
  }
72
- }
73
92
 
93
+ .content-wrapper {
94
+ display: flex;
95
+ flex-direction: column;
96
+ justify-content: space-between;
97
+ margin-left: 10px;
98
+ min-height: $block_content_height;
99
+ height: auto;
100
+ width: 100%;
101
+ }
74
102
 
75
- .block-wrapper {
76
- position: relative;
77
- display: flex;
78
- align-items: center;
79
- .expandable-wrapper {
80
- position: absolute;
81
- bottom: 0;
82
- left: 50%;
83
- transform: translateX(-50%);
103
+ .value {
104
+ font-size: 13px;
105
+ font-weight: bold;
106
+ color: $color-dark;
107
+ align-items: center;
84
108
  }
85
- }
86
109
 
87
- .content-wrapper {
88
- display: flex;
89
- flex-direction: column;
90
- justify-content: space-between;
91
- margin-left: 10px;
92
- min-height: $block_content_height;
93
- height: auto;
94
- width: 100%;
95
- }
110
+ .title {
111
+ font-size: 11px;
112
+ line-height: 13px;
113
+ color: $color-label;
114
+ }
96
115
 
97
- .value {
98
- font-size: 13px;
99
- font-weight: bold;
100
- color: $color-dark;
101
- align-items: center;
102
- }
116
+ .activity-summary-block-edit-template {
117
+ display: flex;
118
+ width: 100%;
119
+ flex-direction: column;
120
+ justify-content: space-between;
121
+ z-index: 9000;
122
+ max-height: 100%;
103
123
 
104
- .title {
105
- font-size: 11px;
106
- line-height: 13px;
107
- color: $color-label;
108
- }
124
+ .template-wrapper {
125
+ margin-bottom: 10px;
126
+ }
109
127
 
110
- .activity-summary-block-edit-template {
111
- display: flex;
112
- width: 100%;
113
- flex-direction: column;
114
- justify-content: space-between;
115
- z-index: 9000;
116
- max-height: 100%;
128
+ .co-form {
129
+ co-list-of-values {
130
+ margin-bottom: 5px;
117
131
 
118
- .template-wrapper {
119
- margin-bottom: 10px;
120
- }
121
- ::ng-deep co-form {
122
- co-list-of-values {
123
- margin-bottom: 5px;
124
- &:before {
125
- box-shadow: none;
132
+ &:before {
133
+ box-shadow: none;
134
+ }
126
135
  }
127
136
  }
137
+
138
+ .title-wrapper {
139
+ align-items: center;
140
+ margin-bottom: 10px;
141
+ }
142
+
143
+ h3:not(.no-margin) {
144
+ margin-top: 25px;
145
+ }
128
146
  }
129
- .title-wrapper {
130
- align-items: center;
131
- margin-bottom: 10px;
132
- }
133
- ::ng-deep h3:not(.no-margin) {
134
- margin-top: 25px;
147
+
148
+ .collapseable-wrapper {
149
+ padding: 10px;
150
+ border-bottom: 1px solid $color_border;
135
151
  }
136
- }
137
152
 
138
- .collapseable-wrapper {
139
- padding: 10px;
140
- border-bottom: 1px solid $color_border;
141
- }
153
+ .input-date-window {
154
+ z-index: 9001;
155
+ }
142
156
 
143
- ::ng-deep .input-date-window {
144
- z-index: 9001!important;
145
- }
157
+ .initial {
158
+ position: initial;
159
+ }
146
160
 
147
- .initial {
148
- position: initial !important;
149
- }
161
+ .center {
162
+ justify-content: center;
163
+ }
150
164
 
151
- .center {
152
- justify-content: center;
153
- }
154
- .planning-row {
155
- display: flex;
156
- flex-direction: row;
157
- gap: 5px;
158
- align-items:flex-start;
165
+ .planning-row {
166
+ display: flex;
167
+ flex-direction: row;
168
+ gap: 5px;
169
+ align-items: flex-start;
170
+ }
159
171
  }
160
172
  }
161
173
  }
@@ -9,8 +9,8 @@
9
9
  }
10
10
  }
11
11
 
12
- ::ng-deep #status_summary_block_edit_template {
13
- ::ng-deep arrow-link {
12
+ #status_summary_block_edit_template {
13
+ .arrow-link {
14
14
  height: 25px;
15
15
  }
16
16
  .single-field {
@@ -14,14 +14,14 @@
14
14
  margin-bottom: 15px;
15
15
  }
16
16
 
17
- ::ng-deep .form-input {
17
+ .form-input {
18
18
  width: 100%;
19
19
  }
20
20
  .details-wrapper {
21
21
  display: flex;
22
22
  flex-direction: column;
23
23
  gap: 5px;
24
- ::ng-deep co-input-textarea {
24
+ .co-input-textarea {
25
25
  textarea {
26
26
  min-height: 150px;
27
27
  }
@@ -29,15 +29,15 @@
29
29
  box-shadow: none;
30
30
  }
31
31
  }
32
- ::ng-deep co-input-text {
32
+ .co-input-text {
33
33
  &:before {
34
34
  box-shadow: none;
35
35
  }
36
36
  }
37
37
  }
38
38
 
39
- ::ng-deep arrow-link a {
40
- font-size: 17px !important;
39
+ .arrow-link a {
40
+ font-size: 17px;
41
41
  }
42
42
 
43
43
  .workflow-dropdown-wrapper {
@@ -77,7 +77,7 @@
77
77
  color: #FFFFFF;
78
78
  white-space: nowrap;
79
79
  }
80
- co-icon ::ng-deep {
80
+ .co-icon {
81
81
  width: 10px;
82
82
  height: 10px;
83
83
  svg {