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.
- package/esm2020/lib/components/table/o-table.component.mjs +2 -2
- package/esm2020/lib/services/appearance.service.mjs +14 -2
- package/fesm2015/ontimize-web-ngx.mjs +14 -3
- package/fesm2015/ontimize-web-ngx.mjs.map +1 -1
- package/fesm2020/ontimize-web-ngx.mjs +14 -3
- package/fesm2020/ontimize-web-ngx.mjs.map +1 -1
- package/lib/services/appearance.service.d.ts +3 -0
- package/package.json +1 -1
- package/theme.scss +61 -155
- package/theming/{ontimize-theme.scss → ontimize-style-v8.scss} +32 -96
- package/theming/{implatform-fashion-theme.scss → ontimize-style.scss} +127 -32
- package/theming/styles/{lite/layout-lite.scss → layout.scss} +1 -1
- package/theming/styles/{fashion/typography-fashion.scss → ontimize/typography-ontimize.scss} +14 -4
- package/theming/styles/{lite/typography-lite.scss → ontimize-v8/containers.scss} +1 -97
- package/theming/styles/ontimize-v8/o-form-field-style.scss +52 -0
- package/theming/styles/ontimize-v8/o-table-style.scss +224 -0
- package/theming/styles/ontimize-v8/variables.scss +10 -0
- package/theming/styles/paginator.scss +4 -0
- package/theming/themes/fashion.scss +46 -0
- package/theming/themes/ontimize-black-yellow.scss +3 -5
- package/theming/themes/{ontimize-lite.scss → ontimize-blue.scss} +3 -14
- package/theming/themes/ontimize.scss +8 -16
- package/theming/{styles/lite/typography/ontimize-lite.scss → typography/ontimize.scss} +3 -3
- package/theming/ontimize-theme-flat.scss +0 -330
- package/theming/ontimize-theme-lite.scss +0 -40
- package/theming/styles/default/typography/ontimize.scss +0 -9
- package/theming/styles/flat/variables.scss +0 -8
- package/theming/styles/lite/form-field/o-form-field-theme.scss +0 -57
- package/theming/styles/lite/layout.scss +0 -70
- package/theming/styles/lite/paginator.scss +0 -6
- package/theming/themes/implatform-fashion-default-theme.scss +0 -148
- package/theming/themes/mat-deeppurple-amber.scss +0 -12
- package/theming/themes/mat-indigo-pink.scss +0 -11
- package/theming/themes/mat-pink-bluegrey.scss +0 -11
- package/theming/themes/mat-purple-green.scss +0 -11
- /package/theming/{styles/default/addons → addons}/charts-on-demand.scss +0 -0
- /package/theming/{styles/default/addons → addons}/report-on-demand.scss +0 -0
- /package/theming/styles/{fashion → ontimize}/variables.scss +0 -0
- /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);
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|