Skip to main content
Parsley Design Systems logoParsley Design System - sample

Creating Pages

Creating pages in the Parsley Design System is a simple task once the key templates per product or application are defined.

Templates

Templates represent common component combinations and are the starting point for design and development of pages within a product or application. Every template should utilise the Content Containers available from the Parsley Design System. The template containers should include headers, footers, navigations and other content that will persist across multiple pages.

Content Containers

Content containers become the base structure for the different layout requirements, they are combined with application specific components and functionality to create the templates required per application.

Pages

With templates available designers and developers can create a page and then import the desired template. The templates have specific props that allow for certain functionality adjustment however sensible defaults are applied and additional props behaviour may not be required.

Once a template container is inserted into the page the layout components or additional Content Containers can be used to construct the exact layout. Layout components have responsiveness built in, be sure to follow the Responsive guidance.

Page construction with templates

Applying the following structure:

  • Template container - assign specific props for stacking and so forth.
  • Be sure to apply unique page specific props like page (document) titles, breadcrumb and so forth.
  • H1 primary heading.
  • Layout components to craft a specific layout structure.
  • Content or form components or a pattern.