Example of Latte filter and jQuery mobile

default.phtml

{define detail}
<div data-role="page" id="{$name|webalize}">

	<div data-role="header">
		<h1>Detail vozidla {$name}</h1>		
	</div>

	<div data-role="content">
		<div data-role="collapsible">
			<h3>Popis vozidla</h3>
			<p>{$desc}</p>
		</div>

		<h2>Cena: {$price|number:2, ",", " "} CZK</h2>

		<p>Zpet na seznam vozidel <a data-rel="back" href="#list">zpet</a>.</p>
	</div>

	<div data-role="footer">
		<h4><a href="http://wop.vlcovice.net">Vaclav Bohac</a> &copy; 2011.</h4>
	</div>

</div>
{/define}

{* Example data *}
{var cars => [
	[
		"name" => "TATRA T815",
		"desc" => "Lorem ipsum ...",
		"price" => 150000
	],
	[
		"name" => "TATRA T815 TERNO",
		"desc" => "Dolor sit amet ...",
		"price" => 2000000
	]
]}

{block content}
<div data-role="page" id="list">

	<div data-role="header">
		<h1>Seznam nakladnich vozidel</h1>		
	</div>

	<div data-role="content">
		<ul>
		{foreach $cars as $car}
			<li><a href="#{$car[name]|webalize}">{$car[name]}</a></li>
		{/foreach}
		</ul>
	</div>

	<div data-role="footer">
		<h4><a href="http://wop.vlcovice.net">Vaclav Bohac</a> &copy; 2011.</h4>
	</div>

</div>

{foreach $cars as $car}
	{include #detail name => $car[name], desc => $car[desc], price => $car[price]}
{/foreach}