@beterdichtbij/component-library 0.72.2-beta.0 → 0.72.2

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 (69) hide show
  1. package/README.md +12 -12
  2. package/dist/bd-component-lib.cjs.js +55 -55
  3. package/dist/bd-component-lib.css +1 -1
  4. package/dist/bd-component-lib.es.js +11 -11
  5. package/dist/bd-component-lib.umd.js +56 -56
  6. package/dist/locales/en.json +79 -79
  7. package/dist/locales/nl.json +180 -180
  8. package/dist/scss/_active-filters.scss +65 -65
  9. package/dist/scss/_alert.scss +5 -5
  10. package/dist/scss/_article.scss +20 -20
  11. package/dist/scss/_assign-conversation-modal.scss +13 -13
  12. package/dist/scss/_attachments.scss +107 -107
  13. package/dist/scss/_badge.scss +18 -18
  14. package/dist/scss/_button.scss +80 -80
  15. package/dist/scss/_card.scss +56 -56
  16. package/dist/scss/_chatcloud.scss +98 -98
  17. package/dist/scss/_collapsable-card.scss +107 -107
  18. package/dist/scss/_content-library-card-message-template.scss +136 -136
  19. package/dist/scss/_content-library-card.scss +158 -158
  20. package/dist/scss/_content-library-modal.scss +8 -8
  21. package/dist/scss/_content-library-overview.scss +4 -4
  22. package/dist/scss/_content-library-split-button.scss +23 -23
  23. package/dist/scss/_conversation-to-text-modal.scss +36 -36
  24. package/dist/scss/_dropdown.scss +113 -113
  25. package/dist/scss/_extern.scss +1 -1
  26. package/dist/scss/_file-upload-preview.scss +53 -53
  27. package/dist/scss/_file-upload.scss +26 -26
  28. package/dist/scss/_filter-card.scss +64 -64
  29. package/dist/scss/_form-field.scss +12 -12
  30. package/dist/scss/_form-multiple-checkbox.scss +51 -51
  31. package/dist/scss/_forms.scss +3 -3
  32. package/dist/scss/_header.scss +170 -170
  33. package/dist/scss/_icon-luscii-logo.scss +31 -31
  34. package/dist/scss/_icons.scss +38 -38
  35. package/dist/scss/_image-attachment-modal.scss +91 -91
  36. package/dist/scss/_input-group.scss +2 -2
  37. package/dist/scss/_loader.scss +59 -59
  38. package/dist/scss/_markdown-editor.scss +114 -114
  39. package/dist/scss/_message-template-form-modal.scss +47 -47
  40. package/dist/scss/_mixins.scss +78 -78
  41. package/dist/scss/_mobile-menu.scss +91 -91
  42. package/dist/scss/_modal.scss +183 -183
  43. package/dist/scss/_notification-button.scss +29 -29
  44. package/dist/scss/_pagination.scss +56 -56
  45. package/dist/scss/_phone-number-edit-modal.scss +35 -35
  46. package/dist/scss/_pill-container.scss +26 -26
  47. package/dist/scss/_pill.scss +63 -63
  48. package/dist/scss/_profile-image.scss +34 -34
  49. package/dist/scss/_table-sort-header.scss +13 -13
  50. package/dist/scss/_table.scss +16 -16
  51. package/dist/scss/_templates.scss +318 -318
  52. package/dist/scss/_toast.scss +69 -69
  53. package/dist/scss/_user-information.scss +34 -34
  54. package/dist/scss/_user.scss +21 -21
  55. package/dist/scss/_video-call-toast.scss +100 -100
  56. package/dist/scss/_zoomslider.scss +77 -77
  57. package/dist/scss/base/variables.scss +210 -210
  58. package/dist/scss/extern/_bootstrap.scss +14 -14
  59. package/dist/scss/extern/_prime-vue.scss +551 -551
  60. package/dist/scss/forms/_form-check.scss +16 -16
  61. package/dist/scss/forms/_form-input.scss +9 -9
  62. package/dist/scss/forms/_form-select.scss +5 -5
  63. package/dist/scss/main.scss +52 -52
  64. package/dist/scss/templates/_change-password-template.scss +8 -8
  65. package/dist/scss/templates/_content-library-template.scss +135 -135
  66. package/dist/scss/templates/_not-found-template.scss +9 -9
  67. package/dist/scss/templates/_video-call-template.scss +225 -225
  68. package/dist/stores/SessionTimeOutStore.ts +46 -46
  69. package/package.json +133 -133
