neo.mjs 4.6.1 → 4.6.3

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 (29) hide show
  1. package/README.md +0 -8
  2. package/docs/app/view/MainContainerController.mjs +12 -11
  3. package/docs/app/view/classdetails/SourceViewComponent.mjs +12 -12
  4. package/examples/form/field/text/MainContainer.mjs +6 -0
  5. package/examples/toast/MainContainer.mjs +136 -0
  6. package/examples/toast/MainContainerController.mjs +95 -0
  7. package/examples/toast/app.mjs +7 -0
  8. package/examples/toast/index.html +27 -0
  9. package/examples/toast/neo-config.json +7 -0
  10. package/examples/toast/resources/highlight/CHANGES.md +1739 -0
  11. package/examples/toast/resources/highlight/LICENSE +24 -0
  12. package/examples/toast/resources/highlight/README.md +186 -0
  13. package/examples/toast/resources/highlight/highlight.pack.js +2 -0
  14. package/examples/toast/resources/highlightjs-custom-dark-theme.css +120 -0
  15. package/examples/toast/resources/highlightjs-custom-github-theme.css +136 -0
  16. package/package.json +1 -1
  17. package/resources/scss/src/dialog/Toast.scss +132 -106
  18. package/resources/scss/src/form/field/Text.scss +130 -24
  19. package/resources/scss/theme-dark/dialog/Toast.scss +13 -0
  20. package/resources/scss/theme-dark/form/field/Text.scss +54 -34
  21. package/resources/scss/theme-light/dialog/Toast.scss +25 -0
  22. package/resources/scss/theme-light/form/field/Text.scss +54 -34
  23. package/src/collection/Base.mjs +0 -1
  24. package/src/component/Base.mjs +1 -17
  25. package/src/dialog/Toast.mjs +140 -68
  26. package/src/form/field/CheckBox.mjs +3 -3
  27. package/src/form/field/Text.mjs +51 -21
  28. package/src/main/addon/HighlightJS.mjs +28 -15
  29. package/src/manager/Toast.mjs +1 -1
