ontimize-web-ngx 15.0.0-beta.0 → 15.0.0-beta.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.
Files changed (39) hide show
  1. package/esm2020/lib/components/table/o-table.component.mjs +2 -2
  2. package/esm2020/lib/services/appearance.service.mjs +14 -2
  3. package/fesm2015/ontimize-web-ngx.mjs +14 -3
  4. package/fesm2015/ontimize-web-ngx.mjs.map +1 -1
  5. package/fesm2020/ontimize-web-ngx.mjs +14 -3
  6. package/fesm2020/ontimize-web-ngx.mjs.map +1 -1
  7. package/lib/services/appearance.service.d.ts +3 -0
  8. package/package.json +1 -1
  9. package/theme.scss +61 -155
  10. package/theming/{ontimize-theme.scss → ontimize-style-v8.scss} +32 -96
  11. package/theming/{implatform-fashion-theme.scss → ontimize-style.scss} +127 -32
  12. package/theming/styles/{lite/layout-lite.scss → layout.scss} +1 -1
  13. package/theming/styles/{fashion/typography-fashion.scss → ontimize/typography-ontimize.scss} +14 -4
  14. package/theming/styles/{lite/typography-lite.scss → ontimize-v8/containers.scss} +1 -97
  15. package/theming/styles/ontimize-v8/o-form-field-style.scss +52 -0
  16. package/theming/styles/ontimize-v8/o-table-style.scss +224 -0
  17. package/theming/styles/ontimize-v8/variables.scss +10 -0
  18. package/theming/styles/paginator.scss +4 -0
  19. package/theming/themes/fashion.scss +46 -0
  20. package/theming/themes/ontimize-black-yellow.scss +3 -5
  21. package/theming/themes/{ontimize-lite.scss → ontimize-blue.scss} +3 -14
  22. package/theming/themes/ontimize.scss +8 -16
  23. package/theming/{styles/lite/typography/ontimize-lite.scss → typography/ontimize.scss} +3 -3
  24. package/theming/ontimize-theme-flat.scss +0 -330
  25. package/theming/ontimize-theme-lite.scss +0 -40
  26. package/theming/styles/default/typography/ontimize.scss +0 -9
  27. package/theming/styles/flat/variables.scss +0 -8
  28. package/theming/styles/lite/form-field/o-form-field-theme.scss +0 -57
  29. package/theming/styles/lite/layout.scss +0 -70
  30. package/theming/styles/lite/paginator.scss +0 -6
  31. package/theming/themes/implatform-fashion-default-theme.scss +0 -148
  32. package/theming/themes/mat-deeppurple-amber.scss +0 -12
  33. package/theming/themes/mat-indigo-pink.scss +0 -11
  34. package/theming/themes/mat-pink-bluegrey.scss +0 -11
  35. package/theming/themes/mat-purple-green.scss +0 -11
  36. /package/theming/{styles/default/addons → addons}/charts-on-demand.scss +0 -0
  37. /package/theming/{styles/default/addons → addons}/report-on-demand.scss +0 -0
  38. /package/theming/styles/{fashion → ontimize}/variables.scss +0 -0
  39. /package/theming/{styles/default/typography → typography}/o-table-typography.scss +0 -0
