This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="section-container vertical-tabs" data-section="vertical-tabs"> | |
<section> | |
<p class="title" data-section-title><a href="#">Section 1</a></p> | |
<div class="content" data-section-content> | |
<p>Content of section 1.</p> | |
</div> | |
</section> | |
<section> | |
<p class="title" data-section-title><a href="#">Section 2</a></p> | |
<div class="content" data-section-content> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="section-container accordion" data-section="accordion"> | |
<section> | |
<p class="title" data-section-title><a href="#">Section 1</a></p> | |
<div class="content" data-section-content> | |
<p>Content of section 1.</p> | |
</div> | |
</section> | |
<section> | |
<p class="title" data-section-title><a href="#">Section 2</a></p> | |
<div class="content" data-section-content> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="section-container auto" data-section> | |
<section> | |
<p class="title" data-section-title><a href="#panel1">Section 1</a></p> | |
<div class="content" data-section-content> | |
<p>Content of section 1.</p> | |
</div> | |
</section> | |
<section> | |
<p class="title" data-section-title><a href="#panel2">Section 2</a></p> | |
<div class="content" data-section-content> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<a href="#" class="button success" data-dropdown="tinyDrop">Link Dropdown »</a> | |
<ul id="tinyDrop" class="f-dropdown" data-dropdown-content> | |
<li><a href="#">This is a link</a></li> | |
<li><a href="#">This is another</a></li> | |
<li><a href="#">Yet another</a></li> | |
</ul> | |
<a href="#" class="button success" data-dropdown="contentDrop">Content Dropdown »</a> | |
<div id="contentDrop" class="f-dropdown content medium" data-dropdown-content> | |
<h4>Title</h4> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<a href="#" data-reveal-id="firstModal" class="radius button success">Example Modal</a> | |
<a href="#" data-reveal-id="videoModal" class="radius button success">Example Modal w/Video</a> | |
<!-- Reveal Modals begin --> | |
<div id="firstModal" class="reveal-modal"> | |
<h2>This is a modal.</h2> | |
<p>Reveal makes these very easy to summon and dismiss. The close button is simply an anchor with a unicode character icon and a class of <code>close-reveal-modal</code>. Clicking anywhere outside the modal will also dismiss it.</p> | |
<p>Finally, if your modal summons another Reveal modal, the plugin will handle that for you gracefully.</p> | |
<p><a href="#" data-reveal-id="secondModal" class="secondary button">Second Modal...</a></p> | |
<a class="close-reveal-modal">×</a> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<a href="#" data-dropdown="drop1">Has Dropdown »</a> | |
<ul id="drop1" class="f-dropdown" data-dropdown-content> | |
<li><a href="#">This is a link</a></li> | |
<li><a href="#">This is another</a></li> | |
<li><a href="#">Yet another</a></li> | |
</ul> | |
<a href="#" class="button" data-dropdown="contentDrop">Content Dropdown »</a> | |
<div id="contentDrop" class="f-dropdown content medium" data-dropdown-content> | |
<h4>Title</h4> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<a href="#" data-dropdown="drop1">Has Dropdown »</a> | |
<ul id="drop1" class="f-dropdown" data-dropdown-content> | |
<li><a href="#">This is a link</a></li> | |
<li><a href="#">This is another</a></li> | |
<li><a href="#">Yet another</a></li> | |
</ul> | |
<a href="#" class="button" data-dropdown="contentDrop">Content Dropdown »</a> | |
<div id="contentDrop" class="f-dropdown content medium" data-dropdown-content> | |
<h4>Title</h4> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<a href="#" data-dropdown="drop1">Has Dropdown »</a> | |
<ul id="drop1" class="f-dropdown" data-dropdown-content> | |
<li><a href="#">This is a link</a></li> | |
<li><a href="#">This is another</a></li> | |
<li><a href="#">Yet another</a></li> | |
</ul> | |
<a href="#" class="button" data-dropdown="contentDrop">Content Dropdown »</a> | |
<div id="contentDrop" class="f-dropdown content medium" data-dropdown-content> | |
<h4>Title</h4> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<a href="#" data-dropdown="drop1">Has Dropdown »</a> | |
<ul id="drop1" class="f-dropdown" data-dropdown-content> | |
<li><a href="#">This is a link</a></li> | |
<li><a href="#">This is another</a></li> | |
<li><a href="#">Yet another</a></li> | |
</ul> | |
<a href="#" class="button" data-dropdown="contentDrop">Content Dropdown »</a> | |
<div id="contentDrop" class="f-dropdown content medium" data-dropdown-content> | |
<h4>Title</h4> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<a href="#" data-dropdown="drop1">Has Dropdown »</a> | |
<ul id="drop1" class="f-dropdown" data-dropdown-content> | |
<li><a href="#">This is a link</a></li> | |
<li><a href="#">This is another</a></li> | |
<li><a href="#">Yet another</a></li> | |
</ul> | |
<a href="#" class="button" data-dropdown="contentDrop">Content Dropdown »</a> | |
<div id="contentDrop" class="f-dropdown content medium" data-dropdown-content> | |
<h4>Title</h4> |