@theseam/ui-common 0.3.14-beta.2 → 0.3.15-beta.0

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": "@theseam/ui-common",
3
- "version": "0.3.14-beta.2",
3
+ "version": "0.3.15-beta.0",
4
4
  "peerDependencies": {
5
5
  "@angular/cdk": "^12.0.2",
6
6
  "@angular/common": "^12.0.2",
@@ -19,7 +19,7 @@
19
19
  "dependencies": {
20
20
  "@fortawesome/angular-fontawesome": "~0.9.0",
21
21
  "@marklb/file-type": "~10.6.5",
22
- "@marklb/ngx-datatable": "~18.0.1",
22
+ "@marklb/ngx-datatable": "~18.0.4",
23
23
  "@marklb/ngx-loading": "^10.0.0",
24
24
  "@ng-select/ng-select": "~6.1.0",
25
25
  "@ng-bootstrap/ng-bootstrap": "~9.1.1",
@@ -143,9 +143,6 @@
143
143
  .datatable-body {
144
144
  .datatable-row-left {
145
145
  background-color: $datatable-left-background;
146
- background-image: $datatable-left-background-image;
147
- background-position: $datatable-left-background-position;
148
- background-repeat: $datatable-left-background-repeat;
149
146
  }
150
147
 
151
148
  .datatable-row-even .datatable-row-left {
@@ -154,9 +151,6 @@
154
151
 
155
152
  .datatable-row-right {
156
153
  background-color: $datatable-right-background;
157
- background-image: $datatable-right-background-image;
158
- background-position: $datatable-right-background-position;
159
- background-repeat: $datatable-right-background-repeat;
160
154
  }
161
155
 
162
156
  .datatable-row-even .datatable-row-right {
@@ -276,6 +270,9 @@
276
270
  color: $datatable-body-cell-color;
277
271
  font-size: $datatable-body-cell-font-size;
278
272
  font-weight: $datatable-body-cell-font-weight;
273
+ .datatable-body-cell-label {
274
+ height: 100%;
275
+ }
279
276
  }
280
277
  .datatable-body-group-cell {
281
278
  vertical-align: top;
@@ -484,8 +481,41 @@
484
481
  // }
485
482
 
486
483
  .datatable-action-button {
487
- color: $datatable-action-button-color;
488
- background-color: $datatable-action-button-background;
484
+ flex: 0 0 auto;
485
+
486
+ @if $datatable-action-button-outline {
487
+ @include button-outline-variant(
488
+ $color: $datatable-action-button-outline-color,
489
+ $color-hover: $datatable-action-button-outline-color-hover,
490
+ $active-background: $datatable-action-button-outline-active-background,
491
+ $active-border: $datatable-action-button-outline-active-border
492
+ );
493
+
494
+ // allow variable override for outline button bg
495
+ background: $datatable-action-button-outline-background;
496
+
497
+ } @else {
498
+ @include button-variant(
499
+ $background: $datatable-action-button-background,
500
+ $border: $datatable-action-button-border,
501
+ $hover-background: $datatable-action-button-hover-background,
502
+ $hover-border: $datatable-action-button-hover-border,
503
+ $active-background: $datatable-action-button-active-background,
504
+ $active-border: $datatable-action-button-active-border
505
+ );
506
+
507
+ // allow variable override for solid button color
508
+ color: $datatable-action-button-color;
509
+
510
+ &:hover {
511
+ color: $datatable-action-button-hover-color;
512
+ }
513
+
514
+ &:not(:disabled):not(.disabled):active {
515
+ color: $datatable-action-button-active-color;
516
+ }
517
+ }
518
+
489
519
  box-shadow: $datatable-action-button-box-shadow;
490
520
  font-size: $datatable-action-button-font-size;
491
521
  line-height: $datatable-action-button-line-height;
@@ -496,10 +526,6 @@
496
526
  padding: $datatable-action-button-padding;
497
527
  border-radius: $datatable-action-button-border-radius;
498
528
  text-align: $datatable-action-button-text-align;
499
- &:hover {
500
- color: $datatable-action-button-hover-color;
501
- background-color: $datatable-action-button-hover-background;
502
- }
503
529
  }
504
530
 
505
531
  /**
@@ -10,18 +10,12 @@ $datatable-color: $body-color !default;
10
10
 
11
11
  // common datatable colors
12
12
  $datatable-background: $white !default;
13
- $datatable-left-background: $datatable-background !default;
14
- $datatable-left-background-position: 100% 0 !default;
15
- $datatable-left-background-repeat: repeat-y !default;
16
- $datatable-left-background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAYAAAD5PA/NAAAAFklEQVQIHWPSkNeSBmJhTQVtbiDNCgASagIIuJX8OgAAAABJRU5ErkJggg==) !default;
17
- $datatable-right-background: $datatable-background !default;
18
- $datatable-right-background-position: 0 0 !default;
19
- $datatable-right-background-repeat: repeat-y !default;
20
- $datatable-right-background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAYAAAD5PA/NAAAAFklEQVQI12PQkNdi1VTQ5gbSwkAsDQARLAIGtOSFUAAAAABJRU5ErkJggg==) !default;
21
- $datatable-box-shadow: none !default;
22
13
  $datatable-row-even-background: rgba(0, 0, 0, 0.05) !default;
23
- $datatable-left-row-even-background: $datatable-row-even-background !default;
24
- $datatable-right-row-even-background: $datatable-row-even-background !default;
14
+ $datatable-left-background: transparent !default;
15
+ $datatable-left-row-even-background: $datatable-left-background !default;
16
+ $datatable-right-background: transparent !default;
17
+ $datatable-right-row-even-background: $datatable-right-background !default;
18
+ $datatable-box-shadow: none !default;
25
19
 
26
20
  // default row and cell background colors
27
21
  $datatable-default-background: $white !default;
@@ -177,11 +171,27 @@ $datatable-summary-row-background: #ddd !default;
177
171
  $datatable-summary-row-background-hover: #ddd !default;
178
172
  $datatable-summary-row-font-weight: bold !default;
179
173
 
180
- $datatable-action-button-color: $body-color !default;
181
- $datatable-action-button-background: transparent !default;
174
+ // Action Menu Button Styles
175
+ $datatable-action-button-background: $primary !default;
176
+ $datatable-action-button-border: $datatable-action-button-background !default;
177
+ $datatable-action-button-hover-background: darken($datatable-action-button-background, 7.5%) !default;
178
+ $datatable-action-button-hover-border: darken($datatable-action-button-border, 10%) !default;
179
+ $datatable-action-button-active-background: darken($datatable-action-button-background, 10%) !default;
180
+ $datatable-action-button-active-border: darken($datatable-action-button-border, 12.5%) !default;
181
+
182
+ $datatable-action-button-color: color-yiq($datatable-action-button-background) !default;
183
+ $datatable-action-button-hover-color: color-yiq($datatable-action-button-hover-background) !default;
184
+ $datatable-action-button-active-color: color-yiq($datatable-action-button-active-background) !default;
185
+
186
+ $datatable-action-button-outline: false !default;
187
+ $datatable-action-button-outline-color: $datatable-action-button-background !default;
188
+ $datatable-action-button-outline-color-hover: color-yiq($datatable-action-button-outline-color) !default;
189
+ $datatable-action-button-outline-active-background: $datatable-action-button-outline-color !default;
190
+ $datatable-action-button-outline-active-border: $datatable-action-button-outline-color !default;
191
+
192
+ $datatable-action-button-outline-background: transparent !default;
193
+
182
194
  $datatable-action-button-box-shadow: none !default;
183
- $datatable-action-button-hover-color: $primary !default;
184
- $datatable-action-button-hover-background: $gray-300 !default;
185
195
  $datatable-action-button-font-size: 20px !default;
186
196
  $datatable-action-button-line-height: 1 !default;
187
197
  $datatable-action-button-size: 30px !default;