mirror of
https://github.com/hanzoai/jube-fork.git
synced 2026-11-03 01:01:41 +00:00
113 lines
4.3 KiB
HTML
Executable File
113 lines
4.3 KiB
HTML
Executable File
<div data-role="view" id="toolbar-mobile" data-use-native-scrolling="true">
|
|
<header data-role="header">
|
|
<div data-role="toolbar" data-items='[
|
|
{
|
|
id: "back",
|
|
type: "button",
|
|
icon: "arrow-w",
|
|
overflow: "never",
|
|
align: "left",
|
|
url: "#:back"
|
|
},
|
|
{
|
|
type: "splitButton", id: "viewName", name: "viewName", text: "Inbox (18)", menuButtons: [
|
|
{ id: "option1", text: "Drafts (3)" },
|
|
{ id: "option2", text: "Sent Mail" },
|
|
{ id: "option3", text: "Junk Mail (21)" },
|
|
{ id: "option4", text: "Trash (53)" }
|
|
],
|
|
overflow: "never",
|
|
align: "left"
|
|
},
|
|
|
|
{ type: "button", showText: "overflow", id: "prev", text: "Previous", icon: "previous", enable: false, align: "left" },
|
|
{ type: "button", showText: "overflow", id: "next", text: "Next", icon: "next", align: "left" },
|
|
{ type: "button", showText: "overflow", id: "flag", text: "Flag", icon: "toprated", click: function(e){$("#flags").data("kendoMobileActionSheet").open(e.target)} },
|
|
{ type: "button", showText: "overflow", id: "reply", text: "Reply", icon: "reply", click: function(e){$("#reply-options").data("kendoMobileActionSheet").open(e.target)} },
|
|
{ type: "button", showText: "overflow", id: "disabledBtn", text: "Delete", icon: "delete", click: function(e){$("#delete-confirm").data("kendoMobileActionSheet").open(e.target)} },
|
|
{ type: "button", showText: "overflow", id: "viewSource", text: "View Source", icon: "source-code", click: goToSourceCode },
|
|
|
|
{ type: "button", text: "Organize", overflow: "always", icon: "organize", enable: false }
|
|
]'>
|
|
</div>
|
|
</header>
|
|
|
|
<div class="mail-content">
|
|
<h2>RE: New "Your Links" menu</h2>
|
|
<h3>From: John Doe</h3>
|
|
<p>Excellent feature! Except that I instantly imagined that this would be how I keep track of all those demo pages that I wanted to re-visit or remember existed. Any chance you could include the bookmark feature on the demo pages?</p>
|
|
</div>
|
|
|
|
<ul data-role="actionsheet" id="flags">
|
|
<li class="km-actionsheet-title">Flag</li>
|
|
<li><a href="#">Flag</a></li>
|
|
<li><a href="#">Mark as Unread</a></li>
|
|
<li><a href="#">Move to Junk</a></li>
|
|
</ul>
|
|
|
|
<ul data-role="actionsheet" id="reply-options">
|
|
<li class="km-actionsheet-title">Reply</li>
|
|
<li><a href="#">Reply</a></li>
|
|
<li><a href="#">Reply to All</a></li>
|
|
<li><a href="#">Forward</a></li>
|
|
</ul>
|
|
|
|
<ul data-role="actionsheet" id="delete-confirm">
|
|
<li class="km-actionsheet-title">Delete</li>
|
|
<li><a href="#">Delete</a></li>
|
|
</ul>
|
|
|
|
<footer data-role="footer">
|
|
<div data-role="tabstrip">
|
|
<a data-role="button" data-icon="home" data-badge="18">Inbox</a>
|
|
<a data-role="button" data-icon="compose" data-badge="3">Drafts</a>
|
|
<a data-role="button" data-icon="organize" data-badge="21">Junk</a>
|
|
<a data-role="button" data-icon="trash" data-badge="53">Trash</a>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
|
|
<style>
|
|
.km-android #toolbar-mobile {
|
|
-webkit-box-direction: normal;
|
|
-moz-box-direction: normal;
|
|
-webkit-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
|
|
#back .km-arrow-w:after,
|
|
#back .km-arrow-w:before
|
|
{
|
|
content: "\e013";
|
|
}
|
|
|
|
#examples.km-flat #back .km-arrow-w
|
|
{
|
|
font-size: 1em;
|
|
}
|
|
|
|
.km-previous:after,
|
|
.km-previous:before
|
|
{
|
|
content: "\e011";
|
|
}
|
|
|
|
.km-next:after,
|
|
.km-next:before
|
|
{
|
|
content: "\e012";
|
|
}
|
|
|
|
.km-ios7 #viewName_wrapper,
|
|
#examples.km-flat #viewName_wrapper
|
|
{
|
|
margin-left: -.5em;
|
|
}
|
|
|
|
.mail-content h2,
|
|
.mail-content h3,
|
|
.mail-content p {
|
|
margin-top: 1em;
|
|
}
|
|
</style>
|