refactor: handle 'fit-content' layout via restricted max height#683
Merged
refactor: handle 'fit-content' layout via restricted max height#683
Conversation
…mplify height logic
effie-ms
commented
Apr 1, 2026
| variants: [ | ||
| { | ||
| props: { | ||
| variant: 'drawer', |
Contributor
Author
There was a problem hiding this comment.
Removed since previously variant was not passed at all (probably a legacy leftover).
effie-ms
commented
Apr 1, 2026
| ? { marginBottom: 6 } | ||
| : undefined | ||
| } | ||
| sx={{ marginBottom: !isFullHeightLayout || isFooterFixed ? 6 : 0 }} |
Contributor
Author
There was a problem hiding this comment.
Margin bottom is added for widget not to touch the bottom of the page or the footer (routes container still might though - because of the absolute positioning).
|
Hey! This is your new endpoint: https://5d11a65a.widget-refactorfi.pages.dev |
effie-ms
commented
Apr 1, 2026
| (config?.theme?.container?.display === 'flex' && !showHeader) | ||
| } | ||
| alignTop={config?.theme?.container?.display === 'flex'} | ||
| removePaddingTop={isFullHeightLayout && !showHeader} |
Contributor
Author
There was a problem hiding this comment.
On playground, config?.theme?.container?.height === '100%' and config?.theme?.container?.display === 'flex' is "Full height" layout - there are no other layouts with display: "flex".
|
Hey! This is your new endpoint: https://c616ea73.widget-refactorfi.pages.dev |
chybisov
approved these changes
Apr 1, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Which Linear task is linked to this PR?
https://linear.app/lifi-linear/issue/EMB-324/add-fit-content-height-option-to-restricted-max-height-layout-on
Why was it implemented this way?
This PR is continuation of "Fit content" and "Default" layout refactoring.
Previously "Fit content" mode was merged with "Default", however specification of max height in "Default" layout did not allow a flexible way of differentiating "Restricted max height" and "Default" layouts, creating a problem of heights assigned to undefined and not assigned at all being handled in different ways. To improve clarity:
A checkbox "Apply only to long pages" is added to "Restricted max height" layout. If it is ticked,
heightis assigned to "fit-content", which replicates former "Fit content" layout. If not - it replicates "Restricted max height" layout.Default mode (height: undefined, maxHeight: undefined, or not specified at all) - resolves to "Fit content" with max height 686px on long pages.
Top and bottom paddings/margins/alignments are added on request for better centering.
Visual showcase (Screenshots or Videos)
If applicable, attach screenshots, GIFs, or videos to showcase the functionality, UI changes, or bug fixes.
Checklist before requesting a review