@ngx-stoui/core 21.0.2 → 21.0.4

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/ngx-datatable.css CHANGED
@@ -248,6 +248,7 @@
248
248
  margin: 0;
249
249
  top: 0;
250
250
  left: 0;
251
+ z-index: 1;
251
252
  }
252
253
  .sto-mdl-table__progress-bar__container {
253
254
  display: block;
@@ -256,6 +257,7 @@
256
257
  width: 100%;
257
258
  height: 5px;
258
259
  transform: translate(0, 0) scale(1, 1);
260
+ background-color: var(--accent-highlight, rgb(170, 209, 249));
259
261
  }
260
262
  .sto-mdl-table__progress-bar__container__bar {
261
263
  position: absolute;
@@ -266,6 +268,7 @@
266
268
  height: 5px;
267
269
  transition: transform 0.2s linear;
268
270
  animation: query 0.8s infinite cubic-bezier(0.39, 0.575, 0.565, 1);
271
+ background-color: var(--primary-resting, rgb(16, 108, 200));
269
272
  }
270
273
  .sto-mdl-table__body--empty {
271
274
  margin: 8px;
package/ngx-stoui.css CHANGED
@@ -150,6 +150,11 @@ span.spacer {
150
150
  flex-grow: 1;
151
151
  }
152
152
 
153
+ html,
154
+ body {
155
+ font: 400 13px/24px var(--application-font);
156
+ }
157
+
153
158
  body {
154
159
  margin-left: 0;
155
160
  margin-right: 0;
@@ -166,29 +171,46 @@ input::-webkit-inner-spin-button {
166
171
  }
167
172
 
168
173
  h1 {
169
- font-size: 1.7rem;
174
+ --mat-sys-body-large-size: 1.7rem;
175
+ --mat-sys-body-large-line-height: 1.4;
176
+ --mat-sys-body-large-weight: 400;
177
+ font: var(--mat-sys-body-large-weight) var(--mat-sys-body-large-size)/var(--mat-sys-body-large-line-height) var(--application-font);
170
178
  }
171
179
 
172
180
  h2 {
173
- font-size: 1.5rem;
174
- font-weight: normal;
181
+ --mat-sys-body-large-size: 1.6rem;
182
+ --mat-sys-body-large-line-height: 1.4;
183
+ --mat-sys-body-large-weight: 400;
184
+ font: var(--mat-sys-body-large-weight) var(--mat-sys-body-large-size)/var(--mat-sys-body-large-line-height) var(--application-font);
175
185
  }
176
186
 
177
187
  h3 {
178
- font-size: 1.2rem;
188
+ --mat-sys-body-large-size: 1.53846rem;
189
+ --mat-sys-body-large-line-height: 1.4;
190
+ --mat-sys-body-large-weight: 400;
191
+ font: var(--mat-sys-body-large-weight) var(--mat-sys-body-large-size)/var(--mat-sys-body-large-line-height) var(--application-font);
179
192
  margin: 0;
180
193
  }
181
194
 
182
195
  h4 {
183
- font-size: 1rem;
196
+ --mat-sys-body-large-size: 1.23077rem;
197
+ --mat-sys-body-large-line-height: 1.4;
198
+ --mat-sys-body-large-weight: 400;
199
+ font: var(--mat-sys-body-large-weight) var(--mat-sys-body-large-size)/var(--mat-sys-body-large-line-height) var(--application-font);
184
200
  }
185
201
 
186
202
  h5 {
187
- font-size: 0.9rem;
203
+ --mat-sys-body-large-size: 0.9rem;
204
+ --mat-sys-body-large-line-height: 1;
205
+ --mat-sys-body-large-weight: 400;
206
+ font: var(--mat-sys-body-large-weight) var(--mat-sys-body-large-size)/var(--mat-sys-body-large-line-height) var(--application-font);
188
207
  }
189
208
 
190
209
  h6 {
191
- font-size: 0.8rem;
210
+ --mat-sys-body-large-size: 0.8rem;
211
+ --mat-sys-body-large-line-height: 1.25;
212
+ --mat-sys-body-large-weight: 400;
213
+ font: var(--mat-sys-body-large-weight) var(--mat-sys-body-large-size)/var(--mat-sys-body-large-line-height) var(--application-font);
192
214
  }
193
215
 
194
216
  html body.mat-app-background {
@@ -873,6 +895,7 @@ body {
873
895
  margin: 0;
874
896
  top: 0;
875
897
  left: 0;
898
+ z-index: 1;
876
899
  }
877
900
  .sto-mdl-table__progress-bar__container {
878
901
  display: block;
@@ -881,6 +904,7 @@ body {
881
904
  width: 100%;
882
905
  height: 5px;
883
906
  transform: translate(0, 0) scale(1, 1);
907
+ background-color: var(--accent-highlight, rgb(170, 209, 249));
884
908
  }
885
909
  .sto-mdl-table__progress-bar__container__bar {
886
910
  position: absolute;
@@ -891,6 +915,7 @@ body {
891
915
  height: 5px;
892
916
  transition: transform 0.2s linear;
893
917
  animation: query 0.8s infinite cubic-bezier(0.39, 0.575, 0.565, 1);
918
+ background-color: var(--primary-resting, rgb(16, 108, 200));
894
919
  }
895
920
  .sto-mdl-table__body--empty {
896
921
  margin: 8px;
@@ -2208,11 +2233,10 @@ span.sortable {
2208
2233
  --mat-timepicker-container-background-color: var(--mat-sys-surface-container);
2209
2234
  --mat-timepicker-container-elevation-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
2210
2235
  --application-font: Equinor, Roboto, sans-serif;
2211
- font-size: 13px;
2212
- font-family: var(--application-font);
2213
2236
  --mat-sys-body-large-font: var(--application-font);
2237
+ --mat-sys-body-large-weight: 400;
2214
2238
  --mat-sys-body-large-size: 1rem;
2215
- --mat-sys-body-large-line-height: 1.25;
2239
+ --mat-sys-body-large-line-height: 1.55;
2216
2240
  --mat-sys-label-medium-font: var(--application-font);
2217
2241
  --mat-sys-label-medium-size: 1.25rem;
2218
2242
  --mat-sys-label-medium-line-height: 1.333;
@@ -2364,11 +2388,16 @@ span.sortable {
2364
2388
  }
2365
2389
 
2366
2390
  .sto-sm-typography {
2391
+ font: 400 10px/20px var(--application-font);
2367
2392
  font-size: 10px;
2368
2393
  }
2369
2394
 
2395
+ .sto-m-typography {
2396
+ font: 400 13px/24px var(--application-font);
2397
+ }
2398
+
2370
2399
  .sto-l-typography {
2371
- font-size: 16px;
2400
+ font: 400 16px/28px var(--application-font);
2372
2401
  }
2373
2402
 
2374
2403
  .mat-elevation-z0, .mat-mdc-elevation-specific.mat-elevation-z0 {
@@ -2582,10 +2611,6 @@ body,
2582
2611
  .sto-datatable {
2583
2612
  font-feature-settings: "tnum", "lnum";
2584
2613
  }
2585
- .sto-datatable .datatable-header mat-icon,
2586
- .sto-datatable .datatable-body mat-icon {
2587
- color: var(--text-secondary);
2588
- }
2589
2614
  .sto-datatable .datatable-header {
2590
2615
  background: var(--bg-light);
2591
2616
  border-bottom: var(--mat-table-row-item-outline-width, 1px) solid var(--mat-table-row-item-outline-color, var(--divider));
@@ -2596,11 +2621,36 @@ body,
2596
2621
  .sto-datatable .datatable-header .datatable-header-column-group .datatable-header-cell {
2597
2622
  border-left: var(--mat-table-row-item-outline-width, 1px) solid var(--mat-table-row-item-outline-color, var(--divider));
2598
2623
  }
2624
+ .sto-datatable .datatable-body .progress-linear {
2625
+ display: block;
2626
+ position: sticky;
2627
+ width: 100%;
2628
+ height: 5px;
2629
+ padding: 0;
2630
+ margin: 0;
2631
+ top: 0;
2632
+ left: 0;
2633
+ z-index: 1;
2634
+ }
2599
2635
  .sto-datatable .datatable-body .progress-linear .container {
2600
- background-color: var(--accent-highlight);
2636
+ display: block;
2637
+ position: relative;
2638
+ overflow: hidden;
2639
+ width: 100%;
2640
+ height: 5px;
2641
+ transform: translate(0, 0) scale(1, 1);
2642
+ background-color: var(--accent-highlight, rgb(170, 209, 249));
2601
2643
  }
2602
2644
  .sto-datatable .datatable-body .progress-linear .container .bar {
2603
- background-color: var(--primary-resting);
2645
+ position: absolute;
2646
+ left: 0;
2647
+ top: 0;
2648
+ bottom: 0;
2649
+ width: 100%;
2650
+ height: 5px;
2651
+ transition: transform 0.2s linear;
2652
+ animation: query 0.8s infinite cubic-bezier(0.39, 0.575, 0.565, 1);
2653
+ background-color: var(--primary-resting, rgb(16, 108, 200));
2604
2654
  }
2605
2655
  .sto-datatable .datatable-body .datatable-body-row {
2606
2656
  color: var(--mat-table-row-item-label-text-color, var(--text));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ngx-stoui/core",
3
- "version": "21.0.2",
3
+ "version": "21.0.4",
4
4
  "author": {
5
5
  "name": "Ronnie Laugen",
6
6
  "email": "rhenri@equinor.com"