package/resources/scss/src/dialog/Toast.scss CHANGED
@@ -1,164 +1,190 @@
1
1
  .neo-toast {
2
- // todo: theming
3
- --toast-background-color: lightblue;
4
- --toast-color : #083741;
5
-
6
- align-items : center;
7
- background-color: var(--toast-background-color);
8
- border-radius : 0.5rem;
9
- box-shadow : 0 0.25rem 0.5rem rgba(0, 0, 0, 0.15);
10
- color : var(--toast-color);
11
- display : flex;
12
- position : fixed;
2
+ z-index: 20; // ensure to be on top of table headers
3
+ align-items: center;
4
+ background-color: v(toast-background-color);
5
+ border-radius: 0.5rem;
6
+ box-shadow: 0 0.25rem 0.5rem v(toast-shadow-color);
7
+ color: v(toast-color);
8
+ display: flex;
9
+ position: fixed;
10
+
11
+ .neo-toast-inner {
12
+ align-items: center;
13
+ display: flex;
14
+
15
+ &.neo-toast-has-title {
16
+ .neo-toast-text {
17
+ text-align: left;
18
+ }
19
+ }
13
20
 
14
21
  & > div {
15
- background-color: transparent;
16
-
17
- .neo-toast-inner {
18
- align-items: center;
19
- display : flex;
20
-
21
- &.neo-toast-has-title {
22
- .neo-toast-text {
23
- text-align: left;
24
- }
25
- }
26
-
27
- & > div {
28
- padding: 0.25em 0.5em;
29
- }
30
-
31
- .neo-toast-icon {
32
- border-right: 2px solid var(--toast-color);
33
- flex : 1;
34
- font-size : 1.5em;
35
- }
36
-
37
- .neo-toast-text {
38
- padding : 0.25em 1em;
39
- text-align: center;
40
-
41
- .neo-toast-msg {
42
- font-size: 0.8em;
43
- }
44
-
45
- .neo-toast-title {
46
- padding-bottom: 0.2em;
47
- }
48
- }
49
-
50
- .neo-toast-close {
51
- background : transparent;
52
- border : 0;
53
- color : inherit;
54
- cursor : pointer;
55
- font-size : 1.5rem;
56
- line-height: 1.5;
57
- margin-left: auto;
58
- }
59
- }
22
+ padding: 0.25em 0.5em;
23
+ }
24
+
25
+ .neo-toast-icon {
26
+ border-right: 2px solid v(toast-color);
27
+ flex: 1;
28
+ font-size: 1.5em;
29
+ }
30
+
31
+ .neo-toast-text {
32
+ padding: 0.25em 1em;
33
+ text-align: center;
34
+
35
+ .neo-toast-msg {
36
+ font-size: 0.8em;
37
+ }
38
+
39
+ .neo-toast-title {
40
+ padding-bottom: 0.2em;
41
+ text-transform: uppercase;
42
+ }
43
+ }
44
+
45
+ .neo-toast-close {
46
+ background: transparent;
47
+ border: 0;
48
+ color: inherit;
49
+ cursor: pointer;
50
+ font-size: 1.5rem;
51
+ line-height: 1.5;
52
+ margin-left: auto;
53
+ }
54
+ }
55
+ }
56
+
57
+ // ui: danger
58
+ .neo-toast-danger {
59
+ background-color: v(toast-danger-background-color);
60
+ color: v(toast-danger-color);
61
+
62
+ & > div {
63
+
64
+ .neo-toast-inner {
65
+
66
+ .neo-toast-icon {
67
+ border-right: 2px solid v(toast-danger-color);
68
+ }
60
69
  }
70
+ }
71
+ }
72
+
73
+ // ui: success
74
+ .neo-toast-success {
75
+ background-color: v(toast-success-background-color);
76
+ color: v(toast-success-color);
77
+
78
+ & > div {
79
+
80
+ .neo-toast-inner {
81
+
82
+ .neo-toast-icon {
83
+ border-right: 2px solid v(toast-success-color);
84
+ }
85
+ }
86
+ }
61
87
  }
62
88
 
63
89
  /* Toast positions */
64
90
  .neo-toast-tr {
65
- right: 1rem;
66
- top : 1rem;
91
+ right: 1rem;
92
+ top: 1rem;
67
93
  }
68
94
 
69
95
  .neo-toast-tc {
70
- left : 50%;
71
- top : 1rem;
72
- transform: translateX(-50%);
96
+ left: 50%;
97
+ top: 1rem;
98
+ transform: translateX(-50%);
73
99
  }
74
100
 
75
101
  .neo-toast-tl {
76
- left: 1rem;
77
- top : 1rem;
102
+ left: 1rem;
103
+ top: 1rem;
78
104
  }
79
105
 
80
106
  .neo-toast-br {
81
- bottom: 1rem;
82
- right : 1rem;
107
+ bottom: 1rem;
108
+ right: 1rem;
83
109
  }
84
110
 
85
111
  .neo-toast-bc {
86
- bottom : 1rem;
87
- left : 50%;
88
- transform: translateX(-50%);
112
+ bottom: 1rem;
113
+ left: 50%;
114
+ transform: translateX(-50%);
89
115
  }
90
116
 
91
117
  .neo-toast-bl {
92
- bottom: 1rem;
93
- left : 1rem;
118
+ bottom: 1rem;
119
+ left: 1rem;
94
120
  }
95
121
 
96
122
  /* Toast slide-in animation */
97
123
  @keyframes neo-toast-slide-down-in {
98
- from {
99
- transform: translateY(-150%);
100
- }
101
- to {
102
- transform: translateY(0);
103
- }
124
+ from {
125
+ transform: translateY(-150%);
126
+ }
127
+ to {
128
+ transform: translateY(0);
129
+ }
104
130
  }
105
131
 
