Page MenuHomePhabricator

Better separation between same level comments in discussions
Closed, ResolvedPublicFeature

Description

Feature summary :
On talkpages, better visually separate comments from different users that reply to the same comment.

  • Conclusion :

Since you looked at T265291 before, you probably already know that DiscussionTools inserts invisible markers at the start and end of comments (<span data-mw-comment-start="…"></span> and <span data-mw-comment-end="…"></span>

The data-mw-comment-start="…" and data-mw-comment-end="…" of spans delimits comments and can be used in CSS to separate comments, the solution was in another mentioned ticket and hidden in the source code.

  • Rationale :

Users sometimes does not respect the indentation to reply to comments and instead reply at the bottom of the thread. Instead of clicking to the "reply" button of the comment they reply, they answer to the last one.

A talk on the french project chat reveals that a reason for that is that the separation between comments of different users when replying to the same comment is not well separated.

More context : The french Wikipedia has CSS rules on discussion pages that alternates colors between indentation levels, so comments with different indentation levels are easily separated.
In that sense this seems related to T265291 in finnish Wikipedia where they add a blank line to separate comments.

  • Potential solutions :

There is an alternative solution that was sometimes used in french wikipedia by old timer Wikipedians : insert a line of ":::" between comments that is one indentation level below the reply level, the same level as the parent comment :

:Initial Alice message
:: Bob answering to Alice
::  Bob answering to Alice  ( Bob signs )
: <----> empty line one indentation level below, level of Alice
:: Réponse de Charlotte à Alice
:: Réponse de Charlotte à Alice (Signature d'Alice)

This solution has the problem that in the generated HTML the two comments are in different <dd> tags, which breaks the answer logic but is nice visually on frwiki.

There are other solutions, maybe better, like "putting an empty answer to the first comment", by doing the same but in the empty line put one MORE indentation level instead of less :

:Initial Alice message
:: Bob answering to Alice
::  Bob answering to Alice  ( Bob signs )
::: <----> empty line one extra indentation level, like an empty answer to Bob
:: Réponse de Charlotte à Alice
:: Réponse de Charlotte à Alice (Signature d'Alice)

Or putting empty "<dl>" extra tags to mark the separation using ";", and mark the beginning of the comment (this are never used to give a title to a comment, but could play that role)

; Title to Alice message (maybe just alice user name)
:Initial Alice message
:; A title to Bob message
:: Bob answering to Alice
::  Bob answering to Alice  ( Bob signs )
:;title to Charlotte message
:: Réponse de Charlotte à Alice
:: Réponse de Charlotte à Alice (Signature d'Alice)

The "titles" may be empty

; Title to Alice message
:Initial Alice message
:;
:: Bob answering to Alice
::  Bob answering to Alice  ( Bob signs )
:;
:: Réponse de Charlotte à Alice
:: Réponse de Charlotte à Alice (Signature d'Alice)

The "<dt>"s might be used as a separator by a CSS on talkpages, or a combination of those.

Some of this combinations are available tested on frwiki on my sandbox.


Related

Event Timeline

Since you looked at T265291 before, you probably already know that DiscussionTools inserts invisible markers at the start and end of comments (<span data-mw-comment-start="…"></span> and <span data-mw-comment-end="…"></span>). Finnish Wikipedia styles them to add a bit more space between comments (see their MediaWiki:Common.css). But you could also style them to make them visible, if you wanted, for example:

span[data-mw-comment-end] {
  content: '';
  display: block;
  background: fuchsia;
  position: absolute;
  left: 0;
  width: 100%;
  height: 0.5em;
}

image.png (2×3 px, 753 KB)

This wouldn't require changes to the markup used by editors and generated by discussion tools.

You probably don't want to display them as thick bright pink lines, that's just for the sake of a quick example, but if you wanted to experiment with this, I would personally be curious to see the results.

TomT0m updated the task description. (Show Details)

Since you looked at T265291 before, you probably already know that DiscussionTools inserts invisible markers at the start and end of comments (<span data-mw-comment-start="…"></span> and <span data-mw-comment-end="…"></span>). Finnish Wikipedia styles them to add a bit more space between comments (see their MediaWiki:Common.css). But you could also style them to make them visible, if you wanted, for example:

I should obviously but somehow I could not realize the ticket was solved, as it was closed and the solution was in that discussion, thanks for pointing out ! (I read too quickly and/or my brain is too tired today /o\ )

For fr.wiki you can achieve what you need with :has selectors, which are supported by modern browsers:

dd:has( + dd ):not( :has( dl ) ) > span[data-mw-comment-end] {
	display: block;
	margin: 0.5em 0 0.5em -0.5em;
	border-top: 1px solid #a7d7f9;
}

This should select comments which have a same-level sibling :has( +dd ), but not direct replies :not( :has( dl ) ).

image.png (559×732 px, 157 KB)