Refresh design of "Locales & Languages" page

[samuelsidler]

The current design of the "Locales & Languages" pages is just a big table. We should refresh this page to look more modern and show more information.

@isaackeyet has worked up an initial mockup.

Some explanations:

• The design uses the "bar" style from the theme and plugin directory but maintains the white background (using a grey bar instead).
• We may add other filters, but for now the only "filter" is "Find your locale" which won't use the "selected" style from the directories until we add other filters (if we do so).
• The search box remains the same and auto filters the cards below.
• Each card shows the same three things they showed before: language name in English, localized language name, and locale code. We will also search these three fields using the search box.
• We've added a green progress bar that will show how far the locale is from translating the WordPress project.
• If a locale has completely translated WordPress, we will change the outline of the card to be green, giving them a new identifier.
• This design also adds the number of contributors to the locale. Ideally, someone could click on that and see a list of a contributors, but we haven't built that yet.
• Finally, the card ends with a "call to action."

I have the start of this developed already and will be working to design it to Isaac's mockup. However we need the following features easily accessible from the languages page:

• Number of contributors to a locale
• WordPress project percentage complete

I've asked @ocean90 to work up those features while I wrap up the design implementation.

[netweb]

This is fantastic :)

• Regional filters maybe? Europe, Asia Pacific and Americas?

[ocean90]

In 1530:

Translate: Refresh design of "Locales & Languages" page.

props samuelsidler, ocean90.
see #994.

[ocean90]

Some remaining things:

• Show WordPress locale instead of the GlotPress slug
• Link contributors to the teams page
• Improve styling of the search form (see themes/plugin directory)
• Improve filtering: It shouldn't match button labels
• Link the the handbook page for requesting a new locale
  • wp-admin/themes.php has a "Add New" box after all the themes, maybe we can add something similiar, "Request Locale" and link it to the handbook page.
  • or/and add a "No locales found, request new locale" message if no search results were found

[deconf]

Char encoding issue

[deconf]

There is a char encoding / font support issue with Burmese and Tamazight, it looks like above in Chrome.

[samuelsidler]

@deconf: I'm assuming you're on Windows? This works fine on Mac. It's likely a missing font on your end. There are other languages with this issue as well.

[netweb]

Replying to samuelsidler:

@deconf: I'm assuming you're on Windows? This works fine on Mac. It's likely a missing font on your end. There are other languages with this issue as well.

Two for Windows using Chrome -> Myanmar (Burmese) and Tamazight (Central Atlas)

One for Mac using Safari or Chrome -> Tamazight (Central Atlas)

All work perfectly with IE11 and Edge on Windows ¯\_(ツ)_/¯

[deconf]

Replying to samuelsidler:

@deconf: I'm assuming you're on Windows? This works fine on Mac. It's likely a missing font on your end.

Looks to be a Chrome issue since IE11, FF and Safari are working well on Windows.

[samuelsidler]

Replying to netweb:

One for Mac using Safari or Chrome -> Tamazight (Central Atlas)

And Dhivehi. But, like I said, this is a font issue.

[SergeyBiryukov]

Replying to ocean90:

• Show WordPress locale instead of the GlotPress slug
• Link contributors to the teams page
• Improve filtering: It shouldn't match button labels

meta-994.patch​ is an attempt to resolve these points.

[ocean90]

In 1554:

Translate: "Locales & Languages" page:

• Show WordPress locale instead of GlotPress slug
• Link contributors to the make/polyglots team page
• Improve filtering

props SergeyBiryukov.
see #994.

[ocean90]

In 1586:

Translate: "Locales & Languages" page:

• Copy GlotPress' locale template to our theme.
• Move index and locale routes do its own files.
• Register routes for /language/$locale/$set/$project.

see #994.

[ocean90]

In 1590:

Translate: Improve filter header for the "Locales & Languages" page.

see #994.

[ocean90]

In 1721:

Translate: Improve custom routes.

• Don't register custom routes for API request.
• Move locale overview to translate.wordpress.org, no redirect anymore.
• Replace /languages prefix with /locale.
• Redirect old /languages URLs to the new route.
• Rename custom templates.

see #994, #1091.

[ocean90]

In 1782:

Translate: Loop over locales instead of grouping them in SQL.

see #994.

[ocean90]

Replying to ocean90:

In 1782:

Translate: Loop over locales instead of grouping them in SQL.

see #994.

We should instead store the user IDs per locale somewhere.

[samuelsidler]

This is fixed. Follow ups or bug reports should be filed as new tickets.