javascript-mobile-app-template
Version:
Simple and fully customizable user interface template. Design for mobile app development on Capacitor or Cordova. Platforms: Android, iOS, Web.
111 lines (92 loc) • 7.22 kB
HTML
<!-- Bismillah -->
<html>
<head>
<title>JavaScript Mobile App Template and UI Components</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, viewport-fit=cover">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<!-- LIBRARIES -->
<link rel="preload" href="basic/font/open-sans/OpenSans-Regular.ttf" as="font" crossorigin="anonymous">
<link rel="preload" href="basic/font/open-sans/OpenSans-Bold.ttf" as="font" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="basic/basic.min.css">
<script src="basic/basic.js" type="text/javascript" charset="utf-8"></script>
<!-- WHICH FRAMEWORK DO YOU USE? Cordova or Capacitor -->
<script src="cordova.js" type="text/javascript" charset="utf-8"></script>
<script src="capacitor.js" type="text/javascript" charset="utf-8"></script>
<!-- GLOBAL VARIABLES -->
<script src="js/global.js" type="text/javascript" charset="utf-8"></script>
<!-- CONTROLLERS -->
<script src="js/control/database.js" type="text/javascript" charset="utf-8"></script>
<!-- UI COMPONENTS -->
<script src="components/ui-core.js" type="text/javascript" charset="utf-8"></script>
<script src="components/utils.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-title.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-left-title.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-click-effect.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-search-box.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-close-button.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-item-list.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-select-text.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-stepper.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-toggle.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-web-view.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-waiting-view.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-group.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-cells.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-notice.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-tabs.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-page-control.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-action-button.js" type="text/javascript" charset="utf-8"></script>
<script src="components/ui-progress-bar.js" type="text/javascript" charset="utf-8"></script>
<!-- SHARED FUNCTIONS -->
<script src="js/app.js" type="text/javascript" charset="utf-8"></script>
<!-- MOBILE APP STRUCTURE -->
<script src="js/style.js" type="text/javascript" charset="utf-8"></script>
<script src="js/view/launch-view.js" type="text/javascript" charset="utf-8"></script>
<script src="js/view/safe-area.js" type="text/javascript" charset="utf-8"></script>
<script src="js/view/default-view.js" type="text/javascript" charset="utf-8"></script>
<script src="js/view/second-view.js" type="text/javascript" charset="utf-8"></script>
<script src="js/view/small-view.js" type="text/javascript" charset="utf-8"></script>
<script src="js/ui-top-bar.js" type="text/javascript" charset="utf-8"></script>
<script src="js/ui-bottom-bar.js" type="text/javascript" charset="utf-8"></script>
<script src="js/ui-side-bar.js" type="text/javascript" charset="utf-8"></script>
<!-- PAGES WITH OWN CONTAINER (VIEW) -->
<script src="js/view/login-view.js" type="text/javascript" charset="utf-8"></script>
<!-- PAGES -->
<script src="js/page/small/small-example-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/small/select-color-dialog.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/small/search-preview-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/small/edit-item-dialog.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/second/second-example-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/second/menu-style-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/second/security-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/second/terms-of-use-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/second/my-documents-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/second/example-viewer-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/second/template-a-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/default/default-example-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/default/bars-test-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/default/settings-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/default/tasks-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/default/examples-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/default/search-page.js" type="text/javascript" charset="utf-8"></script>
<script src="js/page/default/home-page.js" type="text/javascript" charset="utf-8"></script>
<!-- MAIN -->
<link rel="stylesheet" type="text/css" href="index.css">
<script src="index.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<!-- HTML MODELS -->
<div style="display:none">
<!-- Alternative use to create repeating patterns (See Example: html-model-usage.htm) -->
<div id="item-model-num1" class="item-model">
<div class="item-model background"></div>
<img class="item-model icon" src="{{iconFile}}">
<div class="item-model title">{{title}}</div>
<div class="item-model description">{{description}}</div>
</div>
</div>
</body>
</html>