Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: handle sidebar resizing #12045

Merged
merged 1 commit into from
Dec 23, 2024
Merged

fix: handle sidebar resizing #12045

merged 1 commit into from
Dec 23, 2024

Conversation

LukasHirt
Copy link
Collaborator

Description

Fixed various issues with sidebar resizing. Close button is no longer pushed away, resize event is added, and correct breakpoint is used.

Related Issue

Motivation and Context

Resilient layout 💪

How Has This Been Tested?

  • test environment: chrome
  • test case 1: Resize browser window
  • test case 2: Zoom in & out in browser

Screenshots (if appropriate):

Zaznam.obrazovky.2024-12-18.v.10.58.06.mov

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
  • Documentation
  • Maintenance (e.g. dependency updates or tooling)

Open tasks:

  • ...

@LukasHirt LukasHirt added the Type:Bug Something isn't working label Dec 18, 2024
@LukasHirt LukasHirt requested review from kobergj and saw-jan December 18, 2024 10:08
@LukasHirt LukasHirt self-assigned this Dec 18, 2024
const backgroundContentEl = computed(() => {
return unref(appSideBar)?.parentElement?.querySelector('div') as HTMLElement
})

const onResize = () => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

maybe we can think of debouncing the function.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That might cause again "laggy" reactivity. Resize does not happen that often so I think it is fine not to have it debounced.

@saw-jan
Copy link
Member

saw-jan commented Dec 19, 2024

I built this branch and I see that space is allocated for sidebar even though it is not opened

opened
Screenshot from 2024-12-19 15-47-16 Screenshot from 2024-12-19 15-47-20

@LukasHirt LukasHirt force-pushed the fix/sidebar-resizing branch from 73cbac5 to 19aadcb Compare December 20, 2024 09:16
@LukasHirt
Copy link
Collaborator Author

I built this branch and I see that space is allocated for sidebar even though it is not opened

Right 🤦 fixed by applying the adjusted width only when the sidebar is open.

@LukasHirt LukasHirt requested a review from saw-jan December 20, 2024 09:16
Fixed various issues with sidebar resizing. Close button is no longer pushed away, resize event is added, and correct breakpoint is used.
@LukasHirt LukasHirt force-pushed the fix/sidebar-resizing branch from 19aadcb to 06e7b80 Compare December 20, 2024 09:19
Copy link
Member

@saw-jan saw-jan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

@LukasHirt LukasHirt merged commit a08493b into master Dec 23, 2024
4 checks passed
@LukasHirt LukasHirt deleted the fix/sidebar-resizing branch December 23, 2024 11:14
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type:Bug Something isn't working
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Details tab cannot be closed when viewing a video and zoomin
2 participants