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: ResizableLayoutContainer no longer overflows #13533

Merged

Conversation

Konrad-Simso
Copy link
Contributor

Description

  • Resolved the CSS issue with the ResizableLayoutContainer, ensuring it no longer exceeds the screen size.
  • Implemented the fullWidth property for both StudioButtons used when Preview and Elements are collapsed. This adjustment allows the buttons to occupy the full width of their parent container, which is constrained by collapseSize. Previously, there were gaps between the buttons and their containers.

Related Issue(s)

Verification

  • Your code builds clean without any errors or warnings
  • Manual testing done (required)

- Changed maxWidth for StudioResizableLayoutElement to use Rem instead of Pixels.
- Added maxWidth of `100VW` to StudioResizableLayoutContainer
- Added fullWidth to both Elements.tsx and Preview.tsx, so that when the buttons are collapsed, they take up all the space they can use.
It comes down to using Rems vs Pixels. The bug was making the Preview section resize randomly, now that's fixed.
@github-actions github-actions bot added area/ui-editor Area: Related to the designer tool for assembling app UI in Altinn Studio. solution/studio/designer Issues related to the Altinn Studio Designer solution. labels Sep 12, 2024
Copy link
Contributor

@lassopicasso lassopicasso left a comment

Choose a reason for hiding this comment

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

Superb! 💯
Just some nitpicking 🙂

Copy link

codecov bot commented Sep 12, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 95.17%. Comparing base (c6b3414) to head (92dadf7).
Report is 1 commits behind head on main.

Additional details and impacted files
@@           Coverage Diff           @@
##             main   #13533   +/-   ##
=======================================
  Coverage   95.16%   95.17%           
=======================================
  Files        1462     1462           
  Lines       20149    20149           
  Branches     2439     2439           
=======================================
+ Hits        19175    19176    +1     
  Misses        868      868           
+ Partials      106      105    -1     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@lassopicasso
Copy link
Contributor

There are some spacing issues that need attention. I thought Prettier would handle that, but it seems not. Could you take care of it? Once that's done, it's good to go! 😄
image

https://github.com/Altinn/altinn-studio/actions/runs/10831581581/job/30053889792?pr=13533

The issue arrised from commits made yesterday because of having to bypassing husky to make commits. The local issue has been resolved and won't happen in the future.
Copy link
Contributor

@lassopicasso lassopicasso left a comment

Choose a reason for hiding this comment

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

💯

@TomasEng
Copy link
Contributor

Testet OK.

@Konrad-Simso Konrad-Simso merged commit 0af6f66 into main Sep 16, 2024
10 checks passed
@Konrad-Simso Konrad-Simso deleted the fix/resizableLayoutContainer-overflowing-by-default branch September 16, 2024 11:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area/ui-editor Area: Related to the designer tool for assembling app UI in Altinn Studio. solution/studio/designer Issues related to the Altinn Studio Designer solution.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Long texts as title for components forces resizable layout to overflow by default
3 participants