@@ -1,137 +1,137 @@
1
- .content-library-card-message-template {
2
- padding: 8px;
3
- min-height: 190px;
4
- height: auto;
5
-
6
- &.collapsed {
7
- height: 190px;
8
- }
9
-
10
- .content-library-card__body {
11
- padding-top: 6px;
12
- max-height: none;
13
- overflow: hidden;
14
-
15
- &.collapsed {
16
- max-height: 75px;
17
- }
18
- }
19
-
20
- .btn-link {
21
- padding: 0;
22
-
23
- &:focus {
24
- box-shadow: revert;
25
- }
26
- }
27
-
28
- .btn-insert {
29
- width: auto;
30
- height: 26px;
31
- line-height: normal;
32
- }
33
-
34
- .content-library-card-message-template__body {
35
- display: block !important;
36
-
37
- .message-text {
38
- word-break: break-word;
39
- }
40
-
41
- .attachment-list {
42
- margin: 16px 0;
43
-
44
- .attachment-list__item {
45
- margin-right: 15px;
46
- margin-bottom: 0.25rem;
47
- word-break: break-all;
48
- }
49
-
50
- img {
51
- height: 50px;
52
- max-width: 100%;
53
- }
54
- }
55
- }
56
-
57
- footer {
58
- justify-content: space-between;
59
-
60
- .icon-button {
61
- svg {
62
- fill: revert;
63
- stroke: hsla(224, 21%, 38%, 1);
64
- }
65
- }
66
- }
67
-
68
- .attachment-occurence {
69
- width: 30px;
70
- height: 30px;
71
- display: flex;
72
- align-items: center;
73
- justify-content: center;
74
- position: relative;
75
-
76
- .icon {
77
- fill: $color-blue;
78
- }
79
-
80
- .number-icon {
81
- position: absolute;
82
- top: 0;
83
- right: 0;
84
- color: white;
85
- font-size: 0.6em;
86
- border-radius: 50%;
87
- background-color: $blue;
88
- width: .8rem;
89
- height: .8rem;
90
- display: flex;
91
- text-align: center;
92
- align-items: center;
93
- justify-content: center;
94
- }
95
- }
96
-
97
- header {
98
- h6, small {
99
- text-overflow: ellipsis;
100
- white-space: nowrap;
101
- }
102
-
103
- .top {
104
- display: flex;
105
- justify-content: space-between;
106
-
107
- .bd-badge {
108
- max-height: fit-content;
109
- }
110
-
111
- .edit-btn-group {
112
- button {
113
- width: 30px;
114
- height: 30px;
115
- padding: 0;
116
-
117
- svg {
118
- fill: hsla(224, 21%, 38%, 1);
119
- stroke: revert;
120
- }
121
- }
122
- }
123
- }
124
- }
125
-
126
- .collapse-button {
127
- height: 30px;
128
-
129
- &-last {
130
- margin-bottom: 0;
131
- }
132
-
133
- svg {
134
- margin-right: 4px;
135
- }
136
- }
1
+ .content-library-card-message-template {
2
+ padding: 8px;
3
+ min-height: 190px;
4
+ height: auto;
5
+
6
+ &.collapsed {
7
+ height: 190px;
8
+ }
9
+
10
+ .content-library-card__body {
11
+ padding-top: 6px;
12
+ max-height: none;
13
+ overflow: hidden;
14
+
15
+ &.collapsed {
16
+ max-height: 75px;
17
+ }
18
+ }
19
+
20
+ .btn-link {
21
+ padding: 0;
22
+
23
+ &:focus {
24
+ box-shadow: revert;
25
+ }
26
+ }
27
+
28
+ .btn-insert {
29
+ width: auto;
30
+ height: 26px;
31
+ line-height: normal;
32
+ }
33
+
34
+ .content-library-card-message-template__body {
35
+ display: block !important;
36
+
37
+ .message-text {
38
+ word-break: break-word;
39
+ }
40
+
41
+ .attachment-list {
42
+ margin: 16px 0;
43
+
44
+ .attachment-list__item {
45
+ margin-right: 15px;
46
+ margin-bottom: 0.25rem;
47
+ word-break: break-all;
48
+ }
49
+
50
+ img {
51
+ height: 50px;
52
+ max-width: 100%;
53
+ }
54
+ }
55
+ }
56
+
57
+ footer {
58
+ justify-content: space-between;
59
+
60
+ .icon-button {
61
+ svg {
62
+ fill: revert;
63
+ stroke: hsla(224, 21%, 38%, 1);
64
+ }
65
+ }
66
+ }
67
+
68
+ .attachment-occurence {
69
+ width: 30px;
70
+ height: 30px;
71
+ display: flex;
72
+ align-items: center;
73
+ justify-content: center;
74
+ position: relative;
75
+
76
+ .icon {
77
+ fill: $color-blue;
78
+ }
79
+
80
+ .number-icon {
81
+ position: absolute;
82
+ top: 0;
83
+ right: 0;
84
+ color: white;
85
+ font-size: 0.6em;
86
+ border-radius: 50%;
87
+ background-color: $blue;
88
+ width: .8rem;
89
+ height: .8rem;
90
+ display: flex;
91
+ text-align: center;
92
+ align-items: center;
93
+ justify-content: center;
94
+ }
95
+ }
96
+
97
+ header {
98
+ h6, small {
99
+ text-overflow: ellipsis;
100
+ white-space: nowrap;
101
+ }
102
+
103
+ .top {
104
+ display: flex;
105
+ justify-content: space-between;
106
+
107
+ .bd-badge {
108
+ max-height: fit-content;
109
+ }
110
+
111
+ .edit-btn-group {
112
+ button {
113
+ width: 30px;
114
+ height: 30px;
115
+ padding: 0;
116
+
117
+ svg {
118
+ fill: hsla(224, 21%, 38%, 1);
119
+ stroke: revert;
120
+ }
121
+ }
122
+ }
123
+ }
124
+ }
125
+
126
+ .collapse-button {
127
+ height: 30px;
128
+
129
+ &-last {
130
+ margin-bottom: 0;
131
+ }
132
+
133
+ svg {
134
+ margin-right: 4px;
135
+ }
136
+ }
137
137
  }
@@ -1,159 +1,159 @@
1
- .content-library-card {
2
- min-height: 190px;
3
- background-color: #fff;
4
- box-shadow: 0 0 1px #abb0be;
5
- padding: 20px;
6
- border-radius: 5px;
7
- display: flex;
8
-
9
- flex-direction: column;
10
- justify-content: space-evenly;
11
-
12
- header {
13
- h6 {
14
- display: -webkit-box;
15
- display: -moz-box;
16
- overflow: hidden;
17
- -webkit-line-clamp: 2;
18
- line-clamp: 2;
19
- -webkit-box-orient: vertical;
20
- }
21
-
22
- small {
23
- font-size: 14px;
24
- line-height: 1.3125rem;
25
- display: block;
26
- max-height: 1.3125rem;
27
- overflow: hidden;
28
- white-space: nowrap;
29
- text-overflow: ellipsis;
30
- }
31
- }
32
-
33
- &__body {
34
- padding-top: 12px;
35
- flex: 1;
36
-
37
- p {
38
- min-height: 1rem;
39
- }
40
- p:last-of-type {
41
- margin-bottom: 0px;
42
- }
43
- }
44
-
45
- &__description {
46
- display: -webkit-box;
47
- display: -moz-box;
48
- max-height: 2.75rem;
49
- overflow: hidden;
50
- text-overflow: ellipsis;
51
- -webkit-line-clamp: 2;
52
- /* number of lines to show */
53
- line-clamp: 2;
54
- -webkit-box-orient: vertical;
55
- }
56
-
57
- &__uri {
58
- font-size: 1rem;
59
- display: flex;
60
- align-items: baseline;
61
-
62
- .filler {
63
- width: 6px;
64
- }
65
- }
66
-
67
- .btn-icon {
68
- height: 40px;
69
- width: 40px;
70
-
71
- svg {
72
- fill: hsla(224, 21%, 38%, 1);
73
- stroke: revert;
74
-
75
- &.icon-info-circle {
76
- fill: transparent;
77
- stroke: hsla(224, 21%, 38%, 1);
78
- }
79
-
80
- &.icon-external {
81
- transform: translateY(1px);
82
- }
83
- }
84
-
85
- &:hover {
86
- background: hsla(221, 13%, 95%, 1);
87
- border-radius: 8px;
88
- }
89
- }
90
-
91
- .btn-insert {
92
- padding: 2px 5px;
93
- }
94
-
95
- footer {
96
- display: flex;
97
- justify-content: space-between;
98
- align-items: center;
99
-
100
- .btn-icon {
101
- height: 40px;
102
- width: 40px;
103
-
104
- svg {
105
- fill: hsla(224, 21%, 38%, 1);
106
- stroke: revert;
107
-
108
- &.icon-external {
109
- transform: translateY(1px);
110
- }
111
- }
112
-
113
- &:hover {
114
- background: hsla(221, 13%, 95%, 1);
115
- border-radius: 8px;
116
- }
117
- }
118
- }
119
-
120
- &-title {
121
- //because of IE the value can't be set to revert
122
- min-height: revert;
123
- height: 164px;
124
-
125
-
126
- justify-content: space-between;
127
- }
128
-
129
- &-image {
130
- min-height: revert;
131
- height: 184px;
132
- justify-content: space-between;
133
-
134
-
135
-
136
- header {
137
- display: flex;
138
- justify-content: space-between;
139
- gap: 16px;
140
-
141
- h6 {
142
- max-height: 4.5rem;
143
- line-clamp: 3;
144
- -webkit-line-clamp: 3;
145
- }
146
- }
147
-
148
- &__titles {
149
- overflow: hidden;
150
- }
151
-
152
- &__figure {
153
- height: 100px;
154
- width: 100px;
155
- object-fit: cover;
156
- }
157
- }
158
-
1
+ .content-library-card {
2
+ min-height: 190px;
3
+ background-color: #fff;
4
+ box-shadow: 0 0 1px #abb0be;
5
+ padding: 20px;
6
+ border-radius: 5px;
7
+ display: flex;
8
+
9
+ flex-direction: column;
10
+ justify-content: space-evenly;
11
+
12
+ header {
13
+ h6 {
14
+ display: -webkit-box;
15
+ display: -moz-box;
16
+ overflow: hidden;
17
+ -webkit-line-clamp: 2;
18
+ line-clamp: 2;
19
+ -webkit-box-orient: vertical;
20
+ }
21
+
22
+ small {
23
+ font-size: 14px;
24
+ line-height: 1.3125rem;
25
+ display: block;
26
+ max-height: 1.3125rem;
27
+ overflow: hidden;
28
+ white-space: nowrap;
29
+ text-overflow: ellipsis;
30
+ }
31
+ }
32
+
33
+ &__body {
34
+ padding-top: 12px;
35
+ flex: 1;
36
+
37
+ p {
38
+ min-height: 1rem;
39
+ }
40
+ p:last-of-type {
41
+ margin-bottom: 0px;
42
+ }
43
+ }
44
+
45
+ &__description {
46
+ display: -webkit-box;
47
+ display: -moz-box;
48
+ max-height: 2.75rem;
49
+ overflow: hidden;
50
+ text-overflow: ellipsis;
51
+ -webkit-line-clamp: 2;
52
+ /* number of lines to show */
53
+ line-clamp: 2;
54
+ -webkit-box-orient: vertical;
55
+ }
56
+
57
+ &__uri {
58
+ font-size: 1rem;
59
+ display: flex;
60
+ align-items: baseline;
61
+
62
+ .filler {
63
+ width: 6px;
64
+ }
65
+ }
66
+
67
+ .btn-icon {
68
+ height: 40px;
69
+ width: 40px;
70
+
71
+ svg {
72
+ fill: hsla(224, 21%, 38%, 1);
73
+ stroke: revert;
74
+
75
+ &.icon-info-circle {
76
+ fill: transparent;
77
+ stroke: hsla(224, 21%, 38%, 1);
78
+ }
79
+
80
+ &.icon-external {
81
+ transform: translateY(1px);
82
+ }
83
+ }
84
+
85
+ &:hover {
86
+ background: hsla(221, 13%, 95%, 1);
87
+ border-radius: 8px;
88
+ }
89
+ }
90
+
91
+ .btn-insert {
92
+ padding: 2px 5px;
93
+ }
94
+
95
+ footer {
96
+ display: flex;
97
+ justify-content: space-between;
98
+ align-items: center;
99
+
100
+ .btn-icon {
101
+ height: 40px;
102
+ width: 40px;
103
+
104
+ svg {
105
+ fill: hsla(224, 21%, 38%, 1);
106
+ stroke: revert;
107
+
108
+ &.icon-external {
109
+ transform: translateY(1px);
110
+ }
111
+ }
112
+
113
+ &:hover {
114
+ background: hsla(221, 13%, 95%, 1);
115
+ border-radius: 8px;
116
+ }
117
+ }
118
+ }
119
+
120
+ &-title {
121
+ //because of IE the value can't be set to revert
122
+ min-height: revert;
123
+ height: 164px;
124
+
125
+
126
+ justify-content: space-between;
127
+ }
128
+
129
+ &-image {
130
+ min-height: revert;
131
+ height: 184px;
132
+ justify-content: space-between;
133
+
134
+
135
+
136
+ header {
137
+ display: flex;
138
+ justify-content: space-between;
139
+ gap: 16px;
140
+
141
+ h6 {
142
+ max-height: 4.5rem;
143
+ line-clamp: 3;
144
+ -webkit-line-clamp: 3;
145
+ }
146
+ }
147
+
148
+ &__titles {
149
+ overflow: hidden;
150
+ }
151
+
152
+ &__figure {
153
+ height: 100px;
154
+ width: 100px;
155
+ object-fit: cover;
156
+ }
157
+ }
158
+
159
159
  }
@@ -1,9 +1,9 @@
1
- #content-library-modal {
2
- .search-block input {
3
- margin: 0;
4
- }
5
-
6
- .collapse-button-container {
7
- text-align: center;
8
- }
1
+ #content-library-modal {
2
+ .search-block input {
3
+ margin: 0;
4
+ }
5
+
6
+ .collapse-button-container {
7
+ text-align: center;
8
+ }
9
9
  }
@@ -1,5 +1,5 @@
1
- .content-library-overview {
2
- .card-container {
3
- padding: 0 4px 8px 4px;
4
- }
1
+ .content-library-overview {
2
+ .card-container {
3
+ padding: 0 4px 8px 4px;
4
+ }
5
5
  }
@@ -1,24 +1,24 @@
1
- .bd-content-library-split-button {
2
- // Empty ::after element with extra height is added by PrimeVue.
3
- .p-button-icon-only::after {
4
- display: none;
5
- }
6
-
7
- &.p-splitbutton .p-button-outlined.p-button-secondary:hover svg {
8
- fill: currentColor;
9
- }
10
-
11
- .menu-item {
12
- display: flex;
13
- align-items: center;
14
- gap: 8px;
15
- padding: 8px;
16
- cursor: pointer;
17
- font-size: 1rem;
18
-
19
- .icon-image {
20
- width: 18px;
21
- height: 18px;
22
- }
23
- }
1
+ .bd-content-library-split-button {
2
+ // Empty ::after element with extra height is added by PrimeVue.
3
+ .p-button-icon-only::after {
4
+ display: none;
5
+ }
6
+
7
+ &.p-splitbutton .p-button-outlined.p-button-secondary:hover svg {
8
+ fill: currentColor;
9
+ }
10
+
11
+ .menu-item {
12
+ display: flex;
13
+ align-items: center;
14
+ gap: 8px;
15
+ padding: 8px;
16
+ cursor: pointer;
17
+ font-size: 1rem;
18
+
19
+ .icon-image {
20
+ width: 18px;
21
+ height: 18px;
22
+ }
23
+ }
24
24
  }