Apache
/
nifi
mirror of https://github.com/apache/nifi.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

NIFI-12721 Button UX (#8464) 

* NIFI-12721 Button UX

Updated all the dialog buttons to change them from stroked and raised to basic. This better aligns with Angular Material guidelines and should address the confusion between disabled and cancelled.

* NiFi-12721 incremental update

Changed the combo editor and editor components to use the flat button styles. Missed them before because I was looking for dialogs.

Also caught a style bleed with button:disabled that should be button.nifi-button:disabled and updated that.

* Consolidated the button.nifi-button:disabled rules

Also ran Prettier to improve markup in a few spots
This commit is contained in:
James Mingardi-Elliott 2024-03-06 17:11:07 -05:00 committed by GitHub
parent ac6c9c6ca4
commit e2e54f2bc8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
47 changed files with 89 additions and 106 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/access-policies/ui/common/add-tenant-to-policy-dialog/add-tenant-to-policy-dialog.component.html
View File

@ -48,9 +48,9 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button mat-stroked-button mat-dialog-close color="primary">Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
mat-raised-button
mat-button
[disabled]="addTenantsForm.invalid || saving.value"
(click)="addClicked()"
color="primary">

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/access-policies/ui/common/override-policy-dialog/override-policy-dialog.component.html
View File

@ -25,8 +25,8 @@
</mat-radio-group>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-stroked-button mat-dialog-close color="primary">Cancel</button>
<button mat-raised-button [disabled]="overridePolicyForm.invalid" (click)="overrideClicked()" color="primary">
<button mat-button mat-dialog-close>Cancel</button>
<button mat-button [disabled]="overridePolicyForm.invalid" (click)="overrideClicked()" color="primary">
Override
</button>
</mat-dialog-actions>

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-configuration-history/ui/flow-configuration-history-listing/action-details/action-details.component.html
View File

@ -206,7 +206,7 @@
</ng-template>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button color="primary" mat-raised-button mat-dialog-close>Ok</button>
<button color="primary" mat-button mat-dialog-close>Ok</button>
</mat-dialog-actions>
</div>
</div>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-configuration-history/ui/flow-configuration-history-listing/purge-history/purge-history.component.html
View File

@ -50,12 +50,12 @@
</mat-dialog-content>
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
color="primary"
(click)="submit()"
[disabled]="!purgeHistoryForm.valid"
mat-raised-button
mat-button
mat-dialog-close>
Ok
</button>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/connection/create-connection/create-connection.component.html
View File

@ -175,13 +175,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="createConnectionForm.invalid || saving.value"
type="button"
color="primary"
(click)="createConnection(breadcrumbs.id)"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Add</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/connection/edit-connection/edit-connection.component.html
View File

@ -176,13 +176,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close="CANCELLED">Cancel</button>
<button mat-button mat-dialog-close="CANCELLED">Cancel</button>
<button
[disabled]="!editConnectionForm.dirty || editConnectionForm.invalid || saving.value"
type="button"
color="primary"
(click)="editConnection()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/flow/import-from-registry/import-from-registry.component.html
View File

@ -141,13 +141,13 @@
</div>
</mat-dialog-content>
<mat-dialog-actions align="end" *ngIf="{ value: (saving$ | async)! } as saving">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="importFromRegistryForm.invalid || saving.value"
type="button"
color="primary"
(click)="importFromRegistry()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Import</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/port/create-port/create-port.component.html
View File

@ -47,13 +47,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!createPortForm.dirty || createPortForm.invalid || saving.value"
type="button"
color="primary"
(click)="createPort()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Add</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/port/edit-port/edit-port.component.html
View File

@ -48,13 +48,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!editPortForm.dirty || editPortForm.invalid || saving.value"
type="button"
color="primary"
(click)="editPort()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/process-group/create-process-group/create-process-group.component.html
View File

@ -72,13 +72,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!createProcessGroupForm.dirty || createProcessGroupForm.invalid || saving.value"
type="button"
color="primary"
(click)="createProcessGroup()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Add</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/process-group/edit-process-group/edit-process-group.component.html
View File

@ -149,14 +149,14 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!editProcessGroupForm.dirty || editProcessGroupForm.invalid || saving.value"
class="h-8"
type="button"
color="primary"
(click)="submitForm()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/process-group/group-components/group-components.component.html
View File

@ -44,13 +44,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!createProcessGroupForm.dirty || createProcessGroupForm.invalid || saving.value"
type="button"
color="primary"
(click)="createProcessGroup()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Add</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/processor/edit-processor/edit-processor.component.html
View File

@ -192,13 +192,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!editProcessorForm.dirty || editProcessorForm.invalid || saving.value"
type="button"
color="primary"
(click)="submitForm()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/remote-process-group/create-remote-process-group/create-remote-process-group.component.html
View File

@ -103,13 +103,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!createRemoteProcessGroupForm.dirty || createRemoteProcessGroupForm.invalid || saving.value"
type="button"
color="primary"
(click)="createRemoteProcessGroup()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Add</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/canvas/items/remote-process-group/edit-remote-process-group/edit-remote-process-group.component.html
View File

@ -97,13 +97,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!editRemoteProcessGroupForm.dirty || editRemoteProcessGroupForm.invalid || saving.value"
type="button"
color="primary"
(click)="submitForm()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Add</span>
</button>
</mat-dialog-actions>

6
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/common/no-registry-clients-dialog/no-registry-clients-dialog.component.html
View File

@ -27,11 +27,11 @@
</mat-dialog-content>
<mat-dialog-actions align="end">
@if (request.controllerPermissions.canRead) {
<button mat-stroked-button mat-dialog-close color="primary">Cancel</button>
<button mat-raised-button mat-dialog-close color="primary" [routerLink]="['/settings', 'registry-clients']">
<button mat-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close color="primary" [routerLink]="['/settings', 'registry-clients']">
Configure
</button>
} @else {
<button mat-raised-button mat-dialog-close color="primary">Ok</button>
<button mat-button mat-dialog-close color="primary">Ok</button>
}
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/flow-designer/ui/manage-remote-ports/edit-remote-port/edit-remote-port.component.html
View File

@ -58,13 +58,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!editPortForm.dirty || editPortForm.invalid || saving.value"
type="button"
color="primary"
(click)="editRemotePort()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

8
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/parameter-contexts/ui/parameter-context-listing/edit-parameter-context/edit-parameter-context.component.html
View File

@ -134,21 +134,21 @@
@if ((updateRequest | async)!; as requestEntity) {
<mat-dialog-actions align="end">
@if (requestEntity.request.complete) {
<button color="primary" mat-raised-button mat-dialog-close>Close</button>
<button color="primary" mat-button mat-dialog-close>Close</button>
} @else {
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
}
</mat-dialog-actions>
} @else {
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!editParameterContextForm.dirty || editParameterContextForm.invalid || saving.value"
type="button"
color="primary"
(click)="submitForm()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/provenance/ui/provenance-event-listing/provenance-search-dialog/provenance-search-dialog.component.html
View File

@ -77,13 +77,13 @@
}
</mat-dialog-content>
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="provenanceOptionsForm.invalid"
type="button"
color="primary"
(click)="searchClicked()"
mat-raised-button
mat-button
mat-dialog-close>
<span>Search</span>
</button>

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/queue/ui/queue-listing/flowfile-dialog/flowfile-dialog.component.html
View File

@ -224,6 +224,6 @@
</ng-template>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button color="primary" mat-raised-button mat-dialog-close>Ok</button>
<button color="primary" mat-button mat-dialog-close>Ok</button>
</mat-dialog-actions>
</div>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/flow-analysis-rules/edit-flow-analysis-rule/edit-flow-analysis-rule.component.html
View File

@ -83,13 +83,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!editFlowAnalysisRuleForm.dirty || editFlowAnalysisRuleForm.invalid || saving.value"
type="button"
color="primary"
(click)="submitForm()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/edit-parameter-provider/edit-parameter-provider.component.html
View File

@ -80,13 +80,13 @@
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!editParameterProviderForm.dirty || editParameterProviderForm.invalid || saving.value"
type="button"
color="primary"
(click)="submitForm()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

6
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/parameter-providers/fetch-parameter-provider-parameters/fetch-parameter-provider-parameters.component.html
View File

@ -322,18 +322,18 @@
<mat-dialog-actions align="end" *ngIf="{ value: (saving$ | async)! } as saving">
<ng-container *ngIf="updateRequest | async; else normalActions">
<!-- an update to the associated parameter context(s) has been triggered -->
<button color="primary" mat-stroked-button mat-dialog-close>
<button mat-button mat-dialog-close>
<span *nifiSpinner="saving.value">Close</span>
</button>
</ng-container>
<ng-template #normalActions>
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!canSubmitForm() || saving.value"
type="button"
color="primary"
(click)="submitForm()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</ng-template>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/registry-clients/create-registry-client/create-registry-client.component.html
View File

@ -56,13 +56,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!createRegistryClientForm.dirty || createRegistryClientForm.invalid || saving.value"
type="button"
color="primary"
(click)="createRegistryClientClicked()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/registry-clients/edit-registry-client/edit-registry-client.component.html
View File

@ -61,13 +61,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!editRegistryClientForm.dirty || editRegistryClientForm.invalid || saving.value"
type="button"
color="primary"
(click)="submitForm()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/settings/ui/reporting-tasks/edit-reporting-task/edit-reporting-task.component.html
View File

@ -101,13 +101,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!editReportingTaskForm.dirty || editReportingTaskForm.invalid || saving.value"
type="button"
color="primary"
(click)="submitForm()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/summary/ui/common/cluster-summary-dialog/cluster-summary-dialog.component.html
View File

@ -79,7 +79,7 @@
<div class="refresh-timestamp">{{ loadedTimestamp$ | async }}</div>
</div>
<button color="primary" mat-raised-button mat-dialog-close tabindex="0">Close</button>
<button mat-button mat-dialog-close tabindex="0">Close</button>
</div>
</mat-dialog-actions>
</div>

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/pages/users/ui/user-listing/user-access-policies/user-access-policies.component.html
View File

@ -85,6 +85,6 @@
</div>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button color="primary" mat-raised-button mat-dialog-close>Close</button>
<button mat-button mat-dialog-close>Close</button>
</mat-dialog-actions>
</div>

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/cancel-dialog/cancel-dialog.component.html
View File

@ -20,5 +20,5 @@
<div class="text-sm">{{ request.message }}</div>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button type="button" (click)="cancelClicked()" mat-raised-button mat-dialog-close color="primary">Cancel</button>
<button type="button" (click)="cancelClicked()" mat-button mat-dialog-close>Cancel</button>
</mat-dialog-actions>

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/component-state/component-state.component.html
View File

@ -87,6 +87,6 @@
</div>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button color="primary" mat-raised-button mat-dialog-close>Close</button>
<button mat-button mat-dialog-close>Close</button>
</mat-dialog-actions>
</div>

10
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/controller-service/disable-controller-service/disable-controller-service.component.html
View File

@ -45,8 +45,8 @@
</div>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button type="button" color="primary" (click)="submitForm()" mat-raised-button>Disable</button>
<button mat-button mat-dialog-close>Cancel</button>
<button type="button" color="primary" (click)="submitForm()" mat-button>Disable</button>
</mat-dialog-actions>
} @else {
<mat-dialog-content>
@ -127,11 +127,9 @@
</mat-dialog-content>
<mat-dialog-actions align="end">
@if (disableRequest.currentStep === SetEnableStep.Completed || disableRequest.error) {
<button color="primary" mat-raised-button mat-dialog-close>Close</button>
<button mat-button mat-dialog-close>Close</button>
} @else {
<button color="primary" (click)="cancelClicked()" mat-stroked-button mat-dialog-close>
Cancel
</button>
<button (click)="cancelClicked()" mat-button mat-dialog-close>Cancel</button>
}
</mat-dialog-actions>
}

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/controller-service/edit-controller-service/edit-controller-service.component.html
View File

