From 50678e5efa34344e4b15c3bc74e66d5068a29423 Mon Sep 17 00:00:00 2001 From: Loz Jackson Date: Wed, 17 Aug 2016 21:43:23 +0100 Subject: [PATCH 1/4] update dummy app --- tests/dummy/app/controllers/modal-dialog-component.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/dummy/app/controllers/modal-dialog-component.js b/tests/dummy/app/controllers/modal-dialog-component.js index a2c22bc..8b853ff 100644 --- a/tests/dummy/app/controllers/modal-dialog-component.js +++ b/tests/dummy/app/controllers/modal-dialog-component.js @@ -14,7 +14,7 @@ export default Ember.Controller.extend({ }).then(() => { this.set('result', 'Confirmed'); }, () => { - this.set('result', 'Canceled'); + this.set('result', 'Cancelled'); }); }, From 3ca5ca1ee01d77bb4ffa9aaf1f5df5dbbf3bdd4d Mon Sep 17 00:00:00 2001 From: Loz Jackson Date: Wed, 17 Aug 2016 21:49:05 +0100 Subject: [PATCH 2/4] update modal dialog components Use ButtonComponent instead of button elements in the built in model dialog components. --- CHANGELOG.md | 5 +++++ addon/templates/components/uic-modal-alert.hbs | 2 +- addon/templates/components/uic-modal-confirm.hbs | 4 ++-- addon/templates/components/uic-modal.hbs | 2 +- tests/unit/components/uic-modal-alert-test.js | 4 +++- tests/unit/components/uic-modal-confirm-test.js | 4 +++- tests/unit/components/uic-modal-dialog-test.js | 3 ++- tests/unit/components/uic-modal-test.js | 4 +++- 8 files changed, 20 insertions(+), 8 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index b9ebe29..ddceec4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ # Change Log +* Use ButtonComponent instead of button elements in the built in model dialog components. + + + + ### v0.8.0 2016-06-18 * [FEATURE] Use ember-wormhole to enable rendering the `ContextMenuComponent` to a specified DOM element. diff --git a/addon/templates/components/uic-modal-alert.hbs b/addon/templates/components/uic-modal-alert.hbs index 7baeea8..3c447cb 100644 --- a/addon/templates/components/uic-modal-alert.hbs +++ b/addon/templates/components/uic-modal-alert.hbs @@ -5,5 +5,5 @@

{{dialog.body}}

