100 lines
5.4 KiB
HTML
100 lines
5.4 KiB
HTML
<script type="text/html" id="slideOutMenuItemTemplate">
|
|
<div data-bind="visible: visible, css: { 'dx-state-disabled': disabled }" data-options="dxTemplate : { name: 'item' } ">
|
|
<div>
|
|
<!-- ko dxIcon: $data.icon || $data.iconSrc --><!-- /ko -->
|
|
<div class="dx-navigation-item" data-bind="text: text"></div>
|
|
</div>
|
|
</div>
|
|
</script>
|
|
|
|
<div class="slideout-layout" data-options="dxLayout : { name: 'slideout', platform: 'ios' } ">
|
|
<div class="layout-header dx-toolbar-wrapper dx-toolbar-background" data-options="dxContentPlaceholder : { name: 'header', animation: 'view-header-toolbar' }">
|
|
<div class="layout-toolbar" data-bind="dxToolbar: { items: [{ location: 'before', template: 'nav-button', visible: false }, { location: 'center', text: title }] }"
|
|
data-options="dxCommandContainer : { id: 'ios-header-toolbar' }">
|
|
<div class="nav-button-item" data-options="dxTemplate : { name: 'nav-button' } ">
|
|
<div class="nav-button" data-bind="dxButton: { icon: 'menu' }"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layout-content" data-options="dxContentPlaceholder : { name: 'content', animation: 'view-content-change' } ">
|
|
</div>
|
|
|
|
<div class="view-footer" data-options="dxContent : { targetPlaceholder: 'view-footer' } ">
|
|
<div class="view-toolbar-bottom" data-bind="dxToolbar: { visible: true }" data-options="dxCommandContainer : { id: 'ios-view-footer' } "></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="slideout-layout" data-options="dxLayout : { name: 'slideout', platform: 'android' } ">
|
|
<div class="layout-frame" data-options="dxTransition: { name: 'main', animation: 'view-content-change' }">
|
|
<div class="layout-header dx-toolbar-wrapper">
|
|
<div class="layout-toolbar" data-bind="dxToolbar: { items: [{ location: 'before', template: 'nav-button', visible: false }, { location: 'center', text: title }] }"
|
|
data-options="dxCommandContainer : { id: 'android-header-toolbar' }">
|
|
<div class="nav-button-item" data-options="dxTemplate : { name: 'nav-button' } ">
|
|
<div class="nav-button" data-bind="dxButton: { icon: 'menu' }"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layout-content" data-options="dxContentPlaceholder : { name: 'content' } ">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="slideout-layout" data-options="dxLayout : { name: 'slideout', platform: 'generic' } ">
|
|
<div class="layout-header dx-toolbar-wrapper dx-toolbar-background" data-options="dxContentPlaceholder : { name: 'header', animation: 'view-header-toolbar' }">
|
|
<div class="layout-toolbar" data-bind="dxToolbar: { items: [{ location: 'before', template: 'nav-button', visible: false }, { location: 'center', text: title }] }"
|
|
data-options="dxCommandContainer : { id: 'generic-header-toolbar' }">
|
|
<div class="nav-button-item" data-options="dxTemplate : { name: 'nav-button' } ">
|
|
<div class="nav-button" data-bind="dxButton: { icon: 'menu' }"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layout-content" data-options="dxContentPlaceholder : { name: 'content', animation: 'view-content-change' } ">
|
|
</div>
|
|
|
|
<div class="view-footer" data-options="dxContent : { targetPlaceholder: 'view-footer' } ">
|
|
<div class="view-toolbar-bottom" data-bind="dxToolbar: { visible: true }" data-options="dxCommandContainer : { id: 'generic-view-footer' } ">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="slideout-layout" data-options="dxLayout : { name: 'slideout', platform: 'win' } ">
|
|
<div class="layout-frame" data-options="dxTransition: { name: 'main', animation: 'view-content-change' }">
|
|
<div class="layout-header">
|
|
<div class="layout-toolbar" data-bind="dxToolbar: { items: [{ location: 'before', template: 'nav-button', visible: false }, { location: 'center', text: title }] }">
|
|
<div class="nav-button-item" data-options="dxTemplate : { name: 'nav-button' } ">
|
|
<div class="nav-button" data-bind="dxButton: { icon: 'menu' }"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layout-content" data-options="dxContentPlaceholder : { name: 'content' } ">
|
|
</div>
|
|
|
|
<div class="layout-toolbar-bottom" data-bind="dxToolbar: { visible: false, renderAs: 'bottomToolbar' }" data-options="dxCommandContainer : { id: 'win10-phone-appbar' } ">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="slideout-layout" data-options="dxLayout : { name: 'slideout', platform: 'win', version: [8] } ">
|
|
<div class="layout-frame" data-options="dxTransition: { name: 'main', animation: 'view-content-change' }">
|
|
<div class="layout-header">
|
|
<div class="layout-toolbar" data-bind="dxToolbar: { items: [{ location: 'before', template: 'nav-button', visible: false }, { location: 'center', text: title }] }">
|
|
<div class="nav-button-item" data-options="dxTemplate : { name: 'nav-button' } ">
|
|
<div class="nav-button" data-bind="dxButton: { icon: 'menu' }"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layout-content" data-options="dxContentPlaceholder : { name: 'content' } ">
|
|
</div>
|
|
|
|
<div class="layout-toolbar-bottom" data-bind="dxToolbar: { visible: false, renderAs: 'bottomToolbar' }" data-options="dxCommandContainer : { id: 'win8-phone-appbar' } ">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|