@ -109,13 +109,13 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="!editControllerServiceForm.dirty || editControllerServiceForm.invalid || saving.value"
type="button"
color="primary"
(click)="submitForm()"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving.value">Apply</span>
</button>
</mat-dialog-actions>

10
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/controller-service/enable-controller-service/enable-controller-service.component.html
View File

@ -58,13 +58,13 @@
</div>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="enableControllerServiceForm.invalid"
type="button"
color="primary"
(click)="submitForm()"
mat-raised-button>
mat-button>
Enable
</button>
</mat-dialog-actions>
@ -148,11 +148,9 @@
</mat-dialog-content>
<mat-dialog-actions align="end">
@if (enableRequest.currentStep === SetEnableStep.Completed || enableRequest.error) {
<button color="primary" mat-raised-button mat-dialog-close>Close</button>
<button mat-button mat-dialog-close>Close</button>
} @else {
<button color="primary" (click)="cancelClicked()" mat-stroked-button mat-dialog-close>
Cancel
</button>
<button (click)="cancelClicked()" mat-button mat-dialog-close>Cancel</button>
}
</mat-dialog-actions>
}

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/edit-parameter-dialog/edit-parameter-dialog.component.html
View File

@ -54,9 +54,9 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button mat-stroked-button mat-dialog-close color="primary">Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
mat-raised-button
mat-button
[disabled]="editParameterForm.invalid || saving.value"
(click)="okClicked()"
color="primary">

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/edit-tenant/edit-tenant-dialog.component.html
View File

