Label nesting leads to confusing duplicate labels [#2735227]

This task is for a new student in MD Systems, don't do it if it was not assigned to you.

Problem/Motivation

The paragraphs field widget always displays a label of the paragraph type name at the top. This can lead to confusing situations:

During the sprints we discussed about this and we decided that we will prefix the label with "Type: ". This would look like this:

Proposed resolution

Add a "Type: " text before the Paragraph type label in InlineParagraphsWidget.php

Remaining tasks

Also add tests :)

User interface changes

API changes

Data model changes

Comment	File	Size	Author
#10	label_nesting_leads_to-2735227-10.patch	1.2 KB	Bambell
#10	8.x-1.x: PHP 5.5 & MySQL 5.5, D8.2 29 pass PHP 5.6 & MySQL 5.5, D8.2 29 pass PHP 7 & MySQL 5.5, D8.2 29 pass
#10	interdiff-8-10.txt	639 bytes	Bambell
#8	interdiff-2735227-6-7.txt	642 bytes	Ginovski
#8	2735227-7.patch	1.2 KB	Ginovski
#8	8.x-1.x: PHP 5.5 & MySQL 5.5, D8.2 29 pass PHP 5.6 & MySQL 5.5, D8.2 29 pass PHP 7 & MySQL 5.5, D8.2 29 pass
#7	Screenshot from 2016-06-08 17-13-28.png	104.38 KB	Ginovski
#7	2735227-6.patch	1.2 KB	Ginovski
#7	8.x-1.x: PHP 5.5 & MySQL 5.5, D8.2 29 pass PHP 5.6 & MySQL 5.5, D8.2 29 pass PHP 7 & MySQL 5.5, D8.2 29 pass
#5	Screenshot from 2016-06-08 14:47:57.png	27.43 KB	johnchque
#5	Screenshot from 2016-06-08 14:47:06.png	26.09 KB	johnchque
	Screen Shot 2016-05-27 at 18.28.24.png	37.84 KB	Lukas von Blarer
	Screen Shot 2016-05-27 at 18.25.24.png	34.57 KB	Lukas von Blarer

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Comment #1

27 May 2016 at 16:29

Lukas von Blarer created an issue. See original summary.

Comment #2

miro_dietiker

Switzerland

CreditAttribution: miro_dietiker at MD Systems GmbH commented 27 May 2016 at 22:51

Issue tags:

+Usability

Alternative options:

1) "Paragraph type:" => "Type:"
We try to avoid repeating mention of "Paragraph" in UI. Because in your screen it's "Content" that sometimes is named "Paragraph(s)".
Or did you intend to use the widget settings label? (singular or plural?)
I think it's still adding redundancy.
Also we should keep short to keep room for the closed / collapsed summary we will add...

2) Or removal of the field label if it's identical to the paragraph type.
3) Or removal of the field label if it's only a single field.

Comment #3

Lukas von Blarer

he/him

CreditAttribution: Lukas von Blarer commented 28 May 2016 at 10:40

I think field removal would not make sense. I actually also though about whether including "Paragraph" is a good idea. Lets use "Type: ".

Comment #4

jonathanshaw

English

Stroud, UK

CreditAttribution: jonathanshaw commented 29 May 2016 at 11:29

Status:

Active

» Closed (duplicate)

The type label was removed in #2642810: UX improvements for nested paragraphs as a step to UX improvement by decluttering the layout. However, that issue did not create an alternative way of distinguishing the paragraph and field labels, leaving us with the situation described in the IS here.

#2668706: Visual weight of paragraph field labels vs paragraph type labels vs field labels was created as a follow-up to resolve the problem, therefore closing this issue as duplicate.

Comment #5

johnchque

Spanish

Bolivia

CreditAttribution: johnchque at MD Systems GmbH commented 8 June 2016 at 13:03

Issue summary:	View changes
Status:	Closed (duplicate)	» Active

File	Size
Screenshot from 2016-06-08 14:47:06.png	26.09 KB
Screenshot from 2016-06-08 14:47:57.png	27.43 KB

Change a bit the IS and set it back to active since we re added the label.

