This is an automated email from the ASF dual-hosted git repository.
mcgilman pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/nifi.git
The following commit(s) were added to refs/heads/main by this push:
new 2ef31f2372 [NIFI-13371] update canvas context menu (#8949)
2ef31f2372 is described below
commit 2ef31f23724772c9776e565894fcdfb5224cffba
Author: Scott Aslan <[email protected]>
AuthorDate: Mon Jun 10 18:01:27 2024 -0500
[NIFI-13371] update canvas context menu (#8949)
This closes #8949
---
.../ui/common/context-menu/_context-menu.component-theme.scss | 10 ++++++++--
.../src/app/ui/common/context-menu/context-menu.component.html | 4 ++--
.../src/app/ui/common/context-menu/context-menu.component.scss | 1 -
.../src/main/frontend/apps/nifi/src/assets/styles/_app.scss | 6 +-----
4 files changed, 11 insertions(+), 10 deletions(-)
diff --git
a/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/_context-menu.component-theme.scss
b/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/_context-menu.component-theme.scss
index c580d79841..3223ad42cd 100644
---
a/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/_context-menu.component-theme.scss
+++
b/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/_context-menu.component-theme.scss
@@ -49,8 +49,14 @@
background-color: var(--mat-menu-container-color);
border-radius: 4px;
- .context-menu-item:hover {
- background-color: var(--mat-menu-item-hover-state-layer-color);
+ .context-menu-item {
+ .context-menu-item-text {
+ max-width: #{mat.get-theme-typography($material-theme, body-2,
font-size) * 20};
+ }
+
+ &:hover {
+ background-color: var(--mat-menu-item-hover-state-layer-color);
+ }
}
.context-menu-item:active {
diff --git
a/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/context-menu.component.html
b/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/context-menu.component.html
index f8d23dc50f..5f4579f63e 100644
---
a/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/context-menu.component.html
+++
b/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/context-menu.component.html
@@ -27,7 +27,7 @@
} @else {
@if (hasSubMenu(item)) {
@if (menuComponent.menu; as subMenu) {
- <button class="context-menu-item pl-1 pr-1 pt-2 pb-2"
cdkMenuItem [cdkMenuTriggerFor]="subMenu">
+ <button class="context-menu-item p-2" cdkMenuItem
[cdkMenuTriggerFor]="subMenu">
<div class="flex gap-x-1">
<div class="context-menu-item-img"
[class]="item.clazz"></div>
<div class="context-menu-item-text
surface-contrast" [title]="item.text">
@@ -43,7 +43,7 @@
[menuId]="item.subMenuId"></fd-context-menu>
} @else {
<button
- class="context-menu-item pl-1 pr-1 pt-2 pb-2 flex
justify-between"
+ class="context-menu-item p-2 flex justify-between"
(click)="menuItemClicked(item, $event)"
cdkMenuItem>
<div class="flex gap-x-1">
diff --git
a/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/context-menu.component.scss
b/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/context-menu.component.scss
index e2a0dfc0f8..d793dadc23 100644
---
a/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/context-menu.component.scss
+++
b/nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/context-menu/context-menu.component.scss
@@ -53,7 +53,6 @@ div.context-menu {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
- max-width: 258px;
}
.context-menu-group-item-img {
diff --git
a/nifi-frontend/src/main/frontend/apps/nifi/src/assets/styles/_app.scss
b/nifi-frontend/src/main/frontend/apps/nifi/src/assets/styles/_app.scss
index 42201a1112..621fcdfbdb 100644
--- a/nifi-frontend/src/main/frontend/apps/nifi/src/assets/styles/_app.scss
+++ b/nifi-frontend/src/main/frontend/apps/nifi/src/assets/styles/_app.scss
@@ -235,11 +235,7 @@
// support dark-mode browser default inputs (time, color, ...)
input {
- color-scheme: if(
- $is-dark,
- dark,
- light
- );
+ color-scheme: if($is-dark, dark, light);
}
// semantic classes for the material theme