@ -60,9 +60,9 @@
</mat-dialog-content>
@if ({ value: (saving$ | async)! }; as saving) {
<mat-dialog-actions align="end">
<button mat-stroked-button mat-dialog-close color="primary">Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
mat-raised-button
mat-button
[disabled]="editTenantForm.invalid || saving.value"
(click)="okClicked()"
color="primary">

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/extension-creation/extension-creation.component.html
View File

@ -101,12 +101,12 @@
}
</div>
<div class="flex justify-end gap-x-2">
<button color="primary" mat-stroked-button mat-dialog-close>Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
[disabled]="selectedType == null || saving"
color="primary"
(click)="createExtension(selectedType)"
mat-raised-button>
mat-button>
<span *nifiSpinner="saving">Add</span>
</button>
</div>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/new-property-dialog/new-property-dialog.component.html
View File

@ -36,9 +36,9 @@
</div>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-stroked-button mat-dialog-close color="primary">Cancel</button>
<button mat-button mat-dialog-close>Cancel</button>
<button
mat-raised-button
mat-button
[disabled]="!newPropertyForm.dirty || newPropertyForm.invalid"
(click)="addProperty()"
color="primary">

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/ok-dialog/ok-dialog.component.html
View File

@ -20,5 +20,5 @@
<div class="text-sm max-w-sm">{{ request.message }}</div>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-raised-button mat-dialog-close cdkFocusInitial color="primary">Ok</button>
<button mat-button mat-dialog-close cdkFocusInitial>Ok</button>
</mat-dialog-actions>

