docs(accordion): use better mock data

This commit is contained in:
Eric Liu 2020-10-22 17:14:38 -07:00
commit 09511cc528

View file

@ -13,28 +13,30 @@ components: ["Accordion", "AccordionItem", "AccordionSkeleton"]
### Default
<Accordion>
<AccordionItem title="Title 1">
Content 1
<AccordionItem title="Natural Language Classifier">
<p>Natural Language Classifier uses advanced natural language processing and machine learning techniques to create custom classification models. Users train their data and the service predicts the appropriate category for the inputted text.
</p>
</AccordionItem>
<AccordionItem title="Title 2">
Content 2
<AccordionItem title="Natural Language Understanding">
Analyze text to extract meta-data from content such as concepts, entities, emotion, relations, sentiment and more.
</AccordionItem>
<AccordionItem title="Title 3">
Content 3
<AccordionItem title="Language Translator">
<p>Translate text, documents, and websites from one language to another. Create industry or region-specific translations via the service's customization capability.</p>
</AccordionItem>
</Accordion>
### Chevron aligned left
<Accordion align="start">
<AccordionItem title="Title 1">
Content 1
<AccordionItem title="Natural Language Classifier">
<p>Natural Language Classifier uses advanced natural language processing and machine learning techniques to create custom classification models. Users train their data and the service predicts the appropriate category for the inputted text.
</p>
</AccordionItem>
<AccordionItem title="Title 2">
Content 2
<AccordionItem title="Natural Language Understanding">
Analyze text to extract meta-data from content such as concepts, entities, emotion, relations, sentiment and more.
</AccordionItem>
<AccordionItem title="Title 3">
Content 3
<AccordionItem title="Language Translator">
<p>Translate text, documents, and websites from one language to another. Create industry or region-specific translations via the service's customization capability.</p>
</AccordionItem>
</Accordion>
@ -42,84 +44,101 @@ components: ["Accordion", "AccordionItem", "AccordionSkeleton"]
<Accordion>
<AccordionItem>
<h5 slot="title" style="color: red;">Custom title slot</h5>
Content 1
<div slot="title">
<h5>Natural Language Classifier</h5>
<div>AI / Machine Learning</div>
</div>
<p>Natural Language Classifier uses advanced natural language processing and machine learning techniques to create custom classification models. Users train their data and the service predicts the appropriate category for the inputted text.
</p>
</AccordionItem>
<AccordionItem title="Title 2">
Content 2
<AccordionItem>
<div slot="title">
<h5>Natural Language Understanding</h5>
<div>AI / Machine Learning</div>
</div>
Analyze text to extract meta-data from content such as concepts, entities, emotion, relations, sentiment and more.
</AccordionItem>
<AccordionItem title="Title 3">
Content 3
<AccordionItem>
<div slot="title">
<h5>Language Translator</h5>
<div>AI / Machine Learning</div>
</div>
<p>Translate text, documents, and websites from one language to another. Create industry or region-specific translations via the service's customization capability.</p>
</AccordionItem>
</Accordion>
### First item open
<Accordion>
<AccordionItem title="Title 1" open>
Content 1
<AccordionItem open title="Natural Language Classifier">
<p>Natural Language Classifier uses advanced natural language processing and machine learning techniques to create custom classification models. Users train their data and the service predicts the appropriate category for the inputted text.
</p>
</AccordionItem>
<AccordionItem title="Title 2">
Content 2
<AccordionItem title="Natural Language Understanding">
Analyze text to extract meta-data from content such as concepts, entities, emotion, relations, sentiment and more.
</AccordionItem>
<AccordionItem title="Title 3">
Content 3
<AccordionItem title="Language Translator">
<p>Translate text, documents, and websites from one language to another. Create industry or region-specific translations via the service's customization capability.</p>
</AccordionItem>
</Accordion>
### Extra-large size
<Accordion size="xl">
<AccordionItem title="Title 1">
Content 1
<AccordionItem title="Natural Language Classifier">
<p>Natural Language Classifier uses advanced natural language processing and machine learning techniques to create custom classification models. Users train their data and the service predicts the appropriate category for the inputted text.
</p>
</AccordionItem>
<AccordionItem title="Title 2">
Content 2
<AccordionItem title="Natural Language Understanding">
Analyze text to extract meta-data from content such as concepts, entities, emotion, relations, sentiment and more.
</AccordionItem>
<AccordionItem title="Title 3">
Content 3
<AccordionItem title="Language Translator">
<p>Translate text, documents, and websites from one language to another. Create industry or region-specific translations via the service's customization capability.</p>
</AccordionItem>
</Accordion>
### Small size
<Accordion size="sm">
<AccordionItem title="Title 1">
Content 1
<AccordionItem title="Natural Language Classifier">
<p>Natural Language Classifier uses advanced natural language processing and machine learning techniques to create custom classification models. Users train their data and the service predicts the appropriate category for the inputted text.
</p>
</AccordionItem>
<AccordionItem title="Title 2">
Content 2
<AccordionItem title="Natural Language Understanding">
Analyze text to extract meta-data from content such as concepts, entities, emotion, relations, sentiment and more.
</AccordionItem>
<AccordionItem title="Title 3">
Content 3
<AccordionItem title="Language Translator">
<p>Translate text, documents, and websites from one language to another. Create industry or region-specific translations via the service's customization capability.</p>
</AccordionItem>
</Accordion>
### Disabled
<Accordion disabled>
<AccordionItem title="Title 1">
Content 1
<AccordionItem title="Natural Language Classifier">
<p>Natural Language Classifier uses advanced natural language processing and machine learning techniques to create custom classification models. Users train their data and the service predicts the appropriate category for the inputted text.
</p>
</AccordionItem>
<AccordionItem title="Title 2">
Content 2
<AccordionItem title="Natural Language Understanding">
Analyze text to extract meta-data from content such as concepts, entities, emotion, relations, sentiment and more.
</AccordionItem>
<AccordionItem title="Title 3">
Content 3
<AccordionItem title="Language Translator">
<p>Translate text, documents, and websites from one language to another. Create industry or region-specific translations via the service's customization capability.</p>
</AccordionItem>
</Accordion>
### Disabled (item)
<Accordion>
<AccordionItem disabled title="Title 1">
Content 1
<AccordionItem disabled title="Natural Language Classifier">
<p>Natural Language Classifier uses advanced natural language processing and machine learning techniques to create custom classification models. Users train their data and the service predicts the appropriate category for the inputted text.
</p>
</AccordionItem>
<AccordionItem title="Title 2">
Content 2
<AccordionItem title="Natural Language Understanding">
Analyze text to extract meta-data from content such as concepts, entities, emotion, relations, sentiment and more.
</AccordionItem>
<AccordionItem title="Title 3">
Content 3
<AccordionItem title="Language Translator">
<p>Translate text, documents, and websites from one language to another. Create industry or region-specific translations via the service's customization capability.</p>
</AccordionItem>
</Accordion>