<!-- This is div is required -->
<div id="complete_example"></div>

<!-- place your example between these tags, with correct indentation and whitespace (by default, this serves as user-facing HTML example). -->
<div id="e_example">
<div class="palm-button secondary" id="default_button" x-mojo-touch-feedback="delayed">
	<div class="palm-button-wrapper" x-mojo-loc="">
		Default Dialog
	</div>
</div>
<div class="palm-button secondary" id="two_button" x-mojo-touch-feedback="delayed">
	<div class="palm-button-wrapper" x-mojo-loc="">
		Two Button Dialog
	</div>
</div>
<div class="palm-button secondary" id="error_button" x-mojo-touch-feedback="delayed">
	<div class="palm-button-wrapper" x-mojo-loc="">
		Error Dialog
	</div>
</div>
<div class="palm-button secondary" id="date_picker_button" x-mojo-touch-feedback="delayed">
	<div class="palm-button-wrapper" x-mojo-loc="">
		Custom UI - Date Picker
	</div>
</div>
<div class="palm-button secondary" id="username_password_button" x-mojo-touch-feedback="delayed">
	<div class="palm-button-wrapper" x-mojo-loc="">
		Custom UI - Name &amp; Password
	</div>
</div>
<div class="palm-button secondary" id="all_buttons" x-mojo-touch-feedback="delayed">
	<div class="palm-button-wrapper" x-mojo-loc="">
		All Buttons
	</div>
</div></div>

<!-- place additional context, explanation or info between these tags -->
<div id="e_about">
	
</div>

<!-- leave this blank for default html (above), or place code here to override -->
<div id="e_html">
	custom dialog template:
	
	<div class="palm-dialog-content">
		<div class="palm-dialog-title">
			Title
		</div>
		<div class="palm-dialog-separator"></div>
		<div class="palm-dialog-message">
			Message
		</div>
	</div>
	<div class="palm-dialog-buttons">
	  	<!-- buttons -->
	</div>	
</div>

<!-- list developer-facing css pertinent to this example, between these tags -->
<div id="e_css">

</div>