rfellows commented on code in PR #8721:
URL: https://github.com/apache/nifi/pull/8721#discussion_r1586818369
##########
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/assets/styles/_app.scss:
##########
@@ -261,56 +281,43 @@
//
// NOTE: nifi surface palette lighter/darker is purposefully omitted here.
Any application of nifi surface colors should be as a background-color to a
surface DOM element. The surface color should switch from light to dark
depending on the mode for the theme.
- .nifi-surface-default {
+ .surface-color {
color: $nifi-theme-surface-palette-default;
fill: $nifi-theme-surface-palette-default;
}
- .nifi-success-default {
+ .success-color {
color: $nifi-theme-success-palette-default;
fill: $nifi-theme-success-palette-default;
}
- .nifi-success-lighter {
+ .success-color-lighter {
color: $nifi-theme-success-palette-lighter;
fill: $nifi-theme-success-palette-lighter;
}
- .nifi-success-darker {
+ .success-color-darker {
color: $nifi-theme-success-palette-darker;
fill: $nifi-theme-success-palette-darker;
}
- .nifi-warn-default {
- color: $nifi-theme-warn-palette-default;
- fill: $nifi-theme-warn-palette-default;
+ .caution-color {
+ color: $nifi-theme-caution-palette-default;
+ fill: $nifi-theme-caution-palette-default;
Review Comment:
what is the guidance for using the warn vs the caution colors?
##########
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/bulletins/ui/bulletin-board/bulletin-board-list/bulletin-board-list.component.ts:
##########
@@ -148,7 +148,7 @@ export class BulletinBoardList implements AfterViewInit {
case 'warning':
return 'bulletin-warn';
Review Comment:
should this one use the `caution-color`
##########
nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/assets/themes/material.scss:
##########
@@ -50,8 +50,33 @@ $material-primary-light-palette: (
A700: #ffffff,
)
);
+
$material-accent-light-palette: mat.$brown-palette;
-$warn-light-palette: mat.$red-palette;
+
+$warn-light-palette: (
+ 50: #ffebee,
+ 100: #ffccd2,
+ 200: #f49999,
+ 300: #eb7071,
+ 400: #f64e4c,
+ 500: #fa3b30,
+ 600: #ec3030,
+ 700: #ff1507,
+ 800: #ff0000,
+ 900: #ba554a, // g.component rect.border.unauthorized,
#connection-full-drop-shadow feFlood, text.restricted, g.connection
rect.border.unauthorized, g.connection path.connection-path.full, g.connection
path.connection-path.unauthorized, .controller-bulletins.has-bulletins,
path.link.selected, g.event circle.selected
+ contrast: (
+ 50: rgba(#000000, 0.87),
+ 100: rgba(#000000, 0.87),
+ 200: rgba(#000000, 0.87),
+ 300: rgba(#000000, 0.87),
+ 400: #ffffff,
+ 500: #ffffff,
+ 600: #ffffff,
+ 700: #ffffff,
+ 800: #ffffff,
+ 900: #ffffff
+ )
+);
Review Comment:
The red is very bright in dark mode:
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