9
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/editors/combo-editor/combo-editor.component.html
View File

@ -94,12 +94,7 @@
</ng-template>
</div>
<div class="flex justify-end items-center gap-x-2">
<button
color="primary"
mat-stroked-button
type="button"
(mousedown)="preventDrag($event)"
(click)="cancelClicked()">
<button mat-button type="button" (mousedown)="preventDrag($event)" (click)="cancelClicked()">
Cancel
</button>
<button
@ -108,7 +103,7 @@
type="button"
color="primary"
(click)="okClicked()"
mat-raised-button>
mat-button>
Ok
</button>
</div>

9
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/property-table/editors/nf-editor/nf-editor.component.html
View File

@ -59,12 +59,7 @@
>
</div>
<div class="flex justify-end items-center gap-x-2">
<button
color="primary"
mat-stroked-button
type="button"
(mousedown)="preventDrag($event)"
(click)="cancelClicked()">
<button mat-button type="button" (mousedown)="preventDrag($event)" (click)="cancelClicked()">
Cancel
</button>
<button
@ -73,7 +68,7 @@
type="button"
color="primary"
(click)="okClicked()"
mat-raised-button>
mat-button>
Ok
</button>
</div>

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/provenance-event-dialog/provenance-event-dialog.component.html
View File

@ -442,6 +442,6 @@
</ng-template>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button color="primary" mat-raised-button mat-dialog-close>Ok</button>
<button mat-button mat-dialog-close>Ok</button>
</mat-dialog-actions>
</div>

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/status-history/status-history.component.html
View File

