|
@@ -26,17 +26,19 @@
|
|
|
</head>
|
|
</head>
|
|
|
|
|
|
|
|
<body class="app">
|
|
<body class="app">
|
|
|
- <section id="login" class="splash">
|
|
|
|
|
- <article>
|
|
|
|
|
- <h1>ToDo<span class="semi-opacity">.js</span></h1>
|
|
|
|
|
- <div class="form">
|
|
|
|
|
- <input type="text" placeholder="Type your user" disabled/>
|
|
|
|
|
- <input type="password" placeholder="Type your password" disabled/>
|
|
|
|
|
- <a href="#" id="btnLogin" class="button big blue" data-icon="key">Go to app!</a>
|
|
|
|
|
- </div>
|
|
|
|
|
- <div class="copyright">Copyright TapQuo Inc, 2011</div>
|
|
|
|
|
- </article>
|
|
|
|
|
- </section>
|
|
|
|
|
|
|
+
|
|
|
|
|
+ <section id="login">
|
|
|
|
|
+ <article class="splash">
|
|
|
|
|
+ <div class="indented">
|
|
|
|
|
+ <h1>ToDo<span class="semi-opacity">.js</span></h1>
|
|
|
|
|
+ <div class="form">
|
|
|
|
|
+ <input type="text" placeholder="Type your user" disabled/>
|
|
|
|
|
+ <input type="password" placeholder="Type your password" disabled/>
|
|
|
|
|
+ <a href="#" id="btnLogin" class="button big blue" data-icon="key">Test Demo!</a>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="copyright">Copyright TapQuo Inc, 2011</div>
|
|
|
|
|
+ </article>
|
|
|
|
|
+ </section>
|
|
|
|
|
|
|
|
<section id="main">
|
|
<section id="main">
|
|
|
<header data-title="ToDo.js">
|
|
<header data-title="ToDo.js">
|
|
@@ -44,13 +46,12 @@
|
|
|
</header>
|
|
</header>
|
|
|
|
|
|
|
|
<article id="pending" class="list"></article>
|
|
<article id="pending" class="list"></article>
|
|
|
- <article id="done" class="list"><!-- data-search="contrast" --></article>
|
|
|
|
|
|
|
+ <article id="done" class="list"></article>
|
|
|
|
|
|
|
|
<footer class="toolbar">
|
|
<footer class="toolbar">
|
|
|
<nav>
|
|
<nav>
|
|
|
<a href="#pending" data-target="article" class="current" data-title="Pending ToDo's" data-icon="inbox"></a>
|
|
<a href="#pending" data-target="article" class="current" data-title="Pending ToDo's" data-icon="inbox"></a>
|
|
|
<a href="#done" data-target="article" data-title="Done ToDo's" data-icon="folder"></a>
|
|
<a href="#done" data-target="article" data-title="Done ToDo's" data-icon="folder"></a>
|
|
|
- <a href="#settings" data-target="section" data-icon="config"></a>
|
|
|
|
|
</nav>
|
|
</nav>
|
|
|
</footer>
|
|
</footer>
|
|
|
</section>
|
|
</section>
|
|
@@ -59,75 +60,64 @@
|
|
|
<header data-back="home articblue" data-title="View ToDo's" >
|
|
<header data-back="home articblue" data-title="View ToDo's" >
|
|
|
<a href="#" id="btnDoneTodo" class="button onright blue" data-icon="check"> Done</a>
|
|
<a href="#" id="btnDoneTodo" class="button onright blue" data-icon="check"> Done</a>
|
|
|
</header>
|
|
</header>
|
|
|
- <article>
|
|
|
|
|
- <p class="form">
|
|
|
|
|
- <label>Name</label>
|
|
|
|
|
- <input type="text" id="txtEditName" placeholder="Input text"/>
|
|
|
|
|
- <label>Description</label>
|
|
|
|
|
- <textarea id="txtEditDescription" placeholder="Textarea sample"></textarea>
|
|
|
|
|
- <label>Type</label>
|
|
|
|
|
- <label class="select">
|
|
|
|
|
- <select id="txtEditType">
|
|
|
|
|
- <option value="1">One</option>
|
|
|
|
|
- <option value="2">Two</option>
|
|
|
|
|
- <option value="3">Three</option>
|
|
|
|
|
- </select>
|
|
|
|
|
- </label>
|
|
|
|
|
- </p>
|
|
|
|
|
|
|
+ <article class="list">
|
|
|
|
|
+ <div class="indented">
|
|
|
|
|
+ <ul class="form">
|
|
|
|
|
+ <li class="dark">
|
|
|
|
|
+ <label>Name</label>
|
|
|
|
|
+ <input type="text" id="txtEditName" placeholder="Input text"/>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <label>Description</label>
|
|
|
|
|
+ <textarea id="txtEditDescription" placeholder="Textarea sample"></textarea>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <label>Type</label>
|
|
|
|
|
+ <label class="select">
|
|
|
|
|
+ <select id="txtEditType">
|
|
|
|
|
+ <option value="1">One</option>
|
|
|
|
|
+ <option value="2">Two</option>
|
|
|
|
|
+ <option value="3">Three</option>
|
|
|
|
|
+ </select>
|
|
|
|
|
+ </label>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ </ul>
|
|
|
|
|
+ <a href="#" id="btnUpdateTodo" class="button big green" data-icon="write">Update</a>
|
|
|
|
|
+ <a href="#" id="btnDeleteTodo" class="button big red" data-icon="trash">Delete</a>
|
|
|
|
|
+ </div>
|
|
|
</article>
|
|
</article>
|
|
|
- <footer class="toolbar">
|
|
|
|
|
- <nav>
|
|
|
|
|
- <a href="#" id="btnUpdateTodo" data-icon="write"></a>
|
|
|
|
|
- <a href="#" id="btnDeleteTodo" data-icon="trash"></a>
|
|
|
|
|
- </nav>
|
|
|
|
|
- </footer>
|
|
|
|
|
</section>
|
|
</section>
|
|
|
|
|
|
|
|
<section id="new">
|
|
<section id="new">
|
|
|
<header data-back="home articblue" data-title="New ToDo"></header>
|
|
<header data-back="home articblue" data-title="New ToDo"></header>
|
|
|
- <article>
|
|
|
|
|
- <p class="form">
|
|
|
|
|
- <label>Name</label>
|
|
|
|
|
- <input type="text" id="txtNewName" placeholder="Input text"/>
|
|
|
|
|
- <label>Description</label>
|
|
|
|
|
- <textarea id="txtNewDescription" placeholder="Textarea sample"></textarea>
|
|
|
|
|
- <label>Type</label>
|
|
|
|
|
- <label class="select">
|
|
|
|
|
- <select id="txtNewType">
|
|
|
|
|
- <option value="1">One</option>
|
|
|
|
|
- <option value="2">Two</option>
|
|
|
|
|
- <option value="3">Three</option>
|
|
|
|
|
- </select>
|
|
|
|
|
- </label>
|
|
|
|
|
- <br/>
|
|
|
|
|
-
|
|
|
|
|
- <a href="#" id="btnNewTodo" class="button big blue" data-icon="check">Add ToDo</a>
|
|
|
|
|
- <a href="#back" data-target="section" class="button big red" data-icon="cancel">Cancel</a>
|
|
|
|
|
- </p>
|
|
|
|
|
|
|
+ <article class="list">
|
|
|
|
|
+ <div class="indented">
|
|
|
|
|
+ <ul class="form">
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <label>Name</label>
|
|
|
|
|
+ <input type="text" id="txtNewName" placeholder="Input text"/>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <label>Description</label>
|
|
|
|
|
+ <textarea id="txtNewDescription" placeholder="Textarea sample"></textarea>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ <li>
|
|
|
|
|
+ <label>Type</label>
|
|
|
|
|
+ <label class="select">
|
|
|
|
|
+ <select id="txtNewType">
|
|
|
|
|
+ <option value="1">One</option>
|
|
|
|
|
+ <option value="2">Two</option>
|
|
|
|
|
+ <option value="3">Three</option>
|
|
|
|
|
+ </select>
|
|
|
|
|
+ </label>
|
|
|
|
|
+ </li>
|
|
|
|
|
+ </ul>
|
|
|
|
|
+ <a href="#" id="btnNewTodo" class="button big blue" data-icon="check">Add ToDo</a>
|
|
|
|
|
+ <a href="#back" data-target="section" class="button big red" data-icon="cancel">Cancel</a>
|
|
|
|
|
+ </div>
|
|
|
</article>
|
|
</article>
|
|
|
</section>
|
|
</section>
|
|
|
|
|
|
|
|
- <section id="settings">
|
|
|
|
|
- <header data-back="home articblue" data-title="Settings"></header>
|
|
|
|
|
- <article>
|
|
|
|
|
- <p class="form">
|
|
|
|
|
- <label>Your name:</label>
|
|
|
|
|
- <input type="text" id="txtName" placeholder="Type your name"/>
|
|
|
|
|
-
|
|
|
|
|
- <label>Available task types:</label>
|
|
|
|
|
- <input type="text" id="txtType" placeholder="Type new type of task"/>
|
|
|
|
|
- <label class="select">
|
|
|
|
|
- <select id="txtTypes">
|
|
|
|
|
- <option value="1">One</option>
|
|
|
|
|
- <option value="2">Two</option>
|
|
|
|
|
- <option value="3">Three</option>
|
|
|
|
|
- </select>
|
|
|
|
|
- </label>
|
|
|
|
|
- <a href="#" id="btnNewType" class="button big articblue" data-icon="check">Add new type</a>
|
|
|
|
|
- </p>
|
|
|
|
|
- </article>
|
|
|
|
|
- </section>
|
|
|
|
|
-
|
|
|
|
|
<!-- LungoJS (Production mode) -->
|
|
<!-- LungoJS (Production mode) -->
|
|
|
<script src="../../release/lungo-1.0.4.packed.js"></script>
|
|
<script src="../../release/lungo-1.0.4.packed.js"></script>
|
|
|
|
|
|