Responsiveness limitations
Permalink
I've built quite a few sites now on 5.7 and I love the flexibility of the grid system. Here are a few things that I've run into that have made it a bit more work to properly maintain responsiveness using the built in stuff.
None of these are blockers as you can always manage it in the css and that's one reason I love C5 there is always some fallback option you are never completely blocked but life would be a bit easier when making responsive sites if these issues were addressed.
Does anybody know if any of this is on the roadmap? I'm curious to hear people's feedback on their experiences with responsive sites..
1) The custom grids are awesome but as soon as you drag the cell widths in the layout editor the custom grid cells are broken, it should allow you to drag any available size grid and snap to the available grid cells keeping you in the custom grid system. Also we should be able to add classes to the individual grid cells if necessary.
2) All of the built in spacing and margin controls on blocks are based in px. Every single widget should allow choosing other flexible options like %, em, rem etc so if an editor does try to get fancy they don't break the responsiveness.
3) In addition to #2 every spacing and margin control should have an option to set the value per device type, like give me 1rem for mobile and 2rem for desktop for the same element.
If we had those features we could eliminate a lot of the responsiveness micro management :)
None of these are blockers as you can always manage it in the css and that's one reason I love C5 there is always some fallback option you are never completely blocked but life would be a bit easier when making responsive sites if these issues were addressed.
Does anybody know if any of this is on the roadmap? I'm curious to hear people's feedback on their experiences with responsive sites..
1) The custom grids are awesome but as soon as you drag the cell widths in the layout editor the custom grid cells are broken, it should allow you to drag any available size grid and snap to the available grid cells keeping you in the custom grid system. Also we should be able to add classes to the individual grid cells if necessary.
2) All of the built in spacing and margin controls on blocks are based in px. Every single widget should allow choosing other flexible options like %, em, rem etc so if an editor does try to get fancy they don't break the responsiveness.
3) In addition to #2 every spacing and margin control should have an option to set the value per device type, like give me 1rem for mobile and 2rem for desktop for the same element.
If we had those features we could eliminate a lot of the responsiveness micro management :)
"The custom grids are awesome but as soon as you drag the cell widths in the layout editor the custom grid cells are broken, it should allow you to drag any available size grid and snap to the available grid cells keeping you in the custom grid system."
I am not sure what you are describing. Can you take screenshots, or a screen recording, of this behavior? Are you using a custom grid framework?
"Also we should be able to add classes to the individual grid cells if necessary."
With the release of 5.7.5, classes can be applied to custom layouts. For custom layout columns, classes can be added through Edit Area Design.
"All of the built in spacing and margin controls on blocks are based in px. Every single widget should allow choosing other flexible options like %, em, rem etc so if an editor does try to get fancy they don't break the responsiveness."
Do you mean the Design & Custom Template options? If so, if this feature was added, I wonder if it could be something that is set in the theme page_theme.php.
"In addition to #2 every spacing and margin control should have an option to set the value per device type, like give me 1rem for mobile and 2rem for desktop for the same element."
I could see this being useful.