106
132
  @keyframes neo-toast-slide-up-in {
107
- from {
108
- transform: translateY(150%);
109
- }
110
- to {
111
- transform: translateY(0);
112
- }
133
+ from {
134
+ transform: translateY(150%);
135
+ }
136
+ to {
137
+ transform: translateY(0);
138
+ }
113
139
  }
114
140
 
115
141
  @keyframes neo-toast-slide-left-in {
116
- from {
117
- transform: translateX(-150%);
118
- }
119
- to {
120
- transform: translateX(0);
121
- }
142
+ from {
143
+ transform: translateX(-150%);
144
+ }
145
+ to {
146
+ transform: translateX(0);
147
+ }
122
148
  }
123
149
 
124
150
  @keyframes neo-toast-slide-right-in {
125
- from {
126
- transform: translateX(150%);
127
- }
128
- to {
129
- transform: translateX(0);
130
- }
151
+ from {
152
+ transform: translateX(150%);
153
+ }
154
+ to {
155
+ transform: translateX(0);
156
+ }
131
157
  }
132
158
 
133
159
  /* Add the slide-in animation to the toast when the slide-in class is added */
134
160
  .neo-toast-slide-down-in {
135
- animation: neo-toast-slide-down-in 0.25s ease-out;
161
+ animation: neo-toast-slide-down-in 0.25s ease-out;
136
162
  }
137
163
 
138
164
  .neo-toast-slide-up-in {
139
- animation: neo-toast-slide-up-in 0.25s ease-out;
165
+ animation: neo-toast-slide-up-in 0.25s ease-out;
140
166
  }
141
167
 
142
168
  .neo-toast-slide-left-in {
143
- animation: neo-toast-slide-left-in 0.25s ease-out;
169
+ animation: neo-toast-slide-left-in 0.25s ease-out;
144
170
  }
145
171
 
146
172
  .neo-toast-slide-right-in {
147
- animation: neo-toast-slide-right-in 0.25s ease-out;
173
+ animation: neo-toast-slide-right-in 0.25s ease-out;
148
174
  }
149
175
 
150
176
  /* Toast fade-out animation */
151
177
  @keyframes neo-toast-fade-out {
152
- from {
153
- opacity: 1;
154
- }
155
- to {
156
- opacity: 0;
157
- }
178
+ from {
179
+ opacity: 1;
180
+ }
181
+ to {
182
+ opacity: 0;
183
+ }
158
184
  }
159
185
 
160
186
  /* Add the fade-out animation to the toast when the fade-out class is added */
161
187
  .neo-toast-fade-out {
162
- animation : neo-toast-fade-out 0.25s ease-out;
163
- animation-fill-mode: forwards;
188
+ animation: neo-toast-fade-out 0.25s ease-out;
189
+ animation-fill-mode: forwards;
164
190
  }
package/resources/scss/src/form/field/Text.scss CHANGED
@@ -11,13 +11,44 @@
11
11
  border-color: v(textfield-border-color-active) !important;
12
12
  outline : v(textfield-outline-active);
13
13
  }
14
+
15
+ .neo-label-wrapper { // labelPosition: inline
16
+ .neo-textfield-input {
17
+ border-color: transparent;
18
+ }
19
+ }
20
+
21
+ .neo-textfield-input {
22
+ border-color: v(textfield-border-color-active);
23
+ outline : v(textfield-outline-active);
24
+ }
14
25
  }
15
26
 
