Updated: Comment #11

Problem/Motivation

There is some CSS in seven that customizes the language admin forms.
It's obsolete for the page it was intended for, and when it bleed through to other pages it is broken.

Proposed resolution

1. Change the subheads ("User interface text language detection" & "Content language detection") on the main page mentioned (Detection and selection: admin/config/regional/language/detection) from h4 with label class to be h2 without label class. This was suggested in comment #4 by @LewisNyman.

2. Change the "Save configuration" button on the child page (browser language detection configuration admin/config/regional/language/detection/browser) so it is no longer overlapping the "Add A New Mapping" section and lines up with the outer box of the "Add A New Mapping" section and is not indented to the left.

Remaining tasks

Steps have been completed. RTBC

User interface changes

The "Save configuration" button has been changed to button_type primary.

API changes

No

no-patch-node-2194807.jpg

no-patch-node-2194807-child-page.jpg

patch-node-2194807.jpg

patch-node-2194807-child-page.jpg

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

tim.plunkett’s picture

Issue summary: View changes
Status: Active » Needs review
FileSize
167.78 KB
206.33 KB
208.48 KB
1.17 KB

Additionally, making the button 'primary'.

LewisNyman’s picture

I'm not familiar with the language UI changes, is there an issue that has changed the design?

Gábor Hojtsy’s picture

Status: Needs review » Needs work
Issue tags: +D8MI, +language-base, +frontend

The before/after screenshots "clearly" show that the spacing between the two negotiation method configurations is lost. Dries personally asked for that which is why we opened #2033959: Improve design of language detection and selection settings page. This was the only change there:

If we remove this, some other clearer separation between the two methods should be introduced. The idea is if we don't have separation then the two methods just meld into each other. I guess you don't think they don't meld into each other this way either, since you did not notice the difference in before/after? :)

LewisNyman’s picture

For some reason the headers on that page are using h4 elements instead of h2s? On top of that, they have a label class applied which makes them even smaller. Using h2 elements would make it the section more clear. Even with that the spacing is a bit tight without that styling. Maybe we just need to be more specific here?

Gábor Hojtsy’s picture

Yeah I think in #2033959: Improve design of language detection and selection settings page we discussed changing font sizes and given no direction we did not want to randomly introduce new font sizes. :) I think we can consider your feedback direction :)

longwave’s picture

Status: Needs work » Needs review
FileSize
1.81 KB

Changed the <h4 class="label"> to <h2>

Gábor Hojtsy’s picture

Status: Needs review » Reviewed & tested by the community

Looks good to me. The issue summary images need updates, but looks RTBC.

YesCT’s picture

bannorb’s picture

Steps to reproduce:

1. Install Drupal 8.x

2. Turn on language module (extend/multilingual/language)

3. Turn on content translation (extend/multilingual/content translation)

4. Go to this page: admin/config/regional/language/detection

5. Child page mentioned in issue: admin/config/regional/language/detection/browser

The patch tested produced these results:

1. The subheads ("User interface text language detection" & "Content language detection") on the main page mentioned (Detection and selection: admin/config/regional/language/detection) have been changed to h2 without the label class making them appear larger and more prominent.

Before html:

<h4 class="label">
  Content language detection
</h4>

After patch html:

<h2>
  Content language detection
</h2>

2. The space on the main page mentioned (Detection and selection: admin/config/regional/language/detection) has been removed between the bottom of the "User interface text language detection" section and the "Content language detection" section.

3. The "Save configuration" button on the child page (browser language detection configuration admin/config/regional/language/detection/browser) is no longer overlapping the "Add A New Mapping" section and lines up with the outer box of the "Add A New Mapping" section and is not indented to the left.

4. The "Save configuration" button has been changed to button_type primary.

My thoughts:
I think all the changes look good and create visual separation easier readability and usability. As far as the space in #2, I think this looks fine either way. I wanted to mention it in case someone thinks it needs to be there.

no-patch-node-2194807.jpg

no-patch-node-2194807-child-page.jpg

patch-node-2194807.jpg

patch-node-2194807-child-page.jpg

YesCT’s picture

Issue tags: -Needs screenshots

I read all the lines in the patch and the changes look straight forward and good.
screenshots look good.
(narrow screen/mobile looks good also)
rtbc from me too.

bannorb’s picture

Issue summary: View changes
Gábor Hojtsy’s picture

Looks good indeed!

alexpott’s picture

Status: Reviewed & tested by the community » Fixed

Committed 7a82321 and pushed to 8.x. Thanks!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.