Comment #6

johnchque

Spanish

Bolivia

CreditAttribution: johnchque at MD Systems GmbH commented 8 June 2016 at 13:11

2 files were hidden/shown/deleted

File	Size
Screen Shot 2016-05-27 at 18.25.24.png	34.57 KB
Screen Shot 2016-05-27 at 18.28.24.png	37.84 KB

Comment #7

Ginovski CreditAttribution: Ginovski commented 8 June 2016 at 15:15

Assigned:	Unassigned	» Ginovski
Status:	Active	» Needs review

File	Size
2735227-6.patch	1.2 KB
8.x-1.x: PHP 5.5 & MySQL 5.5, D8.2 29 pass PHP 5.6 & MySQL 5.5, D8.2 29 pass PHP 7 & MySQL 5.5, D8.2 29 pass
Screenshot from 2016-06-08 17-13-28.png	104.38 KB

Comment #8

Ginovski CreditAttribution: Ginovski commented 8 June 2016 at 15:23

File	Size
2735227-7.patch	1.2 KB
8.x-1.x: PHP 5.5 & MySQL 5.5, D8.2 29 pass PHP 5.6 & MySQL 5.5, D8.2 29 pass PHP 7 & MySQL 5.5, D8.2 29 pass
interdiff-2735227-6-7.txt	642 bytes

Deleted few extra spaces.

Comment #9

johnchque

Spanish

Bolivia

CreditAttribution: johnchque at MD Systems GmbH commented 8 June 2016 at 15:41

Status:

Needs review

» Needs work

+++ b/src/Plugin/Field/FieldWidget/InlineParagraphsWidget.php
@@ -294,7 +294,7 @@ class InlineParagraphsWidget extends WidgetBase {
+          '#markup' => '<strong>' . 'Type: ' . $bundle_info['label'] . '</strong>',

Nice work, close enough, but the "strong" tag should be in the same string as 'Type: '. No need to have them separated.

Good to know you assigned the issue to yourself.

Comment #10

Bambell CreditAttribution: Bambell at MD Systems GmbH commented 8 June 2016 at 16:17

Status:

Needs work

» Needs review

File	Size
interdiff-8-10.txt	639 bytes
label_nesting_leads_to-2735227-10.patch	1.2 KB
8.x-1.x: PHP 5.5 & MySQL 5.5, D8.2 29 pass PHP 5.6 & MySQL 5.5, D8.2 29 pass PHP 7 & MySQL 5.5, D8.2 29 pass

3 files were hidden/shown/deleted

File	Size
2735227-6.patch	1.2 KB
8.x-1.x: PHP 5.5 & MySQL 5.5, D8.2 29 pass PHP 5.6 & MySQL 5.5, D8.2 29 pass PHP 7 & MySQL 5.5, D8.2 29 pass
2735227-7.patch	1.2 KB
8.x-1.x: PHP 5.5 & MySQL 5.5, D8.2 29 pass PHP 5.6 & MySQL 5.5, D8.2 29 pass PHP 7 & MySQL 5.5, D8.2 29 pass
interdiff-2735227-6-7.txt	642 bytes

New student has worked enough :-).

Comment #11

Lukas von Blarer

he/him

CreditAttribution: Lukas von Blarer commented 8 June 2016 at 23:08

While this doesn't declutter the UI, it still helps understanding which are field labels an which are labels for the paragraph type. Is there a simple way to seperate it a little more? Should we get this committed and deal with that in #2668706: Visual weight of paragraph field labels vs paragraph type labels vs field labels?

Comment #12

9 June 2016 at 10:06

miro_dietiker committed 7f62c95 on 8.x-1.x authored by Ginovski

Issue #2735227 by Ginovski, Bambell, Lukas von Blarer, yongt9412,...

Comment #13

miro_dietiker

Switzerland

CreditAttribution: miro_dietiker at MD Systems GmbH commented 9 June 2016 at 10:06

Status:

Needs review

» Fixed

Yeah that was the decision: First make it clearer and then discuss about visual improvements in the related issue.
Thus i committed and we can close the issue here because its no more confusing.