16
27
  &.neo-hovered {
17
28
  &:not(&.neo-focus) {
18
- .neo-input-wrapper {
19
- border-color: v(textfield-border-color-hovered) !important;
20
- outline : v(textfield-outline-hovered);
29
+ &:not(&.label-inline) {
30
+ .neo-input-wrapper {
31
+ border-color: v(textfield-border-color-hovered) !important;
32
+ outline : v(textfield-outline-hovered);
33
+ }
34
+ }
35
+
36
+ .neo-label-wrapper {
37
+ .neo-center-border, .neo-left-border, .neo-right-border {
38
+ border-bottom-color: v(textfield-border-color-hovered);
39
+ }
40
+
41
+ .neo-left-border, .neo-right-border {
42
+ border-top-color: v(textfield-border-color-hovered);
43
+ }
44
+
45
+ .neo-left-border {
46
+ border-left-color: v(textfield-border-color-hovered);
47
+ }
48
+
49
+ .neo-right-border {
50
+ border-right-color: v(textfield-border-color-hovered);
51
+ }
21
52
  }
22
53
  }
23
54
  }
@@ -54,6 +85,82 @@
54
85
  }
55
86
  }
56
87
 
88
+ &.neo-disabled {
89
+ opacity: v(textfield-opacity-disabled);
90
+
91
+ &.label-inline {
92
+ .neo-label-wrapper {
93
+ .neo-center-border, .neo-left-border, .neo-right-border {
94
+ border-bottom-color: v(textfield-border-color-disabled);
95
+ }
96
+
97
+ .neo-left-border, .neo-right-border {
98
+ border-top-color: v(textfield-border-color-disabled);
99
+ }
100
+
101
+ .neo-left-border {
102
+ border-left-color: v(textfield-border-color-disabled);
103
+ }
104
+
105
+ .neo-right-border {
106
+ border-right-color: v(textfield-border-color-disabled);
107
+ }
108
+ }
109
+ }
110
+
111
+ .neo-input-wrapper {
112
+ background-color: v(textfield-input-background-color-disabled);
113
+ border-color : v(textfield-border-color-disabled);
114
+ }
115
+
116
+ .neo-textfield-input {
117
+ background-color: v(textfield-input-background-color-disabled);
118
+ color : v(textfield-input-color-disabled);
119
+ }
120
+
121
+ .neo-textfield-label {
122
+ color: v(textfield-label-color-disabled);
123
+ }
124
+ }
125
+
126
+ &.neo-readonly {
127
+ opacity: v(textfield-opacity-readonly);
128
+
129
+ &.label-inline {
130
+ .neo-label-wrapper {
131
+ .neo-center-border, .neo-left-border, .neo-right-border {
132
+ border-bottom-color: v(textfield-border-color-readonly);
133
+ }
134
+
135
+ .neo-left-border, .neo-right-border {
136
+ border-top-color: v(textfield-border-color-readonly);
137
+ }
138
+
139
+ .neo-left-border {
140
+ border-left-color: v(textfield-border-color-readonly);
141
+ }
142
+
143
+ .neo-right-border {
144
+ border-right-color: v(textfield-border-color-readonly);
145
+ }
146
+ }
147
+ }
148
+
149
+ .neo-input-wrapper {
150
+ background-color: v(textfield-input-background-color-readonly);
151
+ border-color : v(textfield-border-color-readonly);
152
+ }
153
+
154
+ .neo-textfield-input {
155
+ background-color: v(textfield-input-background-color-readonly);
156
+ color : v(textfield-input-color-readonly);
157
+ }
158
+
159
+ .neo-textfield-label {
160
+ color: v(textfield-label-color-readonly);
161
+ }
162
+ }
163
+
57
164
  &.label-bottom {
58
165
  align-items : stretch;
59
166
  flex-direction : column-reverse;
@@ -95,7 +202,7 @@
95
202
 
96
203
  .neo-textfield-label {
97
204
  color : v(textfield-border-color-active) !important;
98
- transform: translateX(4px) translateY(-65%) scale(.7);
205
+ transform: translateX(4px) translateY(calc(-62% - 0.5 * v(textfield-border-width))) scale(.7);
99
206
  }
100
207
  }
101
208
 
@@ -106,7 +213,7 @@
106
213
 
107
214
  .neo-textfield-label {
108
215
  color : #777;
109
- transform: translateX(4px) translateY(-65%) scale(.7);
216
+ transform: translateX(4px) translateY(calc(-62% - 0.5 * v(textfield-border-width))) scale(.7);
110
217
  }
