[FEATURE] Add migration for Bootstrap 4 -> 5 hidden classes #76
Conversation
This file contains 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
Adds a migration that converts "hidden-*" to "d-*-none" classes in FlexForm data in DB. Note that this only converts the classes 1:1 which means it functions as a "hide column on this size and any larger size". In order to make it a "hide column only on this size", a template change is required which for every breakpoints adds an additional class if "d-*-none" is designated, to make the column visible again on the next breakpoint. To _hide_ a column on larger sizes you just add the "d-*-none" class on the breakpoint where hiding starts and the column will be hidden on that size and any larger size. Inversely, to make the functionality "show only on this and larger size" you would have set "d-*-none" on the smaller sizes and "d-*-block" on larger sizes. This however is not supported by the templates that ship with the extension. For example, "d-md-none" would need to become "d-md-none d-lg-block". Unfortunately it doesn't seem like it's possible to force Bootstrap to use whichever display type the HTML element type would naturally have, so this would have to be a decision on a template-by-template basis. If any element (column) is NOT a "block" display type, then the needed display type would have to be specified instead of "block".
|
Wow very nice. Will check that these days ... Thanks a lot |
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.
Adds a migration that converts
hidden-*tod-*-noneclasses in FlexForm data in DB.Note that this only converts the classes 1:1 which means it functions as a "hide column on this size and any larger size". In order to make it a "hide column only on this size", a template change is required which for every breakpoints adds an additional class if
d-*-noneis designated, to make the column visible again on the next breakpoint.To hide a column on larger sizes you just add the
d-*-noneclass on the breakpoint where hiding starts and the column will be hidden on that size and any larger size.Inversely, to make the functionality "show only on this and larger size" you would have set
d-*-noneon the smaller sizes andd-*-blockon larger sizes. This however is not supported by the templates that ship with the extension.For example,
d-md-nonewould need to becomed-md-none d-lg-block. Unfortunately it doesn't seem like it's possible to force Bootstrap to use whichever display type the HTML element type would naturally have, so this would have to be a decision on a template-by-template basis. If any element (column) is NOT a "block" display type, then the needed display type would have to be specified instead of "block".Note that this PR requires the same Services.yaml change that is in #75.