[full-ci] style file versions list

[hurradieweltgehtunter]

Description

Beautify file versions list

Related Issue

• Fixes File versions list not styled #8503

Motivation and Context

Before:

After:

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)
• Technical debt
• Tests

Checklist:

• Code changes
• Unit tests added
• Acceptance tests added
• Documentation ticket raised: [Web UI] File version list style changed docs-webui#118

Open tasks:

• Check and possibly fix tests

[hurradieweltgehtunter]

Need help with some topics.

• See 2 comments in css section
• tests: Removing the file type icon understandably leads to:
  

[hurradieweltgehtunter]

If the height (= length) of the list becomes an issue, a customized — but not favored — version would look like:

[JammingBen]

Love the design, especially the "timeline"-feeling because of the continuous line on the left side!

The actions take a lot of vertical space though. Maybe keep the actions in the right side? Like this:

[hurradieweltgehtunter]

Love the design, especially the "timeline"-feeling because of the continuous line on the left side!

The actions take a lot of vertical space though. Maybe keep the actions in the right side? Like this:

Idea was, to have it aligned with other action buttons in the sidebar. IMO the length of the list isn't problematic. Also, showing only icons isn't very intuitive. Text-based buttons work much better regarding accessibility.

[hurradieweltgehtunter]

Added negative margin css classes to design system. Ok, to have it in the same PR?

[AlexAndBear]

Added negative margin css classes to design system. Ok, to have it in the same PR?

Totally fine, but you want to add a changelog in the odd/changelog dir

[hurradieweltgehtunter]

Added negative margin css classes to design system. Ok, to have it in the same PR?

Totally fine, but you want to add a changelog in the odd/changelog dir

Changelog file is included. Make 2, one for version list styling, one for design system?

[AlexAndBear]

Added negative margin css classes to design system. Ok, to have it in the same PR?

Totally fine, but you want to add a changelog in the odd/changelog dir

Changelog file is included. Make 2, one for version list styling, one for design system?

Yes

[tbsbdr]

timeline style - awesome 👍

[JammingBen]

@hurradieweltgehtunter I fixed the linter and removed the failing unit test (which is not needed anymore due to the removal of the resource icons). Let's see how the pipeline does.

[ownclouders]

Results for acceptance oCIS https://drone.owncloud.com/owncloud/web/33157/55/1
💥 The oCISSharingBasic tests pipeline failed. The build has been cancelled.

[JammingBen]

Okay, so it seems that we have to adjust some selectors for the acceptance tests as well. I can have a look after the meetings later, shouldn't be too complicated.

[kulmann]

LGTM from my side now 💪

[CLAassistant]

All committers have signed the CLA.

[hurradieweltgehtunter]

@JammingBen PR is done from my side, but I need help with the test suite. Could you fix the tests?

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
2 Code Smells

No Coverage information
0.0% Duplication

[JammingBen]

@JammingBen PR is done from my side, but I need help with the test suite. Could you fix the tests?

Looks good now, no?