[Kimchi-devel] [Wok][PATCH v2 0/7] Multi-Culture Support

Tue May 10 15:13:33 UTC 2016

By the way, if we need to change any element width in a different language, feel free to create a new SCSS module called "_locale.scss" or something like this and import into wok.scss or kimchi.scss. You can change the width based on locale using the "lang" attribute.

In SCSS:

[lang="pt-br"] {
span.column-longfield {
                width: 350px;
}
}

[lang="en-us"] {
span.column-longfield {
                width: 120px;
}
}

CSS output:

[lang="pt-br"] span.column-longfield { width: 350px; }
[lang="en-us"] span.column-longfield { width: 120px; }

From: kimchi-devel-bounces at ovirt.org [mailto:kimchi-devel-bounces at ovirt.org] On Behalf Of Samuel Henrique De Oliveira Guimaraes
Sent: terça-feira, 10 de maio de 2016 12:08
To: Daniel Henrique Barboza <dhbarboza82 at gmail.com>; kimchi-devel at ovirt.org
Subject: Re: [Kimchi-devel] [Wok][PATCH v2 0/7] Multi-Culture Support

Exactly. If you inspect the current code for username and password, they both have the placeholder attribute (html5) and hidden labels. Please note that elements with CSS property "display: none" are always ignored by screen reader software. The bootstrap class "sr-only" hides the content in the negative space of the element keeping the element display property unchanged.

Samuel

From: kimchi-devel-bounces at ovirt.org<mailto:kimchi-devel-bounces at ovirt.org> [mailto:kimchi-devel-bounces at ovirt.org] On Behalf Of Daniel Henrique Barboza
Sent: terça-feira, 10 de maio de 2016 11:12
To: kimchi-devel at ovirt.org<mailto:kimchi-devel at ovirt.org>
Subject: Re: [Kimchi-devel] [Wok][PATCH v2 0/7] Multi-Culture Support

On 05/09/2016 04:44 PM, Samuel Henrique De Oliveira Guimaraes wrote:
Hi,

I don't think the new login.html is good for accessibility with screen reader software. I don't have the tools to test it, but the form fields were added to a <dl> element (Definition list) when just the <form>, <label> and <input> elements should be enough for accessibility, usability and styling.

>From my experience with screen readers, the output from a screen reader would be something like this:
-Definition List
-Definition term: Username.
-Definition description: input type text Username.
-Definition term: Password.
-Definition description: input type password Password.
-Definition term: Language.
-Definition description: Select.
-Selected option: English (US).

If we move the Locale and display it under the <select> element, it should be done with CSS only. Personally, I think it doesn't look good. Instead I think we could align it in the middle, just like we do with the Log In button.

I don't think displaying the label and the select in a single line is good for mobile usability with the login page and it doesn't make sense to create a different login page for mobile and desktop just to move a label: http://baymard.com/blog/mobile-form-usability-label-position

I am no UI expert but we need to be sure that we do not add any
HTML5 code that will gives us trouble when dealing with Accessibility.

Thanks,
Samuel

From: kimchi-devel-bounces at ovirt.org<mailto:kimchi-devel-bounces at ovirt.org> [mailto:kimchi-devel-bounces at ovirt.org] On Behalf Of Aline Manera
Sent: segunda-feira, 9 de maio de 2016 10:39
To: pkulkark at linux.vnet.ibm.com<mailto:pkulkark at linux.vnet.ibm.com>; Kimchi Devel <kimchi-devel at ovirt.org><mailto:kimchi-devel at ovirt.org>
Subject: Re: [Kimchi-devel] [Wok][PATCH v2 0/7] Multi-Culture Support

Hi all,

I'd like suggest changes on UI layout.

[imap://dhbarboza82%40gmail%2Ecom@imap.googlemail.com:993/fetch%3EUID%3E/%5BGmail%5D/kimchi-dev%3E5592?header=quotebody&part=1.1.2&filename=image001.jpg]
I am not sure about the best practices to display language and locale to users but I will suggest to put:

<label> <drop down menu> in a single line, instead of having the label under the drop down menu.

Samuel, any suggestion on that area?

Regards,
Aline Manera

On 05/05/2016 04:02 AM, pkulkark at linux.vnet.ibm.com<mailto:pkulkark at linux.vnet.ibm.com> wrote:

From: Pooja Kulkarni <pkulkark at linux.vnet.ibm.com><mailto:pkulkark at linux.vnet.ibm.com>

This patch set provides multi-culture

support by adding another drop down

list during login for user locale

selection. The numeric data and datetime

fields are formatted based on the locale

selected.

Pooja Kulkarni (7):

  Multi-Culture Support - Add a separate drop down list for locale

  Multi-Culture support - Add methods to get and set locales in

    wok.lang.js

  Multi-Culture support - Add locale in format settings in

    wok.line-chart.js

  Multi-Culture support : Format datetime as per locale in wok.list.js

  Multi-Culture support : Implement new drop down list for locale in

    wok.login.js

  Multi-Culture support : Modify wok.formatMeasurement util to include

    formatting based on locale

  Multi-Culture support : Format datetime in user activity log as per

    locale

 ui/js/src/wok.lang.js       |  8 ++++++++

 ui/js/src/wok.line-chart.js |  3 ++-

 ui/js/src/wok.list.js       |  6 +++++-

 ui/js/src/wok.login.js      |  9 +++++++++

 ui/js/src/wok.utils.js      | 10 +++++++---

 ui/js/wok.bootgrid.js       | 10 +++++++++-

 ui/js/wok.user-log.js       |  3 ++-

 ui/pages/login.html.tmpl    | 34 ++++++++++++++++++++++++++++++++++

 8 files changed, 76 insertions(+), 7 deletions(-)

_______________________________________________

Kimchi-devel mailing list

Kimchi-devel at ovirt.org<mailto:Kimchi-devel at ovirt.org>

http://lists.ovirt.org/mailman/listinfo/kimchi-devel

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.ovirt.org/pipermail/kimchi-devel/attachments/20160510/7813447e/attachment.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: image001.jpg
Type: image/jpeg
Size: 12929 bytes
Desc: image001.jpg
URL: <http://lists.ovirt.org/pipermail/kimchi-devel/attachments/20160510/7813447e/attachment.jpg>