<p>A basic accordion does not add any extra formatting</p>
<div class="ui basic accordion">
<div class="active title">
<i class="dropdown icon"></i>
What is a dog?
</div>
<div class="active content">
<p>A dog is a type of domesticated animal. Known for its loyalty and faithfulness, it can be found as a welcome guest in many households across the world.</p>
</div>
<div class="title">
<i class="dropdown icon"></i>
What kinds of dogs are there?
</div>
<div class="content">
<p>There are many breeds of dogs. Each breed varies in size and temperament. Owners often select a breed of dog that they find to be compatible with their own lifestyle and desires from a companion.</p>
</div>
<div class="title">
<i class="dropdown icon"></i>
How do you acquire a dog?
</div>
<div class="content">
<p>Three common ways for a prospective owner to acquire a dog is from pet shops, private owners, or shelters.</p>
<p>A pet shop may be the most convenient way to buy a dog. Buying a dog from a private owner allows you to assess the pedigree and upbringing of your dog before choosing to take it home. Lastly, finding your dog from a shelter, helps give a good home to a dog who may not find one so readily.</p>
</div>
</div>
</div>
<h2 class="ui dividing header">Examples</h2>
<h2 class="ui dividing header">Examples</h2>
<div class="example">
<div class="example">
@ -170,9 +199,9 @@ type : 'UI Module'
<h2 class="ui dividing header">Variations </h2>
<h2 class="ui dividing header">Variations </h2>
<div class="example">
<div class="example">
<h4 class="ui header">Basic</h4>
<p>A basic accordion does not add any extra formatting</p>
<div class="ui basic accordion">
<h4 class="ui header">Fluid</h4>
<p>An accordion can take up the width of its container</p>
<div class="ui accordion">
<div class="active title">
<div class="active title">
<i class="dropdown icon"></i>
<i class="dropdown icon"></i>
What is a dog?
What is a dog?
@ -198,6 +227,8 @@ type : 'UI Module'
</div>
</div>
</div>
</div>
<h2 class="ui dividing header">Usage</h2>
<h2 class="ui dividing header">Usage</h2>
<h3 class="ui header">Initializing an accordion</h3>
<h3 class="ui header">Initializing an accordion</h3>
<div class="description">Most likely action will be determined by type of dropdown, for example a selection dropdown will automatically use updateForm</div>