Affects Version/s: None
Fix Version/s: Master
Nowadays, mobile-first approach has become the rule when designing multi-channel experiences. In 2021, 56% of the internet traffic happened from Mobile devices. In B2B, this percentage is as high as 50%.
Consequently, it becomes a must to provide our clients with all the available options to adapt their web experiences to mobile terminals.
In addition to this, now that we have implemented the , it becomes quite easy to provide full responsive capabilities to all the styles present in the Common Styles editor.
The main scope of this epic is to provide mobile styling capabilities so that the effort to customize the look & feel for viewports other than desktop is minimized.
- The following options will be now available for all viewports:
- General: the section that affects only the "Frame" of the Fragment.
- Styling: all elements except background image, that is already using adaptive media to change the image resolution in several viewports
Advanced: Custom CSS(pending)
- The different styling options per viewport must be applied by adding the corresponding fragment classes to the corresponding media query section of the generated CSS.
- [this will be done when redesigning the components, the new design already has the "clear" button integrated]
Provide a "Clear to default" (other potential copies: "clear values", "reset to default", etc) button, at a viewport level (one button per tab per viewport), that resets all the element values of the tab to their default values (" " or whatever it is). On values inheritance: We will NOT FORCE any type of inheritance per viewport. The default behavior will be "Desktop first".
- If I save a composition containing a fragment with different style values, values in all viewports must be saved.
|Test Scenarios||Test Strategy||Kind of test||Is it covered by FrontEnd ? (JS-Unit)||Is it covered by BackEnd ? (unit or integration)||Could it be covered by POSHI?|
|The page editor could customize styles on non-desktop viewports||Critial||Manual||No||No||Yes|
|The page editor cannot change background image on non-desktop viewports||High||Manual||No||No||Yes|
|The saved fragment composition should persist styles defined on all viewports||Critial||Manual||No||Yes||Yes|
|The page editor only could clear color picker selection defined on current non-desktop viewport||High||Manual||No||No||Yes|