111
218
  }
112
219
 
@@ -120,27 +227,31 @@
120
227
 
121
228
  .neo-label-wrapper {
122
229
  display : flex;
123
- height : 27px;
230
+ height : calc(v(textfield-input-height) + v(textfield-border-width) * 2);
124
231
  position: absolute;
125
232
  width : 100%;
126
233
 
127
234
  .neo-center-border {
128
- border-bottom: 1px solid v(textfield-border-color);
129
- border-top : 1px solid v(textfield-border-color);
235
+ border-bottom: v(textfield-border-width) solid v(textfield-border-color);
236
+ border-top : v(textfield-border-width) solid v(textfield-border-color);
130
237
  flex : 0 0 auto;
131
238
  }
132
239
 
133
240
  .neo-left-border {
134
- border : 1px solid v(textfield-border-color);
135
- border-right: 0;
136
- flex : 0 0 auto;
137
- width : 12px
241
+ border : v(textfield-border-width) solid v(textfield-border-color);
242
+ border-bottom-left-radius: v(textfield-border-radius);
243
+ border-right : 0;
244
+ border-top-left-radius : v(textfield-border-radius);
245
+ flex : 0 0 auto;
246
+ width : calc(11px + v(textfield-border-width));
138
247
  }
139
248
 
140
249
  .neo-right-border {
141
- border : 1px solid v(textfield-border-color);
142
- border-left: 0;
143
- flex : 1 0 auto;
250
+ border : v(textfield-border-width) solid v(textfield-border-color);
251
+ border-bottom-right-radius: v(textfield-border-radius);
252
+ border-left : 0;
253
+ border-top-right-radius : v(textfield-border-radius);
254
+ flex : 1 0 auto;
144
255
  }
145
256
  }
146
257
 
@@ -150,10 +261,6 @@
150
261
  margin : 0; // important for Safari => #1125
151
262
  padding-left : 16px;
152
263
  z-index : 1;
153
-
154
- &:focus{ // todo: switch to .neo-focus
155
- border-color: transparent;
156
- }
157
264
  }
158
265
 
159
266
  .neo-textfield-label {
@@ -201,7 +308,7 @@
201
308
  flex-grow : 1;
202
309
  flex-shrink : 1;
203
310
  margin : 0; // important for Safari => #1125
204
- min-height : 25px;
311
+ min-height : v(textfield-input-height);
205
312
  width : 30px;
206
313
  }
207
314
  }
@@ -216,7 +323,7 @@
216
323
 
