You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@nifi.apache.org by mt...@apache.org on 2022/10/03 20:24:46 UTC
[nifi] branch main updated: NIFI-10577 Fix Sensitive Checkbox rendering for Fetch Parameters (#6473)
This is an automated email from the ASF dual-hosted git repository.
mtien 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 7a01e22125 NIFI-10577 Fix Sensitive Checkbox rendering for Fetch Parameters (#6473)
7a01e22125 is described below
commit 7a01e22125d8f235906319301bd01c0ccb68f529
Author: exceptionfactory <ex...@apache.org>
AuthorDate: Mon Oct 3 15:24:36 2022 -0500
NIFI-10577 Fix Sensitive Checkbox rendering for Fetch Parameters (#6473)
* NIFI-10577 Fixed Sensitive Checkbox rendering for Fetch Parameters
- Corrected rendering of Sensitive status checkbox on Firefox using standard nf-checkbox
* NIFI-10577 Corrected canvas rendering in Safari
Merged #6473 in main.
---
.../src/main/webapp/css/parameter-provider.css | 76 +++-------------------
.../webapp/js/nf/canvas/nf-parameter-provider.js | 12 ++--
2 files changed, 14 insertions(+), 74 deletions(-)
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/parameter-provider.css b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/parameter-provider.css
index 368ddb433b..993195e0ab 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/parameter-provider.css
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/css/parameter-provider.css
@@ -325,14 +325,6 @@ span.parameter-provider-referencing-component-name {
width: 332px;
}
-#selectable-parameters-table .slick-cell-checkboxsel {
- padding: 1px 2px 5px 4px;
-}
-
-#selectable-parameters-table .slick-cell-checkboxsel.selected {
- padding: 0px 2px 6px 4px;
-}
-
#selectable-parameters-table .slick-column-name input {
margin: 5px 3px 3px 4px;
}
@@ -341,60 +333,6 @@ span.parameter-provider-referencing-component-name {
overflow-x: hidden;
}
-#selectable-parameters-table input[type="checkbox"] {
- margin-top: 2px;
- width: 0;
-}
-
-#selectable-parameters-table input[type="checkbox"]:focus {
- box-shadow: none;
- border: none;
-}
-
-#selectable-parameters-table .slick-column-name input[type="checkbox"] {
- margin-top: 5px;
-}
-
-#selectable-parameters-table .slick-column-name input[checked="checked"]:before {
- margin-top: 2px;
-}
-
-#selectable-parameters-table input[type="checkbox"]:before {
- content: url(../images/inputCheckbox.png);
- cursor: pointer;
- clip-path: polygon(0% -16%, 50% -16%, 50% 104%, 0% 104%);
- position: absolute;
- margin-left: 1px;
- margin-top: 3px;
-}
-
-#selectable-parameters-table input[checked="checked"]:before {
- content: url(../images/inputCheckbox.png);
- cursor: pointer;
- clip-path: polygon(50% -16%, 100% -16%, 100% 116%, 50% 116%);
- margin-left: -11px;
- margin-top: 3px;
-}
-
-#selectable-parameters-table input[type="checkbox"].disabled:before {
- content: url(../images/inputCheckbox.png);
- opacity: .5;
- cursor: not-allowed;
- clip-path: polygon(0% -16%, 50% -16%, 50% 104%, 0% 104%);
- position: absolute;
- margin-left: 1px;
- margin-top: 3px;
-}
-
-#selectable-parameters-table input[checked="checked"].disabled:before {
- content: url(../images/inputCheckbox.png);
- opacity: .5;
- cursor: not-allowed;
- clip-path: polygon(50% -16%, 100% -16%, 100% 116%, 50% 116%);
- margin-left: -11px;
- margin-top: 3px;
-}
-
#parameter-groups-table .slick-pane-top .slick-viewport-top .grid-canvas-top,
#selectable-parameters-table .slick-pane-top .slick-viewport .grid-canvas-top {
width: 100% !important;
@@ -408,12 +346,6 @@ span.parameter-provider-referencing-component-name {
margin-top: 5px;
}
-#fetched-parameters-listing .slick-cell-checkboxsel {
- background: #f0f0f0;
- border-right-color: silver;
- border-right-style: solid;
-}
-
.slick-columnpicker {
border: 1px solid #718BB7;
background: #f0f0f0;
@@ -494,3 +426,11 @@ button.selectable-parameters-buttons:hover {
max-width: calc(100% - 230px);
z-index: 999;
}
+
+#selectable-parameters-table .slick-cell-checkbox.selected {
+ padding-top: 1px;
+}
+
+.slick-cell-checkbox .nf-checkbox {
+ margin-top: 5px;
+}
diff --git a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-parameter-provider.js b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-parameter-provider.js
index 0d324d420d..0457745a1b 100644
--- a/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-parameter-provider.js
+++ b/nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-ui/src/main/webapp/js/nf/canvas/nf-parameter-provider.js
@@ -2427,23 +2427,23 @@
if (dataContext) {
if (dataContext.status === 'REMOVED' || dataContext.status === 'MISSING_BUT_REFERENCED') {
// disable checkboxes
- return "<input type='checkbox' class='disabled unchecked-input-disabled' disabled><label for='selector'></label>";
+ return '<div class="disabled nf-checkbox checkbox-unchecked"></div>';
}
if (_.isEmpty(dataContext.parameterStatus) || _.isEmpty(dataContext.parameterStatus.parameter.parameter.referencingComponents)) {
if (dataContext.sensitivity === SENSITIVE) {
- return "<input type='checkbox' checked='checked' class='checked-input-enabled'><label for='selector'></label>";
+ return '<div class="checked-input-enabled nf-checkbox checkbox-checked"></div>';
} else {
- return "<input type='checkbox' class='unchecked-input-enabled'><label for='selector'></label>";
+ return '<div class="unchecked-input-enabled nf-checkbox checkbox-unchecked"></div>';
}
}
if (!_.isEmpty(dataContext.parameterStatus.parameter.parameter.referencingComponents)) {
// disable checkboxes
if (dataContext.sensitivity === SENSITIVE) {
- return "<input type='checkbox' checked='checked' class='disabled checked-input-disabled' disabled><label for='selector'></label>";
+ return '<div class="disabled nf-checkbox checkbox-checked"></div>';
} else {
- return "<input type='checkbox' class='disabled unchecked-input-disabled' disabled><label for='selector'></label>";
+ return '<div class="disabled nf-checkbox checkbox-unchecked"></div>';
}
}
@@ -2474,7 +2474,7 @@
width: 30,
resizable: false,
sortable: false,
- cssClass: 'slick-cell-checkboxsel',
+ cssClass: 'slick-cell-checkbox slick-cell-checkboxsel',
hideSelectAllCheckbox: false,
formatter: checkboxSelectionFormatter
}