{"componentChunkName":"component---src-pages-components-list-usage-mdx","path":"/components/list/usage/","webpackCompilationHash":"aaa6c4cbb44f8ca938e9","result":{"pageContext":{"isCreatedByStatefulCreatePages":true,"frontmatter":{"title":"List","description":"Lists consist of related content grouped together and organized vertically.","tabs":["Code","Usage","Style"]},"relativePagePath":"/components/list/usage.mdx","titleType":"prepend","MdxNode":{"id":"70db93f6-8620-55f5-ac6f-03015856e1a3","children":[],"parent":"9748c419-412c-5193-a803-75d0a1123ee9","internal":{"content":"---\ntitle: List\ndescription: Lists consist of related content grouped together and organized vertically.\ntabs: ['Code', 'Usage', 'Style']\n---\n\n## General guidance\n\n_Lists_ consist of related content grouped together and organized vertically.\n\n## Variations\n\n| List type       | Purpose                                                                            |\n| --------------- | ---------------------------------------------------------------------------------- |\n| Unordered lists | To present content of equal status or value.                                       |\n| Ordered lists   | Imply sequence and order, and are commonly used when giving a set of instructions. |\n\n## Content\n\n#### Length\n\nGenerally, lists should be used to present simple pieces of information. For more complex sets of data, consider using a [data table.](/components/data-table)\n\n#### Order\n\nArrange list items in a logical way. For example, if the list is about resource use, the default order might be highest resource use to lowest. Grouping items in categories into smaller, more specific lists might be more meaningful in some contexts. Alternatively, organize in alphabetical or numeric order.\n\n#### Text\n\nUse list items that are grammatically parallel. For example, do not mix passive voice with active voice or declarative sentences (statements) with imperative sentences (direct command).\n\n<Row>\n<Column colLg={8}>\n\n![Example of a list](images/list-usage-1.png)\n\n</Column>\n</Row>\n","type":"Mdx","contentDigest":"00795c4e4722709b7c4bdc5bc7144344","counter":1128,"owner":"gatsby-plugin-mdx"},"frontmatter":{"title":"List","description":"Lists consist of related content grouped together and organized vertically.","tabs":["Code","Usage","Style"]},"exports":{},"rawBody":"---\ntitle: List\ndescription: Lists consist of related content grouped together and organized vertically.\ntabs: ['Code', 'Usage', 'Style']\n---\n\n## General guidance\n\n_Lists_ consist of related content grouped together and organized vertically.\n\n## Variations\n\n| List type       | Purpose                                                                            |\n| --------------- | ---------------------------------------------------------------------------------- |\n| Unordered lists | To present content of equal status or value.                                       |\n| Ordered lists   | Imply sequence and order, and are commonly used when giving a set of instructions. |\n\n## Content\n\n#### Length\n\nGenerally, lists should be used to present simple pieces of information. For more complex sets of data, consider using a [data table.](/components/data-table)\n\n#### Order\n\nArrange list items in a logical way. For example, if the list is about resource use, the default order might be highest resource use to lowest. Grouping items in categories into smaller, more specific lists might be more meaningful in some contexts. Alternatively, organize in alphabetical or numeric order.\n\n#### Text\n\nUse list items that are grammatically parallel. For example, do not mix passive voice with active voice or declarative sentences (statements) with imperative sentences (direct command).\n\n<Row>\n<Column colLg={8}>\n\n![Example of a list](images/list-usage-1.png)\n\n</Column>\n</Row>\n","fileAbsolutePath":"/tmp/42b44a0/src/pages/components/list/usage.mdx"}}}}