rfellows commented on code in PR #9270:
URL: https://github.com/apache/nifi/pull/9270#discussion_r1768759050
##########
nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/flow-designer/ui/canvas/graph-controls/operation-control/operation-control.component.html:
##########
@@ -41,7 +41,7 @@
<div class="flex gap-x-1">
<button
mat-icon-button
- color="primary"
+ class="primary-icon-button mb-2"
Review Comment:
did you mean to add the `mb-2`? It adds a bit too much spacing between the
top row and bottom row of icon buttons in my opinion.
##########
nifi-frontend/src/main/frontend/apps/nifi/src/app/pages/flow-designer/ui/canvas/header/flow-status/_flow-status.component-theme.scss:
##########
@@ -18,103 +18,68 @@
@use 'sass:map';
@use '@angular/material' as mat;
-@mixin generate-theme($material-theme, $supplemental-theme) {
- // Get the color config from the theme.
- $material-theme-color-config: mat.m2-get-color-config($material-theme);
- $supplemental-theme-color-config:
mat.m2-get-color-config($supplemental-theme);
-
- // Get the color palette from the color-config.
- $material-theme-primary-palette: map.get($material-theme-color-config,
'primary');
- $material-theme-warn-palette: map.get($material-theme-color-config,
'warn');
- $supplemental-theme-surface-palette:
map.get($supplemental-theme-color-config, 'primary');
-
- // Get hues from palette
- $is-dark: map-get($supplemental-theme-color-config, is-dark);
- $material-theme-primary-palette-default:
mat.m2-get-color-from-palette($material-theme-primary-palette);
- $material-theme-primary-palette-lighter:
mat.m2-get-color-from-palette($material-theme-primary-palette, lighter);
- $material-theme-warn-palette-darker:
mat.m2-get-color-from-palette($material-theme-warn-palette, darker);
- $supplemental-theme-surface-palette-lighter: mat.m2-get-color-from-palette(
- $supplemental-theme-surface-palette,
- lighter
+@mixin generate-theme($material-theme, $config) {
+ $is-material-dark: if(mat.get-theme-type($material-theme) == dark, true,
false);
+ $material-theme-secondary-palette-darker: mat.get-theme-color(
+ $material-theme,
+ secondary,
+ map.get(map.get($config, secondary), darker)
+ );
+ $material-theme-secondary-palette-lighter: mat.get-theme-color(
+ $material-theme,
+ secondary,
+ map.get(map.get($config, secondary), lighter)
+ );
+ $material-theme-error-palette-default: mat.get-theme-color(
+ $material-theme,
+ error,
+ map.get(map.get($config, error), default)
);
- $supplemental-theme-surface-palette-darker: mat.m2-get-color-from-palette(
- $supplemental-theme-surface-palette,
- darker
+ $material-theme-error-palette-darker: mat.get-theme-color(
+ $material-theme,
+ error,
+ map.get(map.get($config, error), darker)
);
- $supplemental-theme-surface-palette-darker-contrast:
mat.m2-get-color-from-palette(
- $supplemental-theme-surface-palette,
- darker-contrast
+ $material-theme-neutral-palette-darker: mat.get-theme-color(
+ $material-theme,
+ neutral,
+ map.get(map.get($config, neutral), darker)
);
- $supplemental-theme-surface-palette-lighter-contrast:
mat.m2-get-color-from-palette(
- $supplemental-theme-surface-palette,
- lighter-contrast
+ $material-theme-neutral-palette-lighter: mat.get-theme-color(
+ $material-theme,
+ neutral,
+ map.get(map.get($config, neutral), lighter)
);
.flow-status {
background: if(
- $is-dark,
- $supplemental-theme-surface-palette-darker,
- $supplemental-theme-surface-palette-lighter
+ $is-material-dark,
+ $material-theme-neutral-palette-darker,
+ $material-theme-neutral-palette-lighter
);
.controller-bulletins {
background-color: if(
- $is-dark,
- $material-theme-primary-palette-lighter,
- $material-theme-primary-palette-default
+ $is-material-dark,
+ $material-theme-secondary-palette-lighter,
+ $material-theme-secondary-palette-darker
);
.fa {
// invert the contrast colors since the surface is dark in
light mode and light in dark mode
- color: if(
- $is-dark,
- $supplemental-theme-surface-palette-lighter-contrast,
- $supplemental-theme-surface-palette-darker-contrast
- );
+ color: mat.get-theme-color($material-theme, surface);
}
}
.controller-bulletins.has-bulletins {
- background-color: $material-theme-warn-palette-darker;
- }
-
- .flow-analysis-notifications.warn {
background-color: if(
- $is-dark,
- $material-theme-primary-palette-lighter,
- $material-theme-primary-palette-default
- );
- border-right-color: if(
- $is-dark,
- $supplemental-theme-surface-palette-lighter-contrast,
- $supplemental-theme-surface-palette-darker-contrast
+ $is-material-dark,
+ $material-theme-error-palette-default,
+ $material-theme-error-palette-darker
);
.fa {
- // invert the contrast colors since the surface is dark in
light mode and light in dark mode
- color: if(
- $is-dark,
- $supplemental-theme-surface-palette-lighter-contrast,
- $supplemental-theme-surface-palette-darker-contrast
- );
- }
- }
-
- .flow-analysis-notifications.enforce {
- background-color: $material-theme-warn-palette-darker;
- border-right-color: if(
- $is-dark,
- $supplemental-theme-surface-palette-lighter-contrast,
- $supplemental-theme-surface-palette-darker-contrast
- );
-
- .fa {
- // invert the contrast colors since the surface is dark in
light mode and light in dark mode
- color: if(
- $is-dark,
- $supplemental-theme-surface-palette-lighter-contrast,
- $supplemental-theme-surface-palette-darker-contrast
- );
Review Comment:
Was the removal of the flow-analysis-notifications styling intentional? I
expect these are still needed.
--
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]