217
324
  .neo-textfield-input {
218
325
  background-color: v(textfield-input-background-color);
219
- border : 1px solid v(textfield-border-color);
326
+ border : v(textfield-border-width) solid v(textfield-border-color);
220
327
  border-radius : v(textfield-border-radius);
221
328
  color : v(textfield-input-color);
222
329
  font : v(textfield-input-font);
@@ -225,9 +332,8 @@
225
332
  transition : 250ms border-color cubic-bezier(0.4, 0, 0.2, 1);
226
333
  width : 140px;
227
334
 
228
- &:focus{
229
- border-color: #5d83a7;
230
- outline : none;
335
+ &:focus {
336
+ outline: none;
231
337
  }
232
338
 
233
339
  &::-webkit-input-placeholder {
package/resources/scss/theme-dark/dialog/Toast.scss ADDED
@@ -0,0 +1,13 @@
1
+ $neoMap: map-merge($neoMap, (
2
+ 'toast-background-color' : #083741,
3
+ 'toast-color' : lightblue,
4
+ 'toast-shadow-color' : rgba(255, 255, 255, 0.15)
5
+ ));
6
+
7
+ @if $useCssVars == true {
8
+ :root .neo-theme-dark { // .neo-button
9
+ --toast-background-color : #{neo(toast-background-color)};
10
+ --toast-color : #{neo(toast-color)};
11
+ --toast-shadow-color : #{neo(toast-shadow-color)};
12
+ }
13
+ }
package/resources/scss/theme-dark/form/field/Text.scss CHANGED
@@ -1,41 +1,61 @@
1
1
  $neoMap: map-merge($neoMap, (
2
- 'textfield-border-color' : #424242,
3
- 'textfield-border-color-active' : #5d83a7,
4
- 'textfield-border-color-hovered' : #424242,
5
- 'textfield-border-color-invalid' : brown,
6
- 'textfield-border-radius' : 0,
7
- 'textfield-border-width' : 1px,
8
- 'textfield-input-background-color' : #2b2b2b,
9
- 'textfield-input-color' : #ccc,
10
- 'textfield-input-font' : 400 13px/17px Arial,
11
- 'textfield-input-height' : 25px,
12
- 'textfield-input-padding' : 3px 6px 2px,
13
- 'textfield-input-placeholder-color' : #ccc,
14
- 'textfield-input-placeholder-opacity': 0.6,
15
- 'textfield-label-color' : #bbb,
16
- 'textfield-label-top-margin' : 0 0 3px,
17
- 'textfield-outline-active' : none,
18
- 'textfield-outline-hovered' : none
2
+ 'textfield-border-color' : #424242,
3
+ 'textfield-border-color-active' : #5d83a7,
4
+ 'textfield-border-color-disabled' : #424242,
5
+ 'textfield-border-color-hovered' : #424242,
6
+ 'textfield-border-color-invalid' : brown,
7
+ 'textfield-border-color-readonly' : #424242,
8
+ 'textfield-border-radius' : 0,
9
+ 'textfield-border-width' : 1px,
10
+ 'textfield-input-background-color' : #2b2b2b,
11
+ 'textfield-input-background-color-disabled': #2b2b2b,
12
+ 'textfield-input-background-color-readonly': #222,
13
+ 'textfield-input-color' : #ccc,
14
+ 'textfield-input-color-disabled' : #ccc,
15
+ 'textfield-input-color-readonly' : #ccc,
16
+ 'textfield-input-font' : 400 13px/17px Arial,
17
+ 'textfield-input-height' : 25px,
18
+ 'textfield-input-padding' : 3px 6px 2px,
19
+ 'textfield-input-placeholder-color' : #ccc,
20
+ 'textfield-input-placeholder-opacity' : 0.6,
21
+ 'textfield-label-color' : #bbb,
22
+ 'textfield-label-color-disabled' : #bbb,
23
+ 'textfield-label-color-readonly' : #bbb,
24
+ 'textfield-label-top-margin' : 0 0 3px,
25
+ 'textfield-opacity-disabled' : #{neo(neo-disabled-opacity)},
26
+ 'textfield-opacity-readonly' : 1,
27
+ 'textfield-outline-active' : none,
28
+ 'textfield-outline-hovered' : none
19
29
  ));
20
30
 
21
31
  @if $useCssVars == true {
22
32
  :root .neo-theme-dark { // .neo-textfield
23
- --textfield-border-color : #{neo(textfield-border-color)};
24
- --textfield-border-color-active : #{neo(textfield-border-color-active)};
25
- --textfield-border-color-hovered : #{neo(textfield-border-color-hovered)};
26
- --textfield-border-color-invalid : #{neo(textfield-border-color-invalid)};
27
- --textfield-border-radius : #{neo(textfield-border-radius)};
28
- --textfield-border-width : #{neo(textfield-border-width)};
29
- --textfield-input-background-color : #{neo(textfield-input-background-color)};
30
- --textfield-input-color : #{neo(textfield-input-color)};
31
- --textfield-input-font : #{neo(textfield-input-font)};
32
- --textfield-input-height : #{neo(textfield-input-height)};
33
- --textfield-input-padding : #{neo(textfield-input-padding)};
34
- --textfield-input-placeholder-color : #{neo(textfield-input-placeholder-color)};
35
- --textfield-input-placeholder-opacity: #{neo(textfield-input-placeholder-opacity)};
36
- --textfield-label-color : #{neo(textfield-label-color)};
37
- --textfield-label-top-margin : #{neo(textfield-label-top-margin)};
38
- --textfield-outline-active : #{neo(textfield-outline-active)};
39
- --textfield-outline-hovered : #{neo(textfield-outline-hovered)};
33
+ --textfield-border-color : #{neo(textfield-border-color)};
34
+ --textfield-border-color-active : #{neo(textfield-border-color-active)};
35
+ --textfield-border-color-disabled : #{neo(textfield-border-color-disabled)};
36
+ --textfield-border-color-hovered : #{neo(textfield-border-color-hovered)};
37
+ --textfield-border-color-invalid : #{neo(textfield-border-color-invalid)};
38
+ --textfield-border-color-readonly : #{neo(textfield-border-color-readonly)};
39
+ --textfield-border-radius : #{neo(textfield-border-radius)};
40
+ --textfield-border-width : #{neo(textfield-border-width)};
41
+ --textfield-input-background-color : #{neo(textfield-input-background-color)};
42
+ --textfield-input-background-color-disabled: #{neo(textfield-input-background-color-disabled)};
43
+ --textfield-input-background-color-readonly: #{neo(textfield-input-background-color-readonly)};
44
+ --textfield-input-color : #{neo(textfield-input-color)};
45
+ --textfield-input-color-disabled : #{neo(textfield-input-color-disabled)};
46
+ --textfield-input-color-readonly : #{neo(textfield-input-color-readonly)};
47
+ --textfield-input-font : #{neo(textfield-input-font)};
48
+ --textfield-input-height : #{neo(textfield-input-height)};
49
+ --textfield-input-padding : #{neo(textfield-input-padding)};
50
+ --textfield-input-placeholder-color : #{neo(textfield-input-placeholder-color)};
51
+ --textfield-input-placeholder-opacity : #{neo(textfield-input-placeholder-opacity)};
52
+ --textfield-label-color : #{neo(textfield-label-color)};
53
+ --textfield-label-color-disabled : #{neo(textfield-label-color-disabled)};
54
+ --textfield-label-color-readonly : #{neo(textfield-label-color-readonly)};
55
+ --textfield-label-top-margin : #{neo(textfield-label-top-margin)};
56
+ --textfield-opacity-disabled : #{neo(textfield-opacity-disabled)};
57
+ --textfield-opacity-readonly : #{neo(textfield-opacity-readonly)};
58
+ --textfield-outline-active : #{neo(textfield-outline-active)};
59
+ --textfield-outline-hovered : #{neo(textfield-outline-hovered)};
40
60
  }
41
61
  }
package/resources/scss/theme-light/dialog/Toast.scss ADDED
@@ -0,0 +1,25 @@
1
+ $neoMap: map-merge($neoMap, (
2
+ 'toast-background-color' : lightblue,
3
+ 'toast-color' : #083741,
4
+ 'toast-shadow-color' : rgba(0, 0, 0, 0.15),
5
+ // ui: danger
6
+ 'toast-danger-background-color' : #e6adad,
7
+ 'toast-danger-color' : #410808,
8
+ // ui: success
9
+ 'toast-success-background-color' : #b7e6ad,
10
+ 'toast-success-color' : #124108,
11
+ ));
12
+
13
+ @if $useCssVars == true {
14
+ :root .neo-theme-light { // .neo-button
15
+ --toast-background-color : #{neo(toast-background-color)};
16
+ --toast-color : #{neo(toast-color)};
17
+ --toast-shadow-color : #{neo(toast-shadow-color)};
18
+ // ui: danger
19
+ --toast-danger-background-color : #{neo(toast-danger-background-color)};
20
+ --toast-danger-color : #{neo(toast-danger-color)};
21
+ // ui: success
22
+ --toast-success-background-color : #{neo(toast-success-background-color)};
23
+ --toast-success-color : #{neo(toast-success-color)};
24
+ }
25
+ }