@natec/mef-dev-ui-kit 0.0.62 → 0.0.65

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@natec/mef-dev-ui-kit",
3
- "version": "0.0.62",
3
+ "version": "0.0.65",
4
4
  "description": "MEF.DEV UI Kit Library",
5
5
  "author": {
6
6
  "name": "NATEC"
@@ -1,265 +1,4 @@
1
1
 
2
- /*#region montserrat*/
3
- @font-face {
4
- font-family: 'montserrat-bold';
5
- src: url('./fonts/montserrat/Montserrat-Bold.woff2') format('woff2'),
6
- url('./fonts/montserrat/Montserrat-Bold.woff') format('woff');
7
- font-weight: bold;
8
- font-style: normal;
9
- font-display: swap;
10
- }
11
-
12
- @font-face {
13
- font-family: 'montserrat-light';
14
- src: url('./fonts/montserrat/Montserrat-Light.woff2') format('woff2'),
15
- url('./fonts/montserrat/Montserrat-Light.woff') format('woff');
16
- font-weight: 300;
17
- font-style: normal;
18
- font-display: swap;
19
- }
20
-
21
- @font-face {
22
- font-family: 'montserrat-semibold';
23
- src: url('./fonts/montserrat/Montserrat-SemiBold.woff2') format('woff2'),
24
- url('./fonts/montserrat/Montserrat-SemiBold.woff') format('woff');
25
- font-weight: 600;
26
- font-style: normal;
27
- font-display: swap;
28
- }
29
-
30
- @font-face {
31
- font-family: 'montserrat-medium';
32
- src: url('./fonts/montserrat/Montserrat-Medium.woff2') format('woff2'),
33
- url('./fonts/montserrat/Montserrat-Medium.woff') format('woff');
34
- font-weight: 500;
35
- font-style: normal;
36
- font-display: swap;
37
- }
38
-
39
- @font-face {
40
- font-family: 'montserrat-regular';
41
- src: url('./fonts/montserrat/Montserrat-Regular.woff2') format('woff2'),
42
- url('./fonts/montserrat/Montserrat-Regular.woff') format('woff');
43
- font-weight: normal;
44
- font-style: normal;
45
- font-display: swap;
46
- }
47
- /*#endregion montserrat*/
48
-
49
- /*#region Lato*/
50
- @font-face {
51
- font-family: 'Lato-Regular';
52
- src: url("./fonts/lato/lato-regular.eot?#iefix") format("embedded-opentype"),
53
- url("./fonts/lato/lato-regular.otf") format("opentype"),
54
- url("./fonts/lato/lato-regular.svg") format("svg"),
55
- url("./fonts/lato/lato-regular.ttf") format("truetype"),
56
- url("./fonts/lato/lato-regular.woff") format("woff"),
57
- url("./fonts/lato/lato-regular.woff2") format("woff2");
58
- font-weight: normal;
59
- font-style: normal;
60
- font-display: swap;
61
- }
62
-
63
- @font-face {
64
- font-family: 'Lato-Bold';
65
- src: url("./fonts/lato/lato-bold.eot?#iefix") format("embedded-opentype"),
66
- url("./fonts/lato/lato-bold.otf") format("opentype"),
67
- url("./fonts/lato/lato-bold.svg") format("svg"),
68
- url("./fonts/lato/lato-bold.ttf") format("truetype"),
69
- url("./fonts/lato/lato-bold.woff") format("woff"),
70
- url("./fonts/lato/lato-bold.woff2") format("woff2");
71
- font-weight: bold;
72
- font-style: normal;
73
- font-display: swap;
74
- }
75
- /*#endregion Lato*/
76
-
77
- /*#region img-font*/
78
- @font-face {
79
- font-family: 'icomoon';
80
- src: url('./fonts/main-img-font/icomoon.eot?97jr4n');
81
- src: url('./fonts/main-img-font/icomoon.eot?97jr4n#iefix') format('embedded-opentype'),
82
- url('./fonts/main-img-font/icomoon.ttf?97jr4n') format('truetype'),
83
- url('./fonts/main-img-font/icomoon.woff?97jr4n') format('woff'),
84
- url('./fonts/main-img-font/icomoon.svg?97jr4n#icomoon') format('svg');
85
- font-weight: normal;
86
- font-style: normal;
87
- font-display: block;
88
- }
89
-
90
- [class^="icon-"], [class*=" icon-"] {
91
- /* use !important to prevent issues with browser extensions that change ./fonts */
92
- font-family: 'icomoon' !important;
93
- speak: never;
94
- font-style: normal;
95
- font-weight: normal;
96
- font-variant: normal;
97
- text-transform: none;
98
- line-height: 1;
99
-
100
- /* Better Font Rendering =========== */
101
- -webkit-font-smoothing: antialiased;
102
- -moz-osx-font-smoothing: grayscale;
103
- }
104
-
105
- .icon-info-light:before {
106
- content: "\e90d";
107
- }
108
- .icon-connector:before {
109
- content: "\e90e";
110
- }
111
- .icon-information:before {
112
- content: "\e90f";
113
- }
114
- .icon-plugin:before {
115
- content: "\e910";
116
- }
117
- .icon-check-connector:before {
118
- content: "\e911";
119
- }
120
- .icon-computer:before {
121
- content: "\e913";
122
- }
123
- .icon-trash-light:before {
124
- content: "\e915";
125
- }
126
- .icon-ok:before {
127
- content: "\e917";
128
- color: #28b446;
129
- }
130
- .icon-calendar:before {
131
- content: "\e919";
132
- }
133
- .icon-guard:before {
134
- content: "\e91f";
135
- }
136
- .icon-tenant:before {
137
- content: "\e922";
138
- }
139
- .icon-nok:before {
140
- content: "\e923";
141
- }
142
- .icon-lock .path1:before {
143
- content: "\e924";
144
- color: rgb(234, 234, 234);
145
- }
146
- .icon-lock .path2:before {
147
- content: "\e925";
148
- margin-left: -1.158203125em;
149
- color: rgb(55, 55, 55);
150
- }
151
- .icon-unlock .path1:before {
152
- content: "\e926";
153
- }
154
- .icon-unlock .path2:before {
155
- content: "\e927";
156
- margin-left: -1.2109375em;
157
- }
158
- .icon-logout:before {
159
- content: "\e90b";
160
- }
161
- .icon-unchecked:before {
162
- content: "\e90a";
163
- }
164
- .icon-notification .path1:before {
165
- content: "\e902";
166
- }
167
- .icon-notification .path2:before {
168
- content: "\e903";
169
- margin-left: -1em;
170
- }
171
- .icon-notification .path3:before {
172
- content: "\e904";
173
- margin-left: -1em;
174
- }
175
- .icon-notification .path4:before {
176
- content: "\e905";
177
- margin-left: -1em;
178
- }
179
- .icon-setings .path1:before {
180
- content: "\e908";
181
- }
182
- .icon-setings .path2:before {
183
- content: "\e909";
184
- margin-left: -1em;
185
- }
186
- .icon-person:before {
187
- content: "\e90c";
188
- }
189
- .icon-persons:before {
190
- content: "\e912";
191
- }
192
- .icon-configuration:before {
193
- content: "\e914";
194
- }
195
- .icon-support:before {
196
- content: "\e916";
197
- }
198
- .icon-log:before {
199
- content: "\e918";
200
- }
201
- .icon-msg_popup:before {
202
- content: "\e91a";
203
- }
204
- .icon-protect:before {
205
- content: "\e91b";
206
- }
207
- .icon-keys:before {
208
- content: "\e91c";
209
- }
210
- .icon-info:before {
211
- content: "\e91d";
212
- }
213
- .icon-tenats:before {
214
- content: "\e91e";
215
- }
216
- .icon-profile:before {
217
- content: "\e921";
218
- }
219
- .icon-msg:before {
220
- content: "\e928";
221
- }
222
- .icon-arrow:before {
223
- content: "\e929";
224
- }
225
- .icon-warning:before {
226
- content: "\e92a";
227
- }
228
- .icon-messages:before {
229
- content: "\e92b";
230
- }
231
- .icon-pause:before {
232
- content: "\e92c";
233
- }
234
- .icon-play:before {
235
- content: "\e92e";
236
- }
237
- .icon-store:before {
238
- content: "\e930";
239
- }
240
- .icon-trash:before {
241
- content: "\e931";
242
- }
243
- .icon-edit:before {
244
- content: "\e932";
245
- }
246
- .icon-checked:before {
247
- content: "\e933";
248
- }
249
- .icon-bell .path1:before {
250
- content: "\e936";
251
- }
252
- .icon-bell .path2:before {
253
- content: "\e937";
254
- margin-left: -0.9658203125em;
255
- }
256
- .icon-bell .path3:before {
257
- content: "\e938";
258
- margin-left: -0.9658203125em;
259
- }
260
-
261
- /*#endregion img-font*/
262
-
263
2
  .h1, h1 {
264
3
  font-family: montserrat-bold;
265
4
  font-size: 24px;
@@ -1108,11 +1108,11 @@
1108
1108
  only screen and (-o-min-device-pixel-ratio: 200/100),
1109
1109
  only screen and (min-device-pixel-ratio: 2.0) {
1110
1110
  .editor-icon {
1111
- background-image: url("#{$base-img-url}/editor_tray_2x.png");
1111
+ background-image: url("../img/editor_tray_2x.png");
1112
1112
  background-size: 480px 40px;
1113
1113
  }
1114
1114
  .alert .close {
1115
- background: url("#{$base-img-url}/icons/noti-cross-2x.png") no-repeat scroll 0 0 transparent;
1115
+ background: url("../img/icons/noti-cross-2x.png") no-repeat scroll 0 0 transparent;
1116
1116
  background-position: -9px -10px;
1117
1117
  width: 10px;
1118
1118
  height: 9px;
@@ -5,9 +5,6 @@
5
5
 
6
6
  @import '../designe-colors.scss';
7
7
 
8
- $base-img-url: "../img" ;
9
- $assets-url: "../../assets" ;
10
-
11
8
  // Global Color
12
9
  // --------------------------------------------------
13
10
  // Base Grey Guided Color * change only $base-light
@@ -1,6 +1,268 @@
1
1
  //Core Libs
2
-
3
2
  @use '../designe-colors.scss' as c;
3
+
4
+ /*#region montserrat*/
5
+ @font-face {
6
+ font-family: 'montserrat-bold';
7
+ src: url('../fonts/montserrat/Montserrat-Bold.woff2') format('woff2'),
8
+ url('../fonts/montserrat/Montserrat-Bold.woff') format('woff');
9
+ font-weight: bold;
10
+ font-style: normal;
11
+ font-display: swap;
12
+ }
13
+
14
+ @font-face {
15
+ font-family: 'montserrat-light';
16
+ src: url('../fonts/montserrat/Montserrat-Light.woff2') format('woff2'),
17
+ url('../fonts/montserrat/Montserrat-Light.woff') format('woff');
18
+ font-weight: 300;
19
+ font-style: normal;
20
+ font-display: swap;
21
+ }
22
+
23
+ @font-face {
24
+ font-family: 'montserrat-semibold';
25
+ src: url('../fonts/montserrat/Montserrat-SemiBold.woff2') format('woff2'),
26
+ url('../fonts/montserrat/Montserrat-SemiBold.woff') format('woff');
27
+ font-weight: 600;
28
+ font-style: normal;
29
+ font-display: swap;
30
+ }
31
+
32
+ @font-face {
33
+ font-family: 'montserrat-medium';
34
+ src: url('../fonts/montserrat/Montserrat-Medium.woff2') format('woff2'),
35
+ url('../fonts/montserrat/Montserrat-Medium.woff') format('woff');
36
+ font-weight: 500;
37
+ font-style: normal;
38
+ font-display: swap;
39
+ }
40
+
41
+ @font-face {
42
+ font-family: 'montserrat-regular';
43
+ src: url('../fonts/montserrat/Montserrat-Regular.woff2') format('woff2'),
44
+ url('../fonts/montserrat/Montserrat-Regular.woff') format('woff');
45
+ font-weight: normal;
46
+ font-style: normal;
47
+ font-display: swap;
48
+ }
49
+ /*#endregion montserrat*/
50
+
51
+ /*#region Lato*/
52
+ @font-face {
53
+ font-family: 'Lato-Regular';
54
+ src: url("../fonts/lato/lato-regular.eot?#iefix") format("embedded-opentype"),
55
+ url("../fonts/lato/lato-regular.otf") format("opentype"),
56
+ url("../fonts/lato/lato-regular.svg") format("svg"),
57
+ url("../fonts/lato/lato-regular.ttf") format("truetype"),
58
+ url("../fonts/lato/lato-regular.woff") format("woff"),
59
+ url("../fonts/lato/lato-regular.woff2") format("woff2");
60
+ font-weight: normal;
61
+ font-style: normal;
62
+ font-display: swap;
63
+ }
64
+
65
+ @font-face {
66
+ font-family: 'Lato-Bold';
67
+ src: url("../fonts/lato/lato-bold.eot?#iefix") format("embedded-opentype"),
68
+ url("../fonts/lato/lato-bold.otf") format("opentype"),
69
+ url("../fonts/lato/lato-bold.svg") format("svg"),
70
+ url("../fonts/lato/lato-bold.ttf") format("truetype"),
71
+ url("../fonts/lato/lato-bold.woff") format("woff"),
72
+ url("../fonts/lato/lato-bold.woff2") format("woff2");
73
+ font-weight: bold;
74
+ font-style: normal;
75
+ font-display: swap;
76
+ }
77
+ /*#endregion Lato*/
78
+
79
+ /*#region img-font*/
80
+ @font-face {
81
+ font-family: 'icomoon';
82
+ src: url('../fonts/main-img-font/icomoon.eot?97jr4n');
83
+ src: url('../fonts/main-img-font/icomoon.eot?97jr4n#iefix') format('embedded-opentype'),
84
+ url('../fonts/main-img-font/icomoon.ttf?97jr4n') format('truetype'),
85
+ url('../fonts/main-img-font/icomoon.woff?97jr4n') format('woff'),
86
+ url('../fonts/main-img-font/icomoon.svg?97jr4n#icomoon') format('svg');
87
+ font-weight: normal;
88
+ font-style: normal;
89
+ font-display: block;
90
+ }
91
+
92
+ [class^="icon-"], [class*=" icon-"] {
93
+ /* use !important to prevent issues with browser extensions that change ../fonts */
94
+ font-family: 'icomoon' !important;
95
+ speak: never;
96
+ font-style: normal;
97
+ font-weight: normal;
98
+ font-variant: normal;
99
+ text-transform: none;
100
+ line-height: 1;
101
+
102
+ /* Better Font Rendering =========== */
103
+ -webkit-font-smoothing: antialiased;
104
+ -moz-osx-font-smoothing: grayscale;
105
+ }
106
+
107
+ .icon-info-light:before {
108
+ content: "\e90d";
109
+ }
110
+ .icon-connector:before {
111
+ content: "\e90e";
112
+ }
113
+ .icon-information:before {
114
+ content: "\e90f";
115
+ }
116
+ .icon-plugin:before {
117
+ content: "\e910";
118
+ }
119
+ .icon-check-connector:before {
120
+ content: "\e911";
121
+ }
122
+ .icon-computer:before {
123
+ content: "\e913";
124
+ }
125
+ .icon-trash-light:before {
126
+ content: "\e915";
127
+ }
128
+ .icon-ok:before {
129
+ content: "\e917";
130
+ color: #28b446;
131
+ }
132
+ .icon-calendar:before {
133
+ content: "\e919";
134
+ }
135
+ .icon-guard:before {
136
+ content: "\e91f";
137
+ }
138
+ .icon-tenant:before {
139
+ content: "\e922";
140
+ }
141
+ .icon-nok:before {
142
+ content: "\e923";
143
+ }
144
+ .icon-lock .path1:before {
145
+ content: "\e924";
146
+ color: rgb(234, 234, 234);
147
+ }
148
+ .icon-lock .path2:before {
149
+ content: "\e925";
150
+ margin-left: -1.158203125em;
151
+ color: rgb(55, 55, 55);
152
+ }
153
+ .icon-unlock .path1:before {
154
+ content: "\e926";
155
+ }
156
+ .icon-unlock .path2:before {
157
+ content: "\e927";
158
+ margin-left: -1.2109375em;
159
+ }
160
+ .icon-logout:before {
161
+ content: "\e90b";
162
+ }
163
+ .icon-unchecked:before {
164
+ content: "\e90a";
165
+ }
166
+ .icon-notification .path1:before {
167
+ content: "\e902";
168
+ }
169
+ .icon-notification .path2:before {
170
+ content: "\e903";
171
+ margin-left: -1em;
172
+ }
173
+ .icon-notification .path3:before {
174
+ content: "\e904";
175
+ margin-left: -1em;
176
+ }
177
+ .icon-notification .path4:before {
178
+ content: "\e905";
179
+ margin-left: -1em;
180
+ }
181
+ .icon-setings .path1:before {
182
+ content: "\e908";
183
+ }
184
+ .icon-setings .path2:before {
185
+ content: "\e909";
186
+ margin-left: -1em;
187
+ }
188
+ .icon-person:before {
189
+ content: "\e90c";
190
+ }
191
+ .icon-persons:before {
192
+ content: "\e912";
193
+ }
194
+ .icon-configuration:before {
195
+ content: "\e914";
196
+ }
197
+ .icon-support:before {
198
+ content: "\e916";
199
+ }
200
+ .icon-log:before {
201
+ content: "\e918";
202
+ }
203
+ .icon-msg_popup:before {
204
+ content: "\e91a";
205
+ }
206
+ .icon-protect:before {
207
+ content: "\e91b";
208
+ }
209
+ .icon-keys:before {
210
+ content: "\e91c";
211
+ }
212
+ .icon-info:before {
213
+ content: "\e91d";
214
+ }
215
+ .icon-tenats:before {
216
+ content: "\e91e";
217
+ }
218
+ .icon-profile:before {
219
+ content: "\e921";
220
+ }
221
+ .icon-msg:before {
222
+ content: "\e928";
223
+ }
224
+ .icon-arrow:before {
225
+ content: "\e929";
226
+ }
227
+ .icon-warning:before {
228
+ content: "\e92a";
229
+ }
230
+ .icon-messages:before {
231
+ content: "\e92b";
232
+ }
233
+ .icon-pause:before {
234
+ content: "\e92c";
235
+ }
236
+ .icon-play:before {
237
+ content: "\e92e";
238
+ }
239
+ .icon-store:before {
240
+ content: "\e930";
241
+ }
242
+ .icon-trash:before {
243
+ content: "\e931";
244
+ }
245
+ .icon-edit:before {
246
+ content: "\e932";
247
+ }
248
+ .icon-checked:before {
249
+ content: "\e933";
250
+ }
251
+ .icon-bell .path1:before {
252
+ content: "\e936";
253
+ }
254
+ .icon-bell .path2:before {
255
+ content: "\e937";
256
+ margin-left: -0.9658203125em;
257
+ }
258
+ .icon-bell .path3:before {
259
+ content: "\e938";
260
+ margin-left: -0.9658203125em;
261
+ }
262
+
263
+ /*#endregion img-font*/
264
+
265
+
4
266
  @import '../icons.scss';
5
267
  @import '../fonts.scss';
6
268
 
@@ -73,8 +335,8 @@
73
335
  @import "vendor/ngx-google-map.scss";
74
336
 
75
337
 
76
- $base-img-url: "/assets/images" !global;
77
- $assets-url: "/assets" !global;
338
+ // $base-img-url: "/assets/images" !global;
339
+ // $assets-url: "/assets" !global;
78
340
 
79
341
  .notification-block-header {
80
342
  border-bottom: 1px solid #e2e6ea;
@@ -1,5 +1,6 @@
1
1
  /*------------------------------------------------------------------
2
2
  [4. Cards]
3
+ $assets-url: "../../assets" ;
3
4
  */
4
5
 
5
6
  .card {
@@ -337,11 +338,11 @@
337
338
  }
338
339
  }
339
340
  .card-icon-refresh-lg-master {
340
- background-image: url("#{$base-img-url}/progress/progress-circle-lg-master-static.svg");
341
+ background-image: url("../../img/progress/progress-circle-lg-master-static.svg");
341
342
  }
342
343
 
343
344
  .card-icon-refresh-lg-white {
344
- background-image: url("#{$base-img-url}/progress/progress-circle-lg-white-static.svg");
345
+ background-image: url("../../img/progress/progress-circle-lg-white-static.svg");
345
346
  }
346
347
 
347
348
  .card-icon-refresh-lg-master-animated,
@@ -357,10 +358,10 @@
357
358
  }
358
359
  }
359
360
  .card-icon-refresh-lg-master-animated {
360
- background-image: url("#{$base-img-url}/progress/progress-circle-lg-master.svg");
361
+ background-image: url("../../img/progress/progress-circle-lg-master.svg");
361
362
  }
362
363
  .card-icon-refresh-lg-white-animated {
363
- background-image: url("#{$base-img-url}/progress/progress-circle-lg-white.svg");
364
+ background-image: url("../../img/progress/progress-circle-lg-white.svg");
364
365
  }
365
366
 
366
367
  /* For demo purpose only */