chore: UI polishing

[taban03]

Description

Polish css based on UX feedbacks and improve the properties handling for the style customisation.

Linked to # (issue)
Part of the # (epic)

Type of change

Please delete options that are not relevant.

• (fix) Bug fix (non-breaking change which fixes an issue)
• (feat) New feature (non-breaking change which adds functionality)
• (docs) Change in a documentation
• (refactor) Refactor the code
• (chore) Chore, repository cleanup, updates the dependencies.
• (BREAKING CHANGE or !) Breaking change (fix or feature that would cause existing functionality to not work as expected)

Checklist:

• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas. In JS I did provide JSDoc
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• The java tests in the area I was working on leverage @nested annotations
• Any dependent changes have been merged and published in downstream modules

For more details about how should the code look like read the Contributing guideline

[sonarcloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

86.6% Coverage
0.0% Duplication