Fix sidebar width on window resize

[UnniKohonen]

Reasons for creating this PR

Sidebar Vue components do not currently resize correctly with window resizing, this PR fixes that.

Link to relevant issue(s), if any

• Part of Implement hierarchical view in sidebar using Vue #1521 and Implement alphabetical view in sidebar using Vue #1563

Description of the changes in this PR

• Adds an event listener for window resizing in alphabetical and hierarchical components
• Change the width of the components on window resize event

Addresses requirement 3i in #1521 and 1d in #1563

Known problems or uncertainties in this PR

Checklist

• phpUnit tests pass locally with my changes
• I have added tests that show that the new code works, or tests are not relevant for this PR (e.g. only HTML/CSS changes)
• The PR doesn't reduce accessibility of the front-end code (e.g. tab focus, scaling to different resolutions, use of .sr-only class, color contrast)
• The PR doesn't introduce unintended code changes (e.g. empty lines or useless reindentation)

[joelit]

LGTM!

The resize listener works as expected. However, the layout itself is not the best in every window width - with window size just under 990px, the right margin disappears and the left margin is set pretty wide, reducing the room for deep hierarchy.

[sonarqubecloud]

Quality Gate passed

Issues
1 New issue
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud

[joelit]

Looks good to me!