@stackline/angular-multiselect-dropdown 2.0.4 → 4.0.1

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.
@@ -0,0 +1,203 @@
1
+ /*
2
+ Custom theme starter for @stackline/angular-multiselect-dropdown.
3
+
4
+ Copy this file into your application and edit the values below when you want
5
+ full control over the dropdown look without touching the library source.
6
+ */
7
+ .stackline-dropdown {
8
+ --ms-primary: #3f51b5;
9
+ --ms-primary-soft: rgba(63, 81, 181, 0.12);
10
+ --ms-surface: #ffffff;
11
+ --ms-surface-soft: #f5f7fb;
12
+ --ms-surface-muted: #e8eaf6;
13
+ --ms-outline: #c5cae9;
14
+ --ms-outline-strong: #7986cb;
15
+ --ms-on-surface: #212121;
16
+ --ms-on-surface-muted: #5f6368;
17
+ --ms-chip-bg: #e8eaf6;
18
+ --ms-chip-text: #303f9f;
19
+ --ms-chip-remove: #303f9f;
20
+ --ms-shadow: 0 1px 2px rgba(33, 33, 33, 0.16), 0 12px 32px rgba(63, 81, 181, 0.12);
21
+ --ms-shadow-soft: 0 1px 2px rgba(33, 33, 33, 0.12), 0 4px 12px rgba(33, 33, 33, 0.08);
22
+ }
23
+
24
+ .stackline-dropdown .c-btn {
25
+ min-height: 56px;
26
+ padding: 11px 54px 11px 16px;
27
+ border-radius: 18px;
28
+ background: var(--ms-surface);
29
+ border: 1px solid var(--ms-outline);
30
+ color: var(--ms-on-surface);
31
+ box-shadow: var(--ms-shadow-soft);
32
+ }
33
+
34
+ .stackline-dropdown .c-btn:hover {
35
+ border-color: var(--ms-outline-strong);
36
+ }
37
+
38
+ .stackline-dropdown .c-btn.is-active {
39
+ border-color: var(--ms-primary);
40
+ box-shadow: 0 0 0 3px rgba(63, 81, 181, 0.14), var(--ms-shadow-soft);
41
+ }
42
+
43
+ .stackline-dropdown .c-placeholder,
44
+ .stackline-dropdown .c-single-value,
45
+ .stackline-dropdown .countplaceholder,
46
+ .stackline-dropdown .c-angle-down,
47
+ .stackline-dropdown .c-angle-up,
48
+ .stackline-dropdown .clear-all {
49
+ color: var(--ms-on-surface-muted);
50
+ }
51
+
52
+ .stackline-dropdown .c-chip-list {
53
+ gap: 8px;
54
+ }
55
+
56
+ .stackline-dropdown .c-token {
57
+ display: inline-block;
58
+ vertical-align: middle;
59
+ min-height: 32px;
60
+ max-width: 100%;
61
+ padding: 6px 30px 6px 12px;
62
+ border-radius: 999px;
63
+ background: var(--ms-chip-bg);
64
+ color: var(--ms-chip-text);
65
+ box-shadow: inset 0 0 0 1px rgba(63, 81, 181, 0.08);
66
+ line-height: 1.35;
67
+ white-space: normal;
68
+ overflow-wrap: anywhere;
69
+ }
70
+
71
+ .stackline-dropdown .c-remove {
72
+ color: inherit;
73
+ }
74
+
75
+ .stackline-dropdown .c-token .c-label {
76
+ max-width: 100%;
77
+ color: inherit;
78
+ white-space: normal;
79
+ overflow-wrap: anywhere;
80
+ }
81
+
82
+ .stackline-dropdown .list-area {
83
+ border-radius: 22px;
84
+ background: var(--ms-surface);
85
+ border: 1px solid var(--ms-outline);
86
+ box-shadow: var(--ms-shadow);
87
+ }
88
+
89
+ .stackline-dropdown .select-all,
90
+ .stackline-dropdown .filter-select-all {
91
+ background: var(--ms-surface-soft);
92
+ border-bottom: 1px solid rgba(121, 134, 203, 0.16);
93
+ }
94
+
95
+ .stackline-dropdown .list-filter {
96
+ min-height: 52px;
97
+ padding-left: 48px;
98
+ padding-right: 44px;
99
+ background: var(--ms-surface);
100
+ border-bottom: 1px solid rgba(121, 134, 203, 0.16);
101
+ }
102
+
103
+ .stackline-dropdown .list-filter .c-input,
104
+ .stackline-dropdown .list-filter input {
105
+ color: var(--ms-on-surface);
106
+ }
107
+
108
+ .stackline-dropdown .list-filter .c-input::placeholder,
109
+ .stackline-dropdown .list-filter input::placeholder,
110
+ .stackline-dropdown .list-filter .c-search,
111
+ .stackline-dropdown .list-filter .c-clear {
112
+ color: var(--ms-on-surface-muted);
113
+ }
114
+
115
+ .stackline-dropdown .btn-iceblue {
116
+ width: 100%;
117
+ min-height: 40px;
118
+ border-radius: 999px;
119
+ border: 1px solid transparent;
120
+ background: var(--ms-primary);
121
+ color: #ffffff;
122
+ font-weight: 600;
123
+ }
124
+
125
+ .stackline-dropdown .dropdown-list ul {
126
+ padding: 8px;
127
+ }
128
+
129
+ .stackline-dropdown .dropdown-list ul li {
130
+ min-height: 0;
131
+ margin: 4px;
132
+ padding: 12px 14px;
133
+ border-radius: 14px;
134
+ color: var(--ms-on-surface);
135
+ line-height: 1.35;
136
+ }
137
+
138
+ .stackline-dropdown .dropdown-list ul li:hover {
139
+ background: var(--ms-surface-soft);
140
+ }
141
+
142
+ .stackline-dropdown .selected-item {
143
+ background: var(--ms-primary-soft) !important;
144
+ color: var(--ms-primary);
145
+ }
146
+
147
+ .stackline-dropdown .grp-title {
148
+ color: var(--ms-on-surface-muted);
149
+ }
150
+
151
+ .stackline-dropdown .grp-title label,
152
+ .stackline-dropdown .list-grp h4 {
153
+ letter-spacing: 0.08em;
154
+ text-transform: uppercase;
155
+ }
156
+
157
+ .stackline-dropdown .pure-checkbox input[type=checkbox] + label {
158
+ padding-left: 32px;
159
+ color: inherit;
160
+ font-weight: 500;
161
+ }
162
+
163
+ .stackline-dropdown .pure-checkbox input[type=checkbox] + label::before {
164
+ width: 18px;
165
+ height: 18px;
166
+ margin-top: -10px;
167
+ border: 2px solid var(--ms-outline-strong);
168
+ border-radius: 6px;
169
+ background: var(--ms-surface);
170
+ }
171
+
172
+ .stackline-dropdown .pure-checkbox input[type=checkbox] + label::after {
173
+ left: 5px;
174
+ width: 7px;
175
+ height: 3px;
176
+ margin-top: -3px;
177
+ border-width: 0 0 2px 2px;
178
+ border-color: #ffffff;
179
+ }
180
+
181
+ .stackline-dropdown .pure-checkbox input[type=checkbox]:focus + label::before,
182
+ .stackline-dropdown .pure-checkbox input[type=checkbox]:hover + label::before {
183
+ border-color: var(--ms-primary);
184
+ box-shadow: 0 0 0 4px rgba(63, 81, 181, 0.12);
185
+ }
186
+
187
+ .stackline-dropdown .pure-checkbox input[type=checkbox]:checked + label::before {
188
+ border-color: var(--ms-primary);
189
+ background: var(--ms-primary);
190
+ }
191
+
192
+ .stackline-dropdown .list-message,
193
+ .stackline-dropdown .nodata-label {
194
+ color: var(--ms-on-surface-muted);
195
+ }
196
+
197
+ .stackline-dropdown .loading-icon {
198
+ width: 18px;
199
+ top: 18px;
200
+ right: 16px;
201
+ }
202
+
203
+ /*# sourceMappingURL=custom.theme.css.map */
@@ -0,0 +1,202 @@
1
+ /*
2
+ Custom theme starter for @stackline/angular-multiselect-dropdown.
3
+
4
+ Copy this file into your application and edit the values below when you want
5
+ full control over the dropdown look without touching the library source.
6
+ */
7
+
8
+ .stackline-dropdown {
9
+ --ms-primary: #3f51b5;
10
+ --ms-primary-soft: rgba(63, 81, 181, 0.12);
11
+ --ms-surface: #ffffff;
12
+ --ms-surface-soft: #f5f7fb;
13
+ --ms-surface-muted: #e8eaf6;
14
+ --ms-outline: #c5cae9;
15
+ --ms-outline-strong: #7986cb;
16
+ --ms-on-surface: #212121;
17
+ --ms-on-surface-muted: #5f6368;
18
+ --ms-chip-bg: #e8eaf6;
19
+ --ms-chip-text: #303f9f;
20
+ --ms-chip-remove: #303f9f;
21
+ --ms-shadow: 0 1px 2px rgba(33, 33, 33, 0.16), 0 12px 32px rgba(63, 81, 181, 0.12);
22
+ --ms-shadow-soft: 0 1px 2px rgba(33, 33, 33, 0.12), 0 4px 12px rgba(33, 33, 33, 0.08);
23
+ }
24
+
25
+ .stackline-dropdown .c-btn {
26
+ min-height: 56px;
27
+ padding: 11px 54px 11px 16px;
28
+ border-radius: 18px;
29
+ background: var(--ms-surface);
30
+ border: 1px solid var(--ms-outline);
31
+ color: var(--ms-on-surface);
32
+ box-shadow: var(--ms-shadow-soft);
33
+ }
34
+
35
+ .stackline-dropdown .c-btn:hover {
36
+ border-color: var(--ms-outline-strong);
37
+ }
38
+
39
+ .stackline-dropdown .c-btn.is-active {
40
+ border-color: var(--ms-primary);
41
+ box-shadow: 0 0 0 3px rgba(63, 81, 181, 0.14), var(--ms-shadow-soft);
42
+ }
43
+
44
+ .stackline-dropdown .c-placeholder,
45
+ .stackline-dropdown .c-single-value,
46
+ .stackline-dropdown .countplaceholder,
47
+ .stackline-dropdown .c-angle-down,
48
+ .stackline-dropdown .c-angle-up,
49
+ .stackline-dropdown .clear-all {
50
+ color: var(--ms-on-surface-muted);
51
+ }
52
+
53
+ .stackline-dropdown .c-chip-list {
54
+ gap: 8px;
55
+ }
56
+
57
+ .stackline-dropdown .c-token {
58
+ display: inline-block;
59
+ vertical-align: middle;
60
+ min-height: 32px;
61
+ max-width: 100%;
62
+ padding: 6px 30px 6px 12px;
63
+ border-radius: 999px;
64
+ background: var(--ms-chip-bg);
65
+ color: var(--ms-chip-text);
66
+ box-shadow: inset 0 0 0 1px rgba(63, 81, 181, 0.08);
67
+ line-height: 1.35;
68
+ white-space: normal;
69
+ overflow-wrap: anywhere;
70
+ }
71
+
72
+ .stackline-dropdown .c-remove {
73
+ color: inherit;
74
+ }
75
+
76
+ .stackline-dropdown .c-token .c-label {
77
+ max-width: 100%;
78
+ color: inherit;
79
+ white-space: normal;
80
+ overflow-wrap: anywhere;
81
+ }
82
+
83
+ .stackline-dropdown .list-area {
84
+ border-radius: 22px;
85
+ background: var(--ms-surface);
86
+ border: 1px solid var(--ms-outline);
87
+ box-shadow: var(--ms-shadow);
88
+ }
89
+
90
+ .stackline-dropdown .select-all,
91
+ .stackline-dropdown .filter-select-all {
92
+ background: var(--ms-surface-soft);
93
+ border-bottom: 1px solid rgba(121, 134, 203, 0.16);
94
+ }
95
+
96
+ .stackline-dropdown .list-filter {
97
+ min-height: 52px;
98
+ padding-left: 48px;
99
+ padding-right: 44px;
100
+ background: var(--ms-surface);
101
+ border-bottom: 1px solid rgba(121, 134, 203, 0.16);
102
+ }
103
+
104
+ .stackline-dropdown .list-filter .c-input,
105
+ .stackline-dropdown .list-filter input {
106
+ color: var(--ms-on-surface);
107
+ }
108
+
109
+ .stackline-dropdown .list-filter .c-input::placeholder,
110
+ .stackline-dropdown .list-filter input::placeholder,
111
+ .stackline-dropdown .list-filter .c-search,
112
+ .stackline-dropdown .list-filter .c-clear {
113
+ color: var(--ms-on-surface-muted);
114
+ }
115
+
116
+ .stackline-dropdown .btn-iceblue {
117
+ width: 100%;
118
+ min-height: 40px;
119
+ border-radius: 999px;
120
+ border: 1px solid transparent;
121
+ background: var(--ms-primary);
122
+ color: #ffffff;
123
+ font-weight: 600;
124
+ }
125
+
126
+ .stackline-dropdown .dropdown-list ul {
127
+ padding: 8px;
128
+ }
129
+
130
+ .stackline-dropdown .dropdown-list ul li {
131
+ min-height: 0;
132
+ margin: 4px;
133
+ padding: 12px 14px;
134
+ border-radius: 14px;
135
+ color: var(--ms-on-surface);
136
+ line-height: 1.35;
137
+ }
138
+
139
+ .stackline-dropdown .dropdown-list ul li:hover {
140
+ background: var(--ms-surface-soft);
141
+ }
142
+
143
+ .stackline-dropdown .selected-item {
144
+ background: var(--ms-primary-soft) !important;
145
+ color: var(--ms-primary);
146
+ }
147
+
148
+ .stackline-dropdown .grp-title {
149
+ color: var(--ms-on-surface-muted);
150
+ }
151
+
152
+ .stackline-dropdown .grp-title label,
153
+ .stackline-dropdown .list-grp h4 {
154
+ letter-spacing: 0.08em;
155
+ text-transform: uppercase;
156
+ }
157
+
158
+ .stackline-dropdown .pure-checkbox input[type="checkbox"] + label {
159
+ padding-left: 32px;
160
+ color: inherit;
161
+ font-weight: 500;
162
+ }
163
+
164
+ .stackline-dropdown .pure-checkbox input[type="checkbox"] + label::before {
165
+ width: 18px;
166
+ height: 18px;
167
+ margin-top: -10px;
168
+ border: 2px solid var(--ms-outline-strong);
169
+ border-radius: 6px;
170
+ background: var(--ms-surface);
171
+ }
172
+
173
+ .stackline-dropdown .pure-checkbox input[type="checkbox"] + label::after {
174
+ left: 5px;
175
+ width: 7px;
176
+ height: 3px;
177
+ margin-top: -3px;
178
+ border-width: 0 0 2px 2px;
179
+ border-color: #ffffff;
180
+ }
181
+
182
+ .stackline-dropdown .pure-checkbox input[type="checkbox"]:focus + label::before,
183
+ .stackline-dropdown .pure-checkbox input[type="checkbox"]:hover + label::before {
184
+ border-color: var(--ms-primary);
185
+ box-shadow: 0 0 0 4px rgba(63, 81, 181, 0.12);
186
+ }
187
+
188
+ .stackline-dropdown .pure-checkbox input[type="checkbox"]:checked + label::before {
189
+ border-color: var(--ms-primary);
190
+ background: var(--ms-primary);
191
+ }
192
+
193
+ .stackline-dropdown .list-message,
194
+ .stackline-dropdown .nodata-label {
195
+ color: var(--ms-on-surface-muted);
196
+ }
197
+
198
+ .stackline-dropdown .loading-icon {
199
+ width: 18px;
200
+ top: 18px;
201
+ right: 16px;
202
+ }
@@ -0,0 +1,37 @@
1
+ .stackline-dropdown {
2
+ --ms-primary: #3f51b5;
3
+ --ms-primary-soft: rgba(63, 81, 181, 0.12);
4
+ --ms-surface: #ffffff;
5
+ --ms-surface-soft: #f5f7fb;
6
+ --ms-surface-muted: #e8eaf6;
7
+ --ms-outline: #c5cae9;
8
+ --ms-outline-strong: #7986cb;
9
+ --ms-on-surface: #212121;
10
+ --ms-on-surface-muted: #5f6368;
11
+ --ms-chip-bg: #e8eaf6;
12
+ --ms-chip-text: #303f9f;
13
+ --ms-chip-remove: #303f9f;
14
+ --ms-shadow: 0 1px 2px rgba(33, 33, 33, 0.16), 0 12px 32px rgba(63, 81, 181, 0.12);
15
+ --ms-shadow-soft: 0 1px 2px rgba(33, 33, 33, 0.12), 0 4px 12px rgba(33, 33, 33, 0.08);
16
+ }
17
+
18
+ .stackline-dropdown .c-btn {
19
+ background: var(--ms-surface);
20
+ border-color: var(--ms-outline);
21
+ color: var(--ms-on-surface);
22
+ }
23
+
24
+ .stackline-dropdown .c-btn:hover {
25
+ border-color: var(--ms-outline-strong);
26
+ }
27
+
28
+ .stackline-dropdown .selected-item {
29
+ background: var(--ms-primary-soft);
30
+ }
31
+
32
+ .stackline-dropdown .btn-iceblue {
33
+ background: var(--ms-primary);
34
+ color: #ffffff;
35
+ }
36
+
37
+ /*# sourceMappingURL=default.theme.css.map */
@@ -0,0 +1,35 @@
1
+ .stackline-dropdown {
2
+ --ms-primary: #3f51b5;
3
+ --ms-primary-soft: rgba(63, 81, 181, 0.12);
4
+ --ms-surface: #ffffff;
5
+ --ms-surface-soft: #f5f7fb;
6
+ --ms-surface-muted: #e8eaf6;
7
+ --ms-outline: #c5cae9;
8
+ --ms-outline-strong: #7986cb;
9
+ --ms-on-surface: #212121;
10
+ --ms-on-surface-muted: #5f6368;
11
+ --ms-chip-bg: #e8eaf6;
12
+ --ms-chip-text: #303f9f;
13
+ --ms-chip-remove: #303f9f;
14
+ --ms-shadow: 0 1px 2px rgba(33, 33, 33, 0.16), 0 12px 32px rgba(63, 81, 181, 0.12);
15
+ --ms-shadow-soft: 0 1px 2px rgba(33, 33, 33, 0.12), 0 4px 12px rgba(33, 33, 33, 0.08);
16
+ }
17
+
18
+ .stackline-dropdown .c-btn {
19
+ background: var(--ms-surface);
20
+ border-color: var(--ms-outline);
21
+ color: var(--ms-on-surface);
22
+ }
23
+
24
+ .stackline-dropdown .c-btn:hover {
25
+ border-color: var(--ms-outline-strong);
26
+ }
27
+
28
+ .stackline-dropdown .selected-item {
29
+ background: var(--ms-primary-soft);
30
+ }
31
+
32
+ .stackline-dropdown .btn-iceblue {
33
+ background: var(--ms-primary);
34
+ color: #ffffff;
35
+ }
@@ -1 +0,0 @@
1
- {"version":3,"sourceRoot":"","sources":["src/app/angular2-multiselect-dropdown/multiselect.component.scss"],"names":[],"mappings":"AAGA;EACI;;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;;;AAEJ;EACQ;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA,YAjCC;EAkCD;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;AACA;AAAA;AAAA;AAAA;;AAKJ;EACI;EACA;;AAIZ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGR;EACI;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAGR;EACI;;AAEJ;EACI;EACA;;AAEJ;EACI;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACI;EACA;;;AAEJ;EACI;EACA;EACA;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;;AACA;EACI;EACA;EACA;EACA;;AAEJ;EACI;;AAEJ;EACI;EACA;EACA;EACA;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;AAAA;EAGE,cA/KW;EAgLX;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA,OAlMW;EAmMX;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA,kBAhNW;EAiNX;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EAEE;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE,YAjQW;;;AAmQb;EACE;;;AAEF;EACI;;;AAEJ;EACI;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;AAAA;EAEI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;AAAA;AAAA;EAGI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;AAAA;EAEI;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA","file":"multiselect.component.css"}