diff --git a/addons/rose/addon/components/rose/form/actions/edit-toggle/index.hbs b/addons/rose/addon/components/rose/form/actions/edit-toggle/index.hbs index 56b85725c..7ef8dfd21 100644 --- a/addons/rose/addon/components/rose/form/actions/edit-toggle/index.hbs +++ b/addons/rose/addon/components/rose/form/actions/edit-toggle/index.hbs @@ -4,7 +4,9 @@ }}
- - {{@enableEditText}} - +
\ No newline at end of file diff --git a/addons/rose/addon/components/rose/form/actions/index.hbs b/addons/rose/addon/components/rose/form/actions/index.hbs index 4aafc52dd..9992c5e1c 100644 --- a/addons/rose/addon/components/rose/form/actions/index.hbs +++ b/addons/rose/addon/components/rose/form/actions/index.hbs @@ -3,19 +3,18 @@ SPDX-License-Identifier: MPL-2.0 }} -
- {{! template-lint-disable no-passed-in-event-handlers }} - - {{@submitText}} - - + + {{#if this.showCancel}} - - {{@cancelText}} - + /> {{/if}} -
\ No newline at end of file + \ No newline at end of file diff --git a/addons/rose/addon/components/rose/form/actions/index.js b/addons/rose/addon/components/rose/form/actions/index.js index 0450d55e7..0f3a663a4 100644 --- a/addons/rose/addon/components/rose/form/actions/index.js +++ b/addons/rose/addon/components/rose/form/actions/index.js @@ -4,7 +4,6 @@ */ import Component from '@glimmer/component'; -import { computed } from '@ember/object'; /** * A set of two form action buttons for submit and cancel. @@ -22,7 +21,6 @@ export default class RoseFormActionsComponent extends Component { /** * @type {boolean} */ - @computed('args.showCancel') get showCancel() { return this.args.showCancel ?? true; } diff --git a/addons/rose/addon/styles/hds/themes/dark-mode/index.scss b/addons/rose/addon/styles/hds/themes/dark-mode/index.scss index 14ab0905d..38ab4cf09 100644 --- a/addons/rose/addon/styles/hds/themes/dark-mode/index.scss +++ b/addons/rose/addon/styles/hds/themes/dark-mode/index.scss @@ -102,6 +102,9 @@ --token-color-palette-neutral-200 ); --token-form-indicator-optional-color: var(--token-color-palette-neutral-200); + --token-color-foreground-high-contrast: var( + --token-color-palette-neutral-700 + ); } @media (prefers-color-scheme: dark) { diff --git a/addons/rose/tests/integration/components/rose/form/actions-test.js b/addons/rose/tests/integration/components/rose/form/actions-test.js index 2000b9467..d884c0568 100644 --- a/addons/rose/tests/integration/components/rose/form/actions-test.js +++ b/addons/rose/tests/integration/components/rose/form/actions-test.js @@ -14,7 +14,9 @@ module('Integration | Component | rose/form/actions', function (hooks) { test('it renders a submit button and a regular button', async function (assert) { assert.expect(2); this.cancel = () => {}; - await render(hbs`{{rose/form/actions cancel=this.cancel}}`); + await render( + hbs`{{rose/form/actions cancel=this.cancel submitText='Save' cancelText='Cancel'}}` + ); assert.ok(find('[type="submit"]')); assert.ok(find('button:not([type="submit"])')); }); @@ -23,7 +25,7 @@ module('Integration | Component | rose/form/actions', function (hooks) { assert.expect(2); this.cancel = () => {}; await render( - hbs`{{rose/form/actions cancel=this.cancel submitDisabled=true cancelDisabled=true}}` + hbs`{{rose/form/actions cancel=this.cancel submitDisabled=true cancelDisabled=true submitText='Save' cancelText='Cancel'}}` ); assert.ok(find('[type="submit"]:disabled')); assert.ok(find('button:not([type="submit"]):disabled')); @@ -31,7 +33,7 @@ module('Integration | Component | rose/form/actions', function (hooks) { test('it optionally does not render the cancel button', async function (assert) { assert.expect(2); - await render(hbs`{{rose/form/actions showCancel=false}}`); + await render(hbs`{{rose/form/actions submitText='Save' showCancel=false}}`); assert.ok(find('[type="submit"]')); assert.notOk(find('button:not([type="submit"])')); }); @@ -39,7 +41,9 @@ module('Integration | Component | rose/form/actions', function (hooks) { test('it executes a function on cancel click', async function (assert) { assert.expect(1); this.cancel = () => assert.ok(true, 'cancel was clicked'); - await render(hbs`{{rose/form/actions cancel=this.cancel}}`); + await render( + hbs`{{rose/form/actions cancel=this.cancel submitText='Save' cancelText='Cancel'}}` + ); await click('button:not([type="submit"])'); }); }); diff --git a/addons/rose/tests/integration/components/rose/form/actions/edit-toggle-test.js b/addons/rose/tests/integration/components/rose/form/actions/edit-toggle-test.js index 35efe6728..726978fc9 100644 --- a/addons/rose/tests/integration/components/rose/form/actions/edit-toggle-test.js +++ b/addons/rose/tests/integration/components/rose/form/actions/edit-toggle-test.js @@ -17,7 +17,7 @@ module( assert.expect(1); this.enableEdit = () => {}; await render( - hbs`{{rose/form/actions/edit-toggle enableEdit=this.enableEdit}}` + hbs`{{rose/form/actions/edit-toggle enableEdit=this.enableEdit enableEditText='Edit'}}` ); assert.ok(find('button')); }); @@ -26,7 +26,7 @@ module( assert.expect(1); this.enableEdit = () => assert.ok(true, 'edit was clicked'); await render( - hbs`{{rose/form/actions/edit-toggle enableEdit=this.enableEdit}}` + hbs`{{rose/form/actions/edit-toggle enableEdit=this.enableEdit enableEditText='Edit'}}` ); await click('button'); }); diff --git a/ui/admin/app/components/form/onboarding/index.hbs b/ui/admin/app/components/form/onboarding/index.hbs index 8b586523a..d9aefd162 100644 --- a/ui/admin/app/components/form/onboarding/index.hbs +++ b/ui/admin/app/components/form/onboarding/index.hbs @@ -3,7 +3,12 @@ SPDX-License-Identifier: MPL-2.0 }} - +
- - - - - + \ No newline at end of file diff --git a/ui/admin/app/styles/app.scss b/ui/admin/app/styles/app.scss index e90bda620..e96574895 100644 --- a/ui/admin/app/styles/app.scss +++ b/ui/admin/app/styles/app.scss @@ -169,14 +169,8 @@ .rose-frame { .rose-form-actions { - .rose-button-primary { - display: block; - margin: 0; + .hds-button { width: 100%; - - .rose-button-wrapper { - display: inline; - } } } } diff --git a/ui/admin/tests/acceptance/onboarding/onboarding-test.js b/ui/admin/tests/acceptance/onboarding/onboarding-test.js index f237744e9..628fe120b 100644 --- a/ui/admin/tests/acceptance/onboarding/onboarding-test.js +++ b/ui/admin/tests/acceptance/onboarding/onboarding-test.js @@ -42,7 +42,7 @@ module('Acceptance | onboarding', function (hooks) { test('redirect user to orgs screen when click do this later', async function (assert) { assert.expect(1); await visit(urls.onboarding); - await click('[name="cancel"]'); + await click('.rose-form-actions [type="button"]'); assert.strictEqual(currentURL(), urls.orgs); }); }); diff --git a/ui/desktop/app/styles/app.scss b/ui/desktop/app/styles/app.scss index 6d283e153..a5888178b 100644 --- a/ui/desktop/app/styles/app.scss +++ b/ui/desktop/app/styles/app.scss @@ -288,14 +288,8 @@ } .rose-form-actions { - .rose-button-primary { - display: block; - margin: 0; + .hds-button { width: 100%; - - .rose-button-wrapper { - display: inline; - } } } }