<div id="titlebar">
	<div class="dragbar">
		<h1><span>K</span>oala</h1>
		<p class="subtitle">a cool tool for web developers</p>
	</div>
	<ul class="nav">
		<span class="minimize">{{Minimize}}</span>
		<span class="close">{{Close}}</span>
	</ul>
</div>
<div id="sidebar">
	<!-- hidden form -->
	<input type="file" class="hide" nwdirectory id="ipt_addProject"/> 
	<ul id="menus">
		<li id="addDirectory" title="{{Add Folder}}">{{Add Folder}}</li>
		<li id="log" title="{{Log}}">{{Log}}</li>
		<li id="settings" title="{{Settings}}">{{Settings}}</li>
	</ul>
	<div id="projects">
		<ul id="folders"></ul>
	</div>
</div>
<section id="main">
	<div id="addprojecttips">
		<span class="ico_forder"></span>
		<p>{{Drag and drop a folder to add project.}}</p>
	</div>
	<header id="searchbar">
		<button id="refresh">{{Refresh}}</button>
		<div class="hr"></div>
	</header>
	<section id="files">
		<!-- hidden form -->
		<input type="hidden" id="ipt_fileData"/> 
		<input type="file" class="hide" id="ipt_fileOutput" nwWorkingDir="" nwsaveas />
		<input type="file" class="hide" id="ipt_fileOutputDir" nwWorkingDir="" nwdirectory />
		<ul id="filelist"></ul>
	</section>
	<!-- type navigation -->
	<footer id="typeNav">
		<div class="hr"></div>
		<ul class="nav" id="navlist">
			<li data-type="all" class="current">All</li>
			<li data-type="style">Styles</li>
			<li data-type="script">Scripts</li>
			<li data-type="template">Tmpl</li>
			<li data-type="javascript">JS</li>
			<li data-type="css">CSS</li>
			<!-- <li data-type="image">Images</li> -->
		</ul>
	</footer>
</section>
<div id="extend">
	<div class="inner" id="compileSettings"></div>
</div>