{{/if}}
- + {{#uic-button class="uic-ok-button" action="ok"}}OK{{/uic-button}}
diff --git a/addon/templates/components/uic-modal-confirm.hbs b/addon/templates/components/uic-modal-confirm.hbs index 137696f..c5780f1 100644 --- a/addon/templates/components/uic-modal-confirm.hbs +++ b/addon/templates/components/uic-modal-confirm.hbs @@ -5,6 +5,6 @@

{{dialog.body}}

{{/if}}
- - + {{#uic-button class="uic-cancel-button" action="cancel"}}Cancel{{/uic-button}} + {{#uic-button class="uic-ok-button" action="confirm"}}OK{{/uic-button}}
diff --git a/addon/templates/components/uic-modal.hbs b/addon/templates/components/uic-modal.hbs index 426dd40..05b7c50 100644 --- a/addon/templates/components/uic-modal.hbs +++ b/addon/templates/components/uic-modal.hbs @@ -3,5 +3,5 @@ {{else}}

{{dialog.title}}

{{dialog.body}}

- + {{#uic-button action='closeModal'}}Close{{/uic-button}} {{/if}} diff --git a/tests/unit/components/uic-modal-alert-test.js b/tests/unit/components/uic-modal-alert-test.js index 2dd81fe..74e14e4 100644 --- a/tests/unit/components/uic-modal-alert-test.js +++ b/tests/unit/components/uic-modal-alert-test.js @@ -2,7 +2,9 @@ import { moduleForComponent, test } from 'ember-qunit'; import Ember from 'ember'; moduleForComponent('uic-modal-alert', 'Unit | Component | uic modal alert', { - // needs: [], + needs: [ + 'component:uic-button' + ], unit: true }); diff --git a/tests/unit/components/uic-modal-confirm-test.js b/tests/unit/components/uic-modal-confirm-test.js index f8f1e1b..9e32600 100644 --- a/tests/unit/components/uic-modal-confirm-test.js +++ b/tests/unit/components/uic-modal-confirm-test.js @@ -2,7 +2,9 @@ import { moduleForComponent, test } from 'ember-qunit'; import Ember from 'ember'; moduleForComponent('uic-modal-confirm', 'Unit | Component | uic modal confirm', { - // needs: [], + needs: [ + 'component:uic-button' + ], unit: true }); diff --git a/tests/unit/components/uic-modal-dialog-test.js b/tests/unit/components/uic-modal-dialog-test.js index 03fe866..af5eebd 100644 --- a/tests/unit/components/uic-modal-dialog-test.js +++ b/tests/unit/components/uic-modal-dialog-test.js @@ -6,7 +6,8 @@ const run = Ember.run; moduleForComponent('uic-modal-dialog', 'Unit | Component | uic modal dialog', { needs: [ 'component:uic-content-mask', - 'component:uic-modal' + 'component:uic-modal', + 'component:uic-button' ], unit: true }); diff --git a/tests/unit/components/uic-modal-test.js b/tests/unit/components/uic-modal-test.js index 73a8d8c..a5e1b8d 100644 --- a/tests/unit/components/uic-modal-test.js +++ b/tests/unit/components/uic-modal-test.js @@ -2,7 +2,9 @@ import { moduleForComponent, test } from 'ember-qunit'; import Ember from 'ember'; moduleForComponent('uic-modal', 'Unit | Component | uic modal', { - // needs: [], + needs: [ + 'component:uic-button' + ], unit: true }); From dda0611299f964820d0b74f3e480eb9c02435bd0 Mon Sep 17 00:00:00 2001 From: Loz Jackson Date: Wed, 17 Aug 2016 22:00:46 +0100 Subject: [PATCH 3/4] update css * When button components become active the css box-shadow is inset. * Change the OK button for alert and confirm modal dialog components to blue background with white text. --- CHANGELOG.md | 4 ++++ addon/styles/ember-ui-components.css | 13 +++++++++++-- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index ddceec4..dd4e747 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,9 @@ # Change Log +* When button components become active the css box-shadow is inset. + +* Change the OK button for alert and confirm modal dialog components to blue background with white text. + * Use ButtonComponent instead of button elements in the built in model dialog components. diff --git a/addon/styles/ember-ui-components.css b/addon/styles/ember-ui-components.css index 168604e..15af553 100644 --- a/addon/styles/ember-ui-components.css +++ b/addon/styles/ember-ui-components.css @@ -71,9 +71,16 @@ button.uic-cancel-button[disabled]:hover, } button.uic-button:active, button.uic-ok-button:active, +button.uic-cancel-button:active { + box-shadow: 1px 1px 1px #888 inset; +} +button.uic-button:active, button.uic-cancel-button:active { color: #000; } +button.uic-ok-button:active { + color: #FFF; +} button.uic-button.large { padding: 10px 30px; font-size: 1rem; @@ -87,14 +94,16 @@ button.uic-button.extra-small { font-size: .6rem; } button.uic-button.blue, -.uic-button-group.blue button.uic-button { +.uic-button-group.blue button.uic-button, +button.uic-ok-button { color: #fff; background: #388FFF; box-sizing: border-box; border: 1px solid transparent; } button.uic-button[disabled].blue, -.uic-button-group.blue button.uic-button[disabled] { +.uic-button-group.blue button.uic-button[disabled], +button.uic-ok-button[disabled] { color: rgba(255, 255, 255, 0.5); background: rgba(56, 143, 255, 0.3); } From eca496d07262ffaad31ab166bca877fc5fa9c5a9 Mon Sep 17 00:00:00 2001 From: Loz Jackson Date: Wed, 17 Aug 2016 22:03:17 +0100 Subject: [PATCH 4/4] v0.8.1 --- CHANGELOG.md | 2 ++ package.json | 2 +- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index dd4e747..d943668 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,7 @@ # Change Log +### v0.8.1 2016-08-17 + * When button components become active the css box-shadow is inset. * Change the OK button for alert and confirm modal dialog components to blue background with white text. diff --git a/package.json b/package.json index 47c49f0..cfdb695 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ember-ui-components", - "version": "0.8.0", + "version": "0.8.1", "description": "A collection of common user interface components", "directories": { "doc": "doc",