@elderbyte/ngx-starter 19.1.0-beta.4 → 19.1.0-beta.6

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 (8) hide show
  1. package/fesm2022/elderbyte-ngx-starter.mjs +5 -23
  2. package/fesm2022/elderbyte-ngx-starter.mjs.map +1 -1
  3. package/lib/components/shell/shell/elder-shell.component.d.ts +1 -9
  4. package/package.json +1 -1
  5. package/src/lib/components/data-view/table/elder-table/elder-table.component.scss +4 -4
  6. package/src/lib/components/panels/elder-dialog-panel/elder-dialog-panel.component.scss +1 -1
  7. package/theming/style-tweaks/_elder-style-fixes.scss +1 -1
  8. package/theming/system/_elder-design-tokens.scss +33 -3
package/lib/components/shell/shell/elder-shell.component.d.ts CHANGED
@@ -28,13 +28,6 @@ export declare class ElderShellCenterDirective {
28
28
  static ɵfac: i0.ɵɵFactoryDeclaration<ElderShellCenterDirective, never>;
29
29
  static ɵdir: i0.ɵɵDirectiveDeclaration<ElderShellCenterDirective, "[elderShellCenter]", never, {}, {}, never, never, true, never>;
30
30
  }
31
- export declare class ElderShellInnerSideNavDirective {
32
- templateRef: TemplateRef<any>;
33
- viewContainer: ViewContainerRef;
34
- constructor(templateRef: TemplateRef<any>, viewContainer: ViewContainerRef);
35
- static ɵfac: i0.ɵɵFactoryDeclaration<ElderShellInnerSideNavDirective, never>;
36
- static ɵdir: i0.ɵɵDirectiveDeclaration<ElderShellInnerSideNavDirective, "[elderShellInnerSideNav]", never, {}, {}, never, never, true, never>;
37
- }
38
31
  export declare class ElderShellComponent implements OnInit, OnDestroy {
39
32
  private shellService;
40
33
  private outletDrawerService;
@@ -54,7 +47,6 @@ export declare class ElderShellComponent implements OnInit, OnDestroy {
54
47
  sideContentLeft: TemplateRef<any>;
55
48
  sideContentRight: TemplateRef<any>;
56
49
  centerContent: TemplateRef<any>;
57
- innerSideNav: TemplateRef<any>;
58
50
  rightSideDrawer: MatSidenav;
59
51
  rightSideOutletName: string;
60
52
  leftSideContentOpen$: Observable<boolean>;
@@ -105,5 +97,5 @@ export declare class ElderShellComponent implements OnInit, OnDestroy {
105
97
  private isContained;
106
98
  private checkSoon;
107
99
  static ɵfac: i0.ɵɵFactoryDeclaration<ElderShellComponent, never>;
108
- static ɵcmp: i0.ɵɵComponentDeclaration<ElderShellComponent, "elder-shell", never, { "sideNavToggleEnabled": { "alias": "sideNavToggleEnabled"; "required": false; }; "leftSideAutoFocus": { "alias": "leftSideAutoFocus"; "required": false; }; "rightSideAutoFocus": { "alias": "rightSideAutoFocus"; "required": false; }; "color": { "alias": "color"; "required": false; }; "menuColor": { "alias": "menuColor"; "required": false; }; "menuIconColor": { "alias": "menuIconColor"; "required": false; }; }, {}, ["sideContentLeft", "sideContentRight", "centerContent", "innerSideNav"], ["[innerSideNav]"], true, never>;
100
+ static ɵcmp: i0.ɵɵComponentDeclaration<ElderShellComponent, "elder-shell", never, { "sideNavToggleEnabled": { "alias": "sideNavToggleEnabled"; "required": false; }; "leftSideAutoFocus": { "alias": "leftSideAutoFocus"; "required": false; }; "rightSideAutoFocus": { "alias": "rightSideAutoFocus"; "required": false; }; "color": { "alias": "color"; "required": false; }; "menuColor": { "alias": "menuColor"; "required": false; }; "menuIconColor": { "alias": "menuIconColor"; "required": false; }; }, {}, ["sideContentLeft", "sideContentRight", "centerContent"], never, true, never>;
109
101
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elderbyte/ngx-starter",
3
- "version": "19.1.0-beta.4",
3
+ "version": "19.1.0-beta.6",
4
4
  "peerDependencies": {
5
5
  "@angular/core": "^18.0.0 || ^19.0.0",
6
6
  "@angular/common": "^18.0.0 || ^19.0.0",
package/src/lib/components/data-view/table/elder-table/elder-table.component.scss CHANGED
@@ -83,7 +83,7 @@
83
83
  }
84
84
 
85
85
  .elder-table-row:hover {
86
- background-color: var(--md-sys-color-surface-container);
86
+ background-color: var(--elder-color-highlight-dim);
87
87
  cursor: pointer;
88
88
  }
89
89
 
@@ -93,7 +93,7 @@
93
93
  outline-style: none;
94
94
  td {
95
95
  background-color: var(
96
- --md-sys-color-primary-container
96
+ --elder-color-highlight
97
97
  ); // OLD: background-color: mat.m2-get-color-from-palette($accent, default, 0.3);
98
98
  border-bottom: var(
99
99
  --md-sys-color-tertiary-fixed
@@ -102,11 +102,11 @@
102
102
  }
103
103
  .elder-table-row.elder-table-row-activated {
104
104
  //background-color: var(--md-sys-color-surface-dim);
105
- background-color: var(--md-sys-color-primary-container);
105
+ background-color: var(--elder-color-highlight);
106
106
  }
107
107
 
108
108
  .elder-table-row.elder-table-row-selected {
109
- background-color: var(--md-sys-color-primary-container);
109
+ background-color: var(--elder-color-highlight);
110
110
  }
111
111
 
112
112
  .elder-mat-table-flat {
package/src/lib/components/panels/elder-dialog-panel/elder-dialog-panel.component.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  .elder-dialog-panel {
2
- background-color: var(--md-sys-color-surface-container-lowest);
2
+ background-color: var(--elder-dialog-panel-bg-color);
3
3
  color: var(--md-sys-color-on-surface);
4
4
 
5
5
  padding: 10px;
package/theming/style-tweaks/_elder-style-fixes.scss CHANGED
@@ -376,6 +376,6 @@
376
376
 
377
377
  &.elder-light-theme,
378
378
  &.elder-dark-theme {
379
- --mdc-linear-progress-track-color: var(--md-sys-color-secondary-fixed-dim);
379
+ --mdc-linear-progress-track-color: var(--elder-color-highlight-dim);
380
380
  }
381
381
  }
package/theming/system/_elder-design-tokens.scss CHANGED
@@ -55,22 +55,52 @@
55
55
  --elder-toolbar-main-nav-button-color: var(--md-sys-color-on-primary);
56
56
  --elder-toolbar-main-nav-button-container-bg-color: var(--md-sys-color-primary);
57
57
 
58
+ // custom colors
59
+ --elder-blue: rgb(11, 40, 79);
60
+ --elder-gold: rgb(182, 159, 106);
61
+ --elder-gold-darkest: #423d32;
62
+ --elder-gold-semi-dark: #7f7054;
63
+
64
+ --elder-color-highlight: var(--md-sys-color-primary-container);
65
+ --elder-color-highlight-dim: rgb(232, 239, 255);
66
+
67
+ // missing md3 color
68
+ --md-sys-color-on-primary-fixed-dim: var(--md-sys-color-on-surface);
69
+
70
+ // dialog
71
+ --elder-dialog-panel-bg-color: var(md-sys-color-surface-container-low);
72
+
73
+ &.elder-dark-theme {
74
+ --elder-dialog-panel-bg-color: var(--md-sys-color-surface-container);
75
+ }
76
+
58
77
  // light theme overwrites
59
78
  &.elder-light-theme {
60
- --md-sys-color-primary: rgb(11, 40, 79);
61
- --md-sys-color-tertiary: rgb(182, 159, 106);
79
+ --md-sys-color-primary: var(--elder-blue);
80
+ --md-sys-color-tertiary: var(--elder-gold);
62
81
  }
63
82
 
64
83
  // dark theme overwrites
65
84
  &.elder-dark-theme {
66
- --md-sys-color-primary-container: #826e38; // lighten up dark mode container color
85
+ --mat-sidenav-scrim-color: rgba(255, 255, 255, 0.4);
86
+ //--md-sys-color-primary-container: #d2cab4; // lighten up dark mode container color
87
+ --md-sys-color-primary-container: var(--elder-gold-semi-dark);
88
+ --md-sys-color-primary-fixed-dim: var(--elder-gold-darkest);
89
+ --elder-color-highlight-dim: var(--elder-gold-darkest);
90
+ --elder-color-highlight: var(--elder-gold-semi-dark);
91
+ --md-sys-color-tertiary-fixed-dim: var(--md-sys-color-primary-fixed-dim);
92
+ --md-sys-color-on-primary-fixed-dim: var(--md-sys-color-on-surface);
67
93
  --md-sys-color-tertiary-container: var(--md-sys-color-primary-container);
68
94
  --md-sys-color-surface-container-highest: #191919;
69
95
  --md-sys-color-surface-container-lowest: #262626;
70
96
  --md-sys-color-error: #FF999F;
97
+ --md-sys-color-inverse-primary: var(--md-sys-color-primary-container);
98
+ --md-sys-color-surface-tint: var(--elder-gold-darkest);
71
99
  --elder-dark-gray: var(--md-sys-color-surface-container);
72
100
  --mdc-chip-outline-color: rgba(255, 255, 255, 0.3);
73
101
 
102
+
103
+
74
104
  // dark mode specific colors
75
105
  --elder-dark-mode-color-primary: var(--md-sys-color-primary);
76
106
  --elder-dark-mode-color-on-primary: var(--md-sys-color-on-primary);