grid bug - default span of elements without col-* class inside row is hard-coded to 12 for desktop
Describe the bug
Our grid's .col-start-* classes reduce the number of columns available to a child row nested inside, but those .rows arent aware of that:
https://codepen.io/lyubomir-popov/pen/gOyNpwr
To Reproduce
Inspect the codepen above at screen sizes falling in our $breakpoint-medium
Expected behavior
a row placed inside a col class that has been offset with col-start-* classes should reduce the number of columns in itself accordingly.
Screenshots
If applicable, add screenshots to help explain your problem.
Desktop (please complete the following information):
- OS: [e.g. iOS]
- Browser [e.g. chrome, safari]
- Version [e.g. 22]
Smartphone (please complete the following information):
- Device: [e.g. iPhone6]
- OS: [e.g. iOS8.1]
- Browser [e.g. stock browser, safari]
- Version [e.g. 22]
Additional context
Add any other context about the problem here.
As far as I understand grid columns are supposed to have one of the col-X class names that define their size. Using them without it is wrong and may create other issues.
We can have some defaults, but fixing this as suggested would encourage bad practice of skipping class names which may result in inconsistent styling.
Triage: we can try to fix it in current codebase.
Possibly the 4 col grid work can affect/fix this.
Thank you for reporting us your feedback!
The internal ticket has been created: https://warthogs.atlassian.net/browse/WD-15281.
This message was autogenerated
@jmuzina Would your introduction of --vf-grid-cols CSS property help in fixing this (or fix it automatically)?
@bartaz my current implementation would not fix this bug, as the attribute is set at the .row level without considering col offsets.
I would need to subtract the number of offset cols from the vf-grid-cols of the row child of the col. This may run into source order or specificity problems, but I can triage it to see how achievable it is.
Un-assigning myself for the time being as other work has been more prioritized