Allow expansion of sidenav on small screens

[Waseem826]

What this PR does / why we need it:

• Allow expanding the sidenav on small screen sizes.
• Fix width issues of sidenav in collapsed state when scrollbar is visible.

screencast-github.jparrowsec.cn-2023.09.14-14_05_39.webm

Which issue(s) this PR fixes:

Fixes #6217

What type of PR is this?

/kind bug

Special notes for your reviewer:

Does this PR introduce a user-facing change? Then add your Release Note here:

Allow expansion of sidenav on small screen sizes.

Documentation:

NONE

[Waseem826]

/cherrypick release/v2.23

[kubermatic-bot]

@Waseem826: once the present PR merges, I will cherry-pick it on top of release/v2.23 in a new PR and assign it to you.

In response to this:

/cherrypick release/v2.23

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

[Waseem826]

/cherrypick release/v2.22

[kubermatic-bot]

@Waseem826: once the present PR merges, I will cherry-pick it on top of release/v2.22 in a new PR and assign it to you.

In response to this:

/cherrypick release/v2.22

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

[ahmedwaleedmalik]

/approve

[kubermatic-bot]

LGTM label has been added.

Git tree hash: b12a73ed11fb2903ecefd7124b968ac45848774c

[kubermatic-bot]

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: ahmedwaleedmalik, Waseem826

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Needs approval from an approver in each of these files:

• modules/web/src/OWNERS [Waseem826,ahmedwaleedmalik]

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[kubermatic-bot]

@Waseem826: #6218 failed to apply on top of branch "release/v2.22":

Applying: Allow expansion of sidenav on small screens. Fix collapsed sidenav scroll issue.
Using index info to reconstruct a base tree...
M	modules/web/src/app/core/components/sidenav/component.ts
M	modules/web/src/app/core/components/sidenav/style.scss
M	modules/web/src/app/settings/admin/nav/component.ts
M	modules/web/src/assets/css/_variables.scss
M	modules/web/src/assets/css/global/_main.scss
Falling back to patching base and 3-way merge...
Auto-merging modules/web/src/assets/css/global/_main.scss
Auto-merging modules/web/src/assets/css/_variables.scss
Auto-merging modules/web/src/app/settings/admin/nav/component.ts
CONFLICT (content): Merge conflict in modules/web/src/app/settings/admin/nav/component.ts
Auto-merging modules/web/src/app/core/components/sidenav/style.scss
Auto-merging modules/web/src/app/core/components/sidenav/component.ts
CONFLICT (content): Merge conflict in modules/web/src/app/core/components/sidenav/component.ts
error: Failed to merge in the changes.
hint: Use 'git am --show-current-patch=diff' to see the failed patch
Patch failed at 0001 Allow expansion of sidenav on small screens. Fix collapsed sidenav scroll issue.
When you have resolved this problem, run "git am --continue".
If you prefer to skip this patch, run "git am --skip" instead.
To restore the original branch and stop patching, run "git am --abort".

In response to this:

/cherrypick release/v2.22

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.

[kubermatic-bot]

@Waseem826: new pull request created: #6219

In response to this:

/cherrypick release/v2.23

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes/test-infra repository.