@@ -1,148 +0,0 @@
1
- @use "sass:color";
2
- @use "sass:map";
3
- @use '@angular/material'as mat;
4
-
5
- @include mat.all-component-typographies();
6
- @include mat.core();
7
-
8
- //Definition primary and accent palettes
9
- $default-palette: (50: #e8e3f4,
10
- 100: #c5b9e4,
11
- 200: #9f8ad2,
12
- 300: #795bc0,
13
- 400: #5c37b3,
14
- 500: #3f14a5,
15
- 600: #39129d,
16
- 700: #310e93,
17
- 800: #290b8a,
18
- 900: #1b0679,
19
- A100: #b3a8ff,
20
- A200: #8775ff,
21
- A400: #5b42ff,
22
- A700: #4428ff,
23
- contrast: (50: #000000,
24
- 100: #000000,
25
- 200: #000000,
26
- 300: #ffffff,
27
- 400: #ffffff,
28
- 500: #ffffff,
29
- 600: #ffffff,
30
- 700: #ffffff,
31
- 800: #ffffff,
32
- 900: #ffffff,
33
- A100: #000000,
34
- A200: #000000,
35
- A400: #ffffff,
36
- A700: #ffffff,
37
- ),
38
- );
39
-
40
- // Define a theme.
41
- $primary: mat.define-palette($default-palette);
42
- $accent: mat.define-palette($default-palette);
43
-
44
-
45
- /*Application background-color*/
46
- $app-background-color: #eaeaea;
47
- /*Sidenav background-color*/
48
- $sidenav-background-color: #f5f5f5;
49
-
50
- // Background palette for light themes.
51
- @function fashion-light-theme-background($primary, $mat-theme) {
52
- $primary-500: mat.get-color-from-palette($primary, 500);
53
- $background: map.get($mat-theme, background);
54
- @return map.merge($background,
55
- (level-0: mix($app-background-color, $primary-500, 98%),
56
- level-04: #f2f2f2,
57
- level-06: #f6f6f6,
58
- level-08: #fafafa,
59
- level-1: white,
60
- sidenav-overlay: #525252,
61
- status-bar: mix($sidenav-background-color, mat.get-color-from-palette($primary), 97.2%),
62
- app-bar: mix($sidenav-background-color, mat.get-color-from-palette($primary), 97.2%),
63
- background: mix($app-background-color, mat.get-color-from-palette($primary), 97.2%)));
64
- }
65
-
66
- // Background palette for dark themes.
67
- @function fashion-dark-theme-background($primary, $mat-theme) {
68
- $primary-500: mat.get-color-from-palette($primary, 500);
69
- $background: map.get($mat-theme, background);
70
- @return map.merge($background,
71
- (level-0: mix(#171717, $primary-500, 94%),
72
- level-04: mix(#1E1E1E, $primary-500, 94%),
73
- level-06: mix(#2C2C2C, $primary-500, 94%),
74
- level-08: mix(#333333, $primary-500, 94%),
75
- level-1: mix(#383838, $primary-500, 94%),
76
- sidenav-overlay: #525252,
77
- status-bar: mix(#272727, $primary-500, 94%)));
78
- }
79
-
80
- // Foreground palette for light themes.
81
- $fashion-light-theme-foreground: (base: rgba(black, 0.6),
82
- divider: rgba(black, 0.12),
83
- dividers: rgba(black, 0.12),
84
- disabled: rgba(black, 0.38),
85
- disabled-button: rgba(black, 0.38),
86
- disabled-text: rgba(black, 0.38),
87
- elevation: black,
88
- hint-text: rgba(black, 0.38),
89
- secondary-text: rgba(black, 0.54),
90
- title: rgba(black, 0.87),
91
- icon: rgba(black, 0.6),
92
- icons: rgba(black, 0.6),
93
- text: rgba(black, 0.87),
94
- slider-min: rgba(black, 0.38),
95
- slider-off: rgba(black, 0.38),
96
- slider-off-active: rgba(black, 0.38),
97
- button: rgba(black, 0.74));
98
-
99
- // Foreground palette for dark themes.
100
- $fashion-dark-theme-foreground: (base: rgba(white, 0.6),
101
- divider: rgba(white, 0.12),
102
- dividers: rgba(white, 0.12),
103
- disabled: rgba(white, 0.38),
104
- disabled-button: rgba(white, 0.38),
105
- disabled-text: rgba(white, 0.38),
106
- elevation: black,
107
- hint-text: rgba(white, 0.38),
108
- secondary-text: rgba(white, 0.54),
109
- title: rgba(white, 0.87),
110
- icon: rgba(white, 0.6),
111
- icons: rgba(white, 0.6),
112
- text: rgba(white, 0.87),
113
- slider-min: rgba(white, 0.38),
114
- slider-off: rgba(white, 0.38),
115
- slider-off-active: rgba(white, 0.38),
116
- button: rgba(white, 0.74));
117
-
118
-
119
- // Creates a container object for a light theme to be given to individual component theme mixins.
120
- @function fashion-mat-light-theme($primary, $accent, $warn: mat.define-palette(mat.$red-palette)) {
121
- $mat-theme: mat.define-light-theme((color:(primary: $primary, accent: $accent, warn: $warn)));
122
- $color: map.get($mat-theme, color);
123
- @return (color:(primary: $primary,
124
- accent: $accent,
125
- warn: $warn,
126
- is-dark: false,
127
- foreground: $fashion-light-theme-foreground,
128
- background: fashion-light-theme-background($primary, $color)),
129
- typography:mat.define-typography-config())
130
- }
131
-
132
- // Creates a container object for a dark theme to be given to individual component theme mixins.
133
- @function fashion-mat-dark-theme($primary, $accent, $warn: mat.define-palette(mat.$red-palette)) {
134
- $mat-theme: mat.define-dark-theme((color:(primary: $primary, accent: $accent, warn: $warn)));
135
- $color: map.get($mat-theme, color);
136
- @return (color:(primary: $primary,
137
- accent: $accent,
138
- warn: $warn,
139
- is-dark: true,
140
- foreground: $fashion-dark-theme-foreground,
141
- background: fashion-dark-theme-background($primary, $color)),
142
- typography: mat.define-typography-config());
143
- }
144
-
145
- /* Light theme */
146
- $theme: fashion-mat-light-theme($primary, $accent);
147
- /* Dark theme */
148
- $dark-theme: fashion-mat-dark-theme($primary, $accent);
@@ -1,12 +0,0 @@
1
- @use '@angular/material'as mat;
2
- @use '../ontimize-theme.scss';
3
-
4
- @include mat.all-component-typographies();
5
- @include mat.core();
6
-
7
- $primary: mat.define-palette(mat.$deep-purple-palette);
8
- $accent: mat.define-palette(mat.$amber-palette, A200, A100, A400);
9
-
10
-
11
- $theme: ontimize-theme.o-mat-light-theme($primary, $accent);
12
- $dark-theme: ontimize-theme.o-mat-dark-theme($primary,$accent);
@@ -1,11 +0,0 @@
1
- @use '@angular/material'as mat;
2
- @use '../ontimize-theme.scss';
3
-
4
- @include mat.all-component-typographies();
5
- @include mat.core();
6
-
7
- $primary: mat.define-palette(mat.$indigo-palette);
8
- $accent: mat.define-palette(mat.$pink-palette, A200, A100, A400);
9
-
10
- $theme: ontimize-theme.o-mat-light-theme($primary, $accent);
11
- $dark-theme: ontimize-theme.o-mat-dark-theme($primary, $accent);
@@ -1,11 +0,0 @@
1
- @use '@angular/material'as mat;
2
- @use '../ontimize-theme.scss';
3
-
4
- @include mat.all-component-typographies();
5
- @include mat.core();
6
-
7
- $primary: mat.define-palette(mat.$pink-palette);
8
- $accent: mat.define-palette(mat.$blue-grey-palette, A200, A100, A400);
9
-
10
- $theme: ontimize-theme.o-mat-light-theme($primary, $accent);
11
- $dark-theme: ontimize-theme.o-mat-dark-theme($primary, $accent);
@@ -1,11 +0,0 @@
1
- @use '@angular/material'as mat;
2
- @use '../ontimize-theme.scss';
3
-
4
- @include mat.all-component-typographies();
5
- @include mat.core();
6
-
7
- $primary: mat.define-palette(mat.$purple-palette, 700, 500, 800);
8
- $accent: mat.define-palette(mat.$green-palette, A200, A100, A400);
9
-
10
- $theme: ontimize-theme.o-mat-light-theme($primary, $accent);
11
- $dark-theme: ontimize-theme.o-mat-dark-theme($primary, $accent);