Adedoyinebi
commented
2 months ago Responsive vf-breadcrumb has also been added in figma to be used on designs of mobile interfaces, recommended breaking point: width below 768px.
The mobile version shows only the parent node in the hierarchy.
Useful links:
bhushan-ebi
The current vf-breadcrumbs component does not have a responsive variant for mobile interfaces. From the intranet project, we learnt that it is best practice to limit the number of nodes shown on mobile interfaces which have limited screen real estate.
A mobile version of the breadcrumbs should be created with the following specifications:
Improve the target area for the vf-breadcrumbs On mobile where a larger touch are is required 8px padding should be added above and below the breadcrumb to achieve a height of 44px which is recommended for mobile devices.
Shorten breadcrumb trail on mobile to show only the parent page in the site architecture (Design of the breadcrumb trail showing the previous page)
Tasks
Design links for reference - Intranet project
Breadcrumb for desktop Mobile responsive breadcrumb design