@ -172,7 +172,7 @@
}
</div>
<div>
<button color="primary" mat-raised-button mat-dialog-close>Close</button>
<button mat-button mat-dialog-close>Close</button>
</div>
</div>
</mat-dialog-actions>

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/system-diagnostics-dialog/system-diagnostics-dialog.component.html
View File

@ -236,7 +236,7 @@
<div class="refresh-timestamp">{{ loadedTimestamp$ | async }}</div>
</div>
<div>
<button color="primary" mat-raised-button mat-dialog-close>Close</button>
<button mat-button mat-dialog-close>Close</button>
</div>
</div>
</mat-dialog-actions>

4
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/app/ui/common/yes-no-dialog/yes-no-dialog.component.html
View File

@ -20,6 +20,6 @@
<div class="text-sm max-w-sm" data-qa="yes-no-message">{{ request.message }}</div>
</mat-dialog-content>
<mat-dialog-actions align="end">
<button mat-stroked-button mat-dialog-close color="primary" (click)="noClicked()">No</button>
<button mat-raised-button mat-dialog-close cdkFocusInitial color="primary" (click)="yesClicked()">Yes</button>
<button mat-button mat-dialog-close (click)="noClicked()">No</button>
<button mat-button mat-dialog-close cdkFocusInitial color="primary" (click)="yesClicked()">Yes</button>
</mat-dialog-actions>

2
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/assets/themes/nifi.scss
View File

@ -393,7 +393,7 @@ $warn-dark-palette: (
);
// Define the palettes for your theme
$material-primary-light: mat.define-palette($material-primary-light-palette);
$material-primary-light: mat.define-palette($material-primary-light-palette, 600, 100, 900);
$material-accent-light: mat.define-palette($material-primary-light-palette, A400, A100, A700);
$nifi-canvas-primary-light: mat.define-palette($nifi-canvas-light-palette);
$nifi-canvas-accent-light: mat.define-palette($nifi-canvas-accent-light-palette, 400, 100, 700);

5
nifi-nar-bundles/nifi-framework-bundle/nifi-framework/nifi-web/nifi-web-frontend/src/main/nifi/src/styles.scss
View File

@ -317,12 +317,9 @@ $appFontPath: '~roboto-fontface/fonts';
border-color: $accent-palette-A400;
}
button:disabled {
button.nifi-button:disabled {
color: $primary-palette-200 !important;
cursor: not-allowed;
}
button.nifi-button:disabled {
border: 1px solid $primary-palette-200;
i {

2
nifi-registry/nifi-registry-core/nifi-registry-web-ui/src/main/webapp/components/explorer/dialogs/about/nf-registry-explorer-about.html
View File

@ -32,5 +32,5 @@ limitations under the License.
</div>
</div>
<mat-dialog-actions align="end">
<button mat-raised-button color="fds-primary" mat-dialog-close>Close</button>
<button mat-button mat-dialog-close>Close</button>
</mat-dialog-actions>