ENH Versioned badge to elements

[sabina-talipova]

Description

New badge element was added in the title to show current state of changes of Element block. There are three different bages:

• Draft for unpublished changes in new blocks;
• Modified for modified published blocks;

Manual testing steps

• I create new Content Block in Elemental Area.
• I should see Draft badge.
• I populate Title field with "My title".
• I should see Draft badge.
• I save block.
• I should see Draft badge.
• I publish block.
• I should not see a badge.
• I update Title field.
• I should see Modified badge.
• I save block.
• I should see Modified badge.

Issues

• Add versioned badge to elements #1124

Pull request checklist

• The target branch is correct
  • See picking the right version
• All commits are relevant to the purpose of the PR (e.g. no debug statements, unrelated refactoring, or arbitrary linting)
  • Small amounts of additional linting are usually okay, but if it makes it hard to concentrate on the relevant changes, ask for the unrelated changes to be reverted, and submitted as a separate PR.
• The commit messages follow our commit message guidelines
• The PR follows our contribution guidelines
• Code changes follow our coding conventions
• This change is covered with tests (or tests aren't necessary for this change)
• Any relevant User Help/Developer documentation is updated; for impactful changes, information is added to the changelog for the intended release
• CI is green

[GuySartorelli]

@sabina-talipova I haven't looked at this beyond reading the PR description, but just double checking if you've checked with the design team about the blue dot state?

There's a blue "dirty state" dot that shows when editing a block. We are not sure if that should have a matching label. Please validate with UX team.

[sabina-talipova]

@sabina-talipova I haven't looked at this beyond reading the PR description, but just double checking if you've checked with the design team about the blue dot state?

There's a blue "dirty state" dot that shows when editing a block. We are not sure if that should have a matching label. Please validate with UX team.

Cassie suggested to remove "dirty state" and show only "Draft" or "Modified" status.

[emteknetnz]

Very nice PR. My only feedback would be to possibly increase the amount of padding to the left of the badge, though if design team is happy with it then so am I

Just to double check, have you gotten sign off from the design PR?

Could you also create a new card to remove any dead code relating to the now removed hover state

Also this should be targeting 5 instead of 5.1 since there's a slightly functionality change with the removal of the blue dot

[sabina-talipova]

Very nice PR. My only feedback would be to possibly increase the amount of padding to the left of the badge, though if design team is happy with it then so am I

Just to double check, have you gotten sign off from the design PR?

I increased margin-left and checked with Cassie again that she is happy with current view and behaviour.

Could you also create a new card to remove any dead code relating to the now removed hover state

I have removed all related code and elements in this PR.

Also this should be targeting 5 instead of 5.1 since there's a slightly functionality change with the removal of the blue dot

I close this PR and open new one for branch 5