diff options
author | Petr Vobornik <pvoborni@redhat.com> | 2014-04-23 16:27:51 +0200 |
---|---|---|
committer | Petr Vobornik <pvoborni@redhat.com> | 2014-06-10 10:23:28 +0200 |
commit | ea93590ef1051c17fa55115edc14d646581188e4 (patch) | |
tree | 31ba8697a415b5f8742b299297bfee892a3dce69 /install/ui/src/freeipa | |
parent | 4f45e3ea924cd64f4c1f698dfd762d561226199e (diff) | |
download | freeipa-ea93590ef1051c17fa55115edc14d646581188e4.tar.gz freeipa-ea93590ef1051c17fa55115edc14d646581188e4.tar.xz freeipa-ea93590ef1051c17fa55115edc14d646581188e4.zip |
webui: adjust login page to PatternFly
Reviewed-By: Endi Sukma Dewata <edewata@redhat.com>
Diffstat (limited to 'install/ui/src/freeipa')
-rw-r--r-- | install/ui/src/freeipa/facets/Facet.js | 3 | ||||
-rw-r--r-- | install/ui/src/freeipa/plugins/load_page.js | 1 | ||||
-rw-r--r-- | install/ui/src/freeipa/widgets/LoginScreen.js | 85 |
3 files changed, 65 insertions, 24 deletions
diff --git a/install/ui/src/freeipa/facets/Facet.js b/install/ui/src/freeipa/facets/Facet.js index 8b55cec12..fe2e6631e 100644 --- a/install/ui/src/freeipa/facets/Facet.js +++ b/install/ui/src/freeipa/facets/Facet.js @@ -239,6 +239,9 @@ define(['dojo/_base/declare', 'data-name': this.name }); } + if (this['class']) { + dom_class.add(this.dom_node, this['class']); + } if (this.container_node) { construct.place(this.dom_node, this.container_node); } diff --git a/install/ui/src/freeipa/plugins/load_page.js b/install/ui/src/freeipa/plugins/load_page.js index c8ff85b23..eb8f22acd 100644 --- a/install/ui/src/freeipa/plugins/load_page.js +++ b/install/ui/src/freeipa/plugins/load_page.js @@ -40,6 +40,7 @@ define([ load.facet_spec = { name: 'load', preferred_container: 'simple', + 'class': 'login-pf-body', widgets: [ { $type: 'activity', diff --git a/install/ui/src/freeipa/widgets/LoginScreen.js b/install/ui/src/freeipa/widgets/LoginScreen.js index 560393f45..9582e57f9 100644 --- a/install/ui/src/freeipa/widgets/LoginScreen.js +++ b/install/ui/src/freeipa/widgets/LoginScreen.js @@ -53,14 +53,16 @@ define(['dojo/_base/declare', */ var LoginScreen = declare([Stateful, Evented, FormMixin, ContainerMixin, ConfirmMixin], { - id: 'rcue-login-screen', + id: '', - 'class': 'rcue-login-screen', + 'class': 'login-pf', logo_src: 'images/login-screen-logo.png', product_name_src: 'images/product-name.png', + product_name: '', + expired_msg: "Your session has expired. Please re-login.", form_auth_msg: "To login with username and password, enter them in the fields below, then click Login.", @@ -149,57 +151,92 @@ define(['dojo/_base/declare', render_content: function() { - construct.empty(this.dom_node); + var login_body = construct.create('div', { + 'class': 'login-pf-body' + }, this.dom_node); + + construct.empty(login_body); + + this.render_badge(login_body); + + var cnt = construct.create('div', { + 'class': 'container' + }, login_body); + + var row = construct.create('div', { + 'class': 'row' + }, cnt); + + this.render_brand(row); + this.render_form(row); + this.render_aside(row); + }, + + render_badge: function(container) { + + var cnt = construct.create('span', { + 'id': 'badge' + }, container); construct.create('img', { - 'class': 'logo', - src: this.logo_src - }, this.dom_node); + src: this.logo_src, + alt: this.product_name + }, cnt); + }, - this.render_form(this.dom_node); + render_brand: function(container) { + var c1 = construct.create('div', { + 'class': 'col-sm-12' + }, container); + var c2 = construct.create('div', { + 'id': 'brand' + }, c1); + construct.create('img', { + src: this.product_name_src, + height: '80px' + }, c2); }, render_form: function(container) { var form_cont = construct.create('div', { - 'class': 'login-form' + 'class': 'col-sm-7 col-md-6 col-lg-5 login' }, container); - var fieldset = construct.create('fieldset', {}, form_cont); - - var legend = construct.create('legend', {}, fieldset); - construct.create('img', { - src: this.product_name_src - }, legend); - - var layout = IPA.fluid_layout({}); + var layout = IPA.fluid_layout({ + label_cls: 'col-sm-3 col-md-3 control-label', + widget_cls: 'col-sm-9 col-md-9 controls' + }); var form = layout.create(this.get_widgets()); - construct.place(form[0], fieldset); + construct.place(form[0], form_cont); this.register_caps_check(); + var btn_row = construct.create('div', { + 'class': 'row' + }, form_cont); + this.buttons_node = construct.create('div', { - 'class': 'buttons' - }, fieldset); + 'class': 'col-sm-12 col-md-offset-3 col-md-9 submit' + }, btn_row); this.login_btn_node = IPA.button({ label: text.get('@i18n:login.login', "Login"), - 'class': 'btn-primary', + 'class': 'btn-primary btn-lg', click: lang.hitch(this, this.on_confirm) })[0]; construct.place(this.login_btn_node, this.buttons_node); this.reset_btn_node = IPA.button({ label: text.get('@i18n:buttons.reset_password_and_login', "Reset Password and Login"), - 'class': 'btn-primary', + 'class': 'btn-primary btn-lg', click: lang.hitch(this, this.on_confirm) })[0]; - - this.render_aside(form_cont); }, render_aside: function(container) { - this.aside_node = construct.create('aside', { + this.aside_node = construct.create('div', { + 'class': 'col-sm-5 col-md-6 col-lg-7 details', innerHTML: this.